Shuddi Vydhia - Learning Platform

A project involving collaboration with UX designers (John Koffi, Eric Khuu, and Angela Yang) as well as UI designers (Suri Wang) which was my primary role, and Project Manager Eki Ero, was undertaken to create a new learning platform for children in India, replacing the outdated existing platform.

Role

UI Designer

Timeframe

November 2023 – May 2024

Industry

Educational

Tools

Introduction to the Project

Shuddhi Vidhya is a non-profit organization based in India, dedicated to championing children’s right to education, particularly those in underprivileged and rural communities. With a mission to enrich the learning journey, the founder of the organization has decided to redesign their learning platform to ensure greater accessibility, interactivity, and effectiveness in delivering educational content to marginalized communities.

Goals

Developing an all-in-one learning platform for students and instructors ensures that students can easily and effortlessly complete their courses, while enabling instructors to maintain teaching quality by addressing any questions and monitoring student progress

Old Learning Platform of Shuddhi Vidhya

1.

Design Process

The design process used by the UX Team was the double diamond.

2.

Benchmark

In the discovery phase, a comparative analysis of various companies within the educational market was conducted, evaluating their pros and cons. In my role, I used this benchmark to delve into the UI design of the competition.

3.

User Personas

The User Personas here were divided into student and instructor, the two main audiences.

4.

Sitemap

5.

User Flow

User flows, such as the one shown below, were created to enhance our understanding and design of the screens.

6.

Lo-Fi Wireframes

After the research phase, I began designing low-fidelity wireframes and brainstorming potential pages, as showcased below. Some of these pages were exploratory, serving as initial concepts to experiment with different layouts before finalizing to the final UI design.

6.

High-Fidelity Wireframes

Here I show some of the screens made for the final UI, and some of the features of each page.

Homepage

We aimed to evoke a sense of youthful energy and vitality for users through bright and diverse colors. On the homepage, users can view students showcase, explore available courses, complete registration and login.

Courses

Introducing all courses offered by Shuddhi, accessible with or without login, each accompanied by a brief overview to aid students in grasping the course content swiftly. Upon selecting a course, users are directed to its dedicated page, featuring a detailed and well-organized introduction to the course.

Other Pages

The remaining pages of the website also featured a visually appealing and consistent design, which is crucial for engaging students, with pages like “News” to help the user engaged and update

For Students - Platform

After logging in, in this area students can browse courses, track their progress, message tutors, and more. The UI was designed to facilitate easy navigation and enhance the platform’s overall aesthetics.

Courses

Students can browse the courses they are enrolled in, view upcoming assignments, and check their grades. Most importantly, SmartScheduler can help students personalize their study plans.
This feature lets users pause and resume a timer, while also emphasizing the upcoming content that needs to be studied

Leaderboard

By understanding the learning progress of other students and introducing rankings, we aim to foster a sense of healthy competition among students, while also providing the attention and recognition they need.

Announcements

Students can receive the latest news from the website, keeping them informed about the upcoming events.

Message

When students wish to communicate with instructors, they can easily contact the instructors of each course through the message feature

For Teachers - Platform

The inability to track students learning progress and the standardization of video courses were the most pressing issues instructors want to address. The new website would allow teachers to introduce more learning materials to enable multi-channel teaching. Teachers will not only be able to chat privately with students but also gain insight into students’ overall learning progress through backend reports.

Courses

Provided instructors with greater authority to construct ideal courses ensuring teaching quality.

Reports

Clearly showcase students’ overall learning status and progress through visual dashboards.

Support Tickets

Allow instructors to easily track support tickets and annotate the progress of each case.

7.

Style Guide

7.

Prototype

The prototype was created for internal testing and to facilitate better understanding for the development team after delivery.

7.

Challenges

The wireframes were distributed among three UX designers, each with varying levels of experience. This resulted in some wireframes lacking continuity, necessitating additional time to reorganize and refine them. Continuous communication was essential to grasp the underlying rationale and logic behind their respective designs. 

8.

Next Steps

At present, we have completed the design for Phase I. Once the learning platform is officially accessible to students, we will make modifications to the website based on the feedback received. Concurrently, Phase II design work will commence, focusing on the implementation of student incentive mechanisms. The current plan involves students earning points by completing courses and using these points to redeem desired rewards on the platform.

Scroll to Top