Client
The University of Calgary, one of Canada’s top research-intensive universities focused on contributing to society by finding solutions through research to everyday most persistent challenges
Services
Product Development, Legacy Modernization
Industry
Education, Healthcare
Tech
ReactJS, Redux, React-router, Redux-saga, Flow-types, Formik, Axios, D3, Material-UI, Styled-components, React-DnD

Challenge

OLab (OpenLabyrinth) is an open-source web-based education research platform that supports the creation and publication of virtual scenarios. Much of the earlier focus of Olab was on Virtual Patient (VP) cases – online representations of realistic clinical cases – that play an essential role in medical education. Designed to replicate clinical scenarios, they allow for the safe and risk-free training of medical students in cognitive thinking, clinical reasoning, and skills-based action that are critical in real-life patient care and would be dangerous to practice during a real-life emergency. Our client, a University of Calgary professor, came to us with the idea of modernizing the OLab online activity modeling system that allows users to build interactive game-informed educational activities such as virtual patients, simulations, games, mazes, and algorithms. A new system version, OLab Version 4, was expected to help create highly challenging and interactive virtual scenarios to offer a more engaging and immersive learning experience. One of the main objectives was to retain basic useful functions of the popular concept mapping tool that was first introduced in OLab3, while also making the user interface for scenario development simpler and more accessible.

We took on the following challenges:
Introduce big changes into the software architecture, while retaining some of the core data structures to allow teams to continue to use and expand their existing content
Improve the existing functionality of the elearning solution and port it over to cutting-edge technologies
Move away from a standard Model-View-Controller (MVC) architecture and migrate to an object-relational mapping (ORM) approach
Provide a simple and easily navigable user interface
Develop and implement new features to extend the Designer functionality
Extend a relatively new concept, Scoped Objects, to make the reuse of existing objects within cases more rational and extensible
Implement the Basic and Advanced Node Editor to allow map authors to quickly manage Nodes while working through the Map

Solution

The simplified concept mapping tool allows users to join the dots in an easier way for creating their pathways
Transition to a microservices architecture provides greater platform flexibility and scalability
Docker containers and an ORM approach to database schema management to make maintenance much easier for organizations
The extended concept of Scoped Objects makes it possible to easily reuse objects more broadly across multiple Maps, or even Scenarios or Servers. The Scoped Object concept was extended to a number of items in the OLab4 arsenal: Files & Media, Questions, Constants (aka Elements in OLab3) and Counters
A drag-and-drop panel that allows users to set objects to Node using short-codes and a mini admin panel that provides the ability to fill object data
Scoped Objects Picker helps to find and insert the right object (variable) into the Node as a shortcode
The Map Editor feature that helps to visualize and manage Maps: a tree of Nodes with Snap to Grid, Map Zoom, Map View modes, and other helpful functions
Node Grid Editor and Counter Grid Editor thatthat allow quick Nodes and Counters edits in bulk
Questions Editor that allows managing 10+ types of Questions (MCQ, Pick-choice, Single/multiline text, Drag & drop, SCT, SJT, Rich Text, etc.)
The Map Templates feature helps save and create a Map from a template.
The improved Create Template from Map feature allows saving the current map as a named template at any point in the map creation process
The styled-components approach enables to draw the whole list of elements and allows flexibility and reusability
UI Builder to work with drag-and-drop elements and graphs
React component implementation to create directed graph editor without implementing any of the SVG drawing or event handling logic
Olab Education Research Platform Modernization
Olab Platform Modernization

Impact

The ability to share objects across multiple maps helped to dramatically accelerate the design of some cases
The redesigned UI/UX has significantly improved the ease of use of the app
The application that was originally designed to create virtual patients now has grown far beyond these roots and supports a wider variety of educational activities
All of these activities can be tracked and analyzed, which opens up a great many research opportunities
Designed to support the delivery of teaching, the system serves somewhat as a simulator for students helping teach and level up their reasoning and decision-making skills and prepare them for real-world challenges

Latest projects