Let's Talk
LMS Design - Yellowchalk

Designing a Sturdy Learning Management System (LMS Platform)

Domain: Edtech
Platform: Web – LMS Platform
Service: UX and UI Design

The Challenge

An acclaimed name among universities in Southern India, approached us to help them go digital – (which is probably the near-future of learning). They were looking for a custom LMS platform that would be used by teachers, students, and parents.

We’d be remiss if we didn’t address the fact that the COVID-19 pandemic has changed the traditional structure of teaching along with the idea of classrooms forever. On a positive note, research suggests that online learning has been shown to increase retention of information, and takes less time.

Creating a custom LMS platform is a daunting task, and without the right planning, a simple project can turn into an incomprehensible jumble. Our challenge was to build an LMS platform that empowered all users across ages and mindsets – from students to teachers, to parents and university admins. The biggest consideration was to build a product that housed multiple users across different levels of digital literacy and technical knowledge without it being too inane for the adults to use or too boring for the younger audience so that they would lose interest.

The Approach

With the immediate shift of all educational services and institutes online during the pandemic, the phrase ‘Learning never stops’ takes on a deeper meaning. We wanted to build a system designed for maximum usability that empowered all users and acted as a solid foundation for all educational needs of all the audiences involved.

The agenda was to create a platform keeping in mind scalable design considerations. We wanted to design screen frameworks, user interface structures, and other components to enable the product to gracefully accommodate new features, new users, and dynamic content, without the need to redesign.

Our final goal was to create an online LMS platform that made the offline-online shift imperceptible.


UX Strategy

With the atmosphere of fierce competition in the industry in the Indian landscape, we wanted to add the value that only our client could give to the product.

We were intent on using data-driven insights to make sure that all users could gain the maximum potential out of the platform. After extensive user research and competitive analysis, we gleaned that an imbalance between interactivity and communication is what makes most learning systems flat and unable to mirror an offline setup. Since our main goal was to provide a smooth transition from offline to online, we designed each component with that in mind.

LMS Wireframes_1
There was no one-for-all approach. Teachers had the option of creating and sharing assignments for an entire class/a group/an individual for their assigned classes. They could also analyze the progress made in between assignments and tests, which enabled them to make an informed decision to map out an improvement plan for individuals if required. This feature brought in the best of both worlds – the use of digital technology for focused learning.

LMS Wireframes_2

We included gamification to keep all users engaged and to bridge the gap between offline and virtual classrooms. To keep up with the level of interactivity equal to that of an offline classroom, we designed an in-built messaging system and kept the status of online users visible to ease the teachers.

LMS Wireframes_3

To keep parents and guardians involved, they had an easy-to-use dashboard to view courses available to the students as well as their attendance records, test histories, and report cards. They could also use the system to get in touch and communicate with any instructor that they desired to speak with.

LMS Dashboard Wireframes_1

UI Design

For the user interface and visual design of the LMS platform, we wanted to have a simple and clean layout that presented all information in an easy to consume manner. The defined data hierarchy helped users find what they were looking for in the most straightforward way possible.

UI Design Dashboard 1
The clean and functional layout was designed to help all users access all courses and records conveniently. Taking a cue from the brand identity guidelines, we used blue and purple for header backgrounds and banners to communicate the feeling of trust and to provide a soothing element without pulling the user’s attention.

We used a discernable green and red to mark the accessibility of courses to the students. Read more about colours and psychology. The discussion panel was clearly demarcated from the course materials with the use of bold typography. The use of subtle yet simple iconography and easy to read fonts eliminated distractions and encouraged concentration.

UI Design Dashboard 2UI Design Dashboard 3

UI Design Dashboard 4

Delivering on the Promise

We’re all strangers-no-more to the importance of virtual learning. With the use of our targeted design and extensive user research, we were able to strike the right balance of usability and aesthetics across the age spectrum. The engagement on the platform shot up from 60% pre-COVID to a full capacity of 100%. Not only did our creative collaboration with the established university helped impact the lives of lakhs of students, but it also made the whole journey of their educational pursuits smooth and hassle-free for everyone involved in the process.