A Training & Learning Tool For A Tech Giant

Project Type

Design and Development

Industry

Education

Tech Stack

A Training & Learning Tool For A Tech Giant

ABOUT THE CLIENT

Established in Romania, our client runs an IT company whose goal is to uplift the lives of its users by bringing them into the digital age. Though it is a recently founded organisation, they cater to various verticals ranging from education, health and customs to nuclear, banking, utilities and production amongst other services. The company’s European-based business model boasts of unique competence centers run by internationally acclaimed specialists.

The Problem

After having a successful run with us on another project in 2017, the client returned to our doors with the idea of designing an authoring tool. Riding on the back of their prior experience with us, they knew that we were the right people to take the project forward. The tool, which was in the form of a website, was to be developed to support basic course creation for trainers, training managers and even learners. The aim of the web app was to allow its users to easily aggregate learning resources and rapidly collate this information into interactive learning courses which elevate the learning experience. With all the information and requirements set in place, we held thorough discussions with the client to sort out the best way to take the plan forward. We followed an agile approach towards the project, with five monthly milestones set, where the team would be involved in weekly scrum meetings with the client being updated through a telephonic conversation; the engagement model was decided to be fixed cost as per the client’s wishes. The client would also overview the Jira board while the team used Trello internally to oversee project management.

TEAM ON CALL

Understanding the complexity and duration of the project, a team of experts were put together after many discussions with the client. The group would consist of 2 designers who designed the app screens and a team of 7 members (consisting of 4 developers, 1 Engineering Manager, 1 Testing & Quality Assurance Engineer and 1 Client Experience Executive) who would work on the application and deliver quality as per the client’s expectation. The team was formally introduced to the client and the prerequisites were thoroughly explained before the development phase where the partner’s vision would be translated into a fully functional application.

A feature to create animations to make the learning experience truly interactive and enjoyable.

The client required the design to have accessibility as per the WCAG 2.1 AA standard.

An application with a minimalistic and modern approach that could also enable self-assessment.

OUR APPROACH

Strategy Analysis Planning UI/UX Development Testing Delivery

Strategy

We were delighted to have been a part of this journey with our partner who is a tech giant seeking to augment education through digital learning. The project which spread out for five milestones followed an agile approach to ensure that the client is in approval of the dev process.

Analysis Planning

We chose React for the Frontend, in accord to the project requirements which required a SPA, to work alongside Fabric JS which is perfect for building custom components as the desired tech stack to develop the app.

UI/UX

As we were in charge of developing the app from start to finish, we were also given the responsibility of creating wireframes for the UI which our expert designers implemented with Material-UI along with animations to enhance the learning experience.

Development

After the completion of the UI/UX process, the in-house team set about integrating the other requirements which included features to create and download courses, an option to import it offline and an online editor amongst others.

Testing

To ensure that the product had reached its maximum potential, we devised a testing method wherein tasks were broken down and assigned with regular testing taking place at the end of each sprint from both our side as well as the client’s side.

Delivery

The project is currently ongoing with new features being integrated into the app by our team who is also conducting regular checks to check for any discrepancies.

OVERCOMING CHALLENGES

As with any project of this scale, the venture came with its own set of hurdles but nothing that couldn't be solved through thorough R&D. As it was a learning application, the first challenge faced by the team was in creating a SCORM package and implementing the LMS, which is necessary for any app of this kind. We had initially set out a five month plan with five sprints but this was extended and three more additional sprints were added as the partner required additional features to be added to the application. Keeping in mind privacy constraints, we had to handle media files without collecting media information of any kind which we implemented through a process where files could be uploaded without auto-saving the content. As we could not use the traditional Canvas guidelines or a collision detection system, we had to design our own for the project. The partner also required a non-traditional building block for presentations which made use of some design elements that most traditional platforms do support. After research, we found a workaround wherein we amalgamated some features from other photo editing platforms and PowerPoint to arrive at the desired result. Considering the app followed an agile pattern, our client made some feature suggestions during the run of the project which were not previously mentioned in the documentation. We had to hold continuous discussions and think of how the features would ideally work on the application before getting around to developing it. As the project progressed we had to ensure that the app was scalable to guarantee that other features could be added in at a later stage.

In bird's eye view

JIRA tickets were used to report bugs and track feature progress.
Trello was used to manage tasks internally.
Agile framework was used to enable continuous integration and delivery.

DEVELOPMENT

The mission of the project was to design a web application that would make learning easier over digital platforms; we started off after multiple discussions with the client to accurately understand the requirements. The initial requirement of the application was

to develop features to create and download courses while designing the editor using suitable libraries. We also had to create an option where the users can create the course, modify and publish it along with ensuring that all courses could be exported into offline downloadable content.

Research was a crucial part of this venture, as the application had to be built from the ground up and we arrived at the desired tech stack that was necessary after much contemplation and through deep dialogues with the client partner. React was chosen as the apt software for the front-end, as it was perfect for designing a Single Page Application (SPA) as well as the many cross-platform coding benefits that it offers. Fabric JS, an open-source Javascript library, was chosen to custom components as it allowed us to have more flexibility and control over the canvas elements. To ensure flawless design and a user experience that is unimpaired, Material-UI was singled out as the tool for design.

We believe in delivering nothing less than perfect and Quality Assurance was integral for the project to be a success. At the end of each sprint, we devised a method where one partial tester would conduct the necessary checks from our side, while also delivering the feature to the client to enable them to conduct their own tests and get back to us with any suggestions. This process of user acceptance testing would go on for a period of twenty one days at the end of each milestone. Tasks were broken down into sub-tasks and assigned to team members internally using Trello to ensure that the flow of development was going smoothly.

FINAL IMPRESSION

The project is currently on-going, with our partners ready to give us a top rating on Clutch for the exemplary work that we have delivered over the course of this journey. As with the previous collaboration, the partner was thoroughly impressed with our work and technical expertise. It was a delight to work with a recurring client on yet another project and we hope that the professionalism we exhibited on this endeavor will lead us to many more successful collaborations.

Case Studies.