EduLearn

EduLearn is an innovative mobile application designed to provide academic assistance to students in need.
The app offers a user-friendly platform that enables secondary school students to easily find qualified tutors and access online lessons, all aimed at improving their academic performance. With Tutor Plus, students can rest assured that they will receive expert guidance and support as they navigate their academic journey.

My contribution

User experience design
User interface design
Paper &  digital wireframe
Prototyping
usability testing

My Role

UX/UI designer

Year

2023

Platform

Figma

Time Frame

3 - 4 months
Edulearn Prototype

Problem Statement

Many students face financial challenges that hinder their academic progress, forcing them to take on part-time jobs to support themselves. As a result, they may miss out on valuable study time and opportunities for academic support, such as tuition.This can lead to a disadvantage in their academic performance and limit their future prospects.

Solution

Develop an online learning platform that offers students easy access to a wide range of classes and assignments that they can practice improving their academic performance.The platform will also provide opportunities for students to seek help from qualified tutors via online channels. By offering a convenient and flexible learning experience, the platform will help students overcome barriers to academic success and achieve their goals.

Guiding Principles

Consistent and simple design language

Using design principles such as contrast, balance, proportion, hierarchy, repetition, alignment,
white space and Gestalt principles like law of similarity, proximity, etc... to create visually appealing and functional design.

Continuous iterating and improvements

I have constantly reiterate on my design to improve user's navigation and experience when using out my design.

Accessibility consideration

Descriptive text and high - contrast colours are placed
along with icons to help people with colour blindness understand the meaning of icons.

User Research Summary

Through user interviews conducted with financially disadvantaged students, it was discovered that many face difficulties accessing study materials online and cannot afford real-life tutors. These students expressed a strong desire for guidance and support from qualified tutors, but are unable to access this service due to financial constraints. The findings suggest that there is a need for an affordable and accessible platform that connects these students with qualified tutors to help them achieve academic success.

Ideation

My 8s ideation exercise on how to address the needs of the students. My focus is on how to make it intuitive navigation and easy access to lesson and classes.

Paper Wireframes

My idea is to place the navigation menu below the homepage screen. I want to prioritize important tasks on the homepage, so that users can access them quickly. These tasks include lessons that they are currently taking and tutors who are online.

This is a wireframe for the activities page, where users can access all the lessons they are currently taking, view their history, and access saved lessons. Users can also view this page to see the status of their tutors.

Digital Wireframes

After completing the paper wireframe, I proceeded to develop the initial design of the EduLearn elements and components to create a more cohesive and coherent layout for my design.

Users can quickly see which tutor are online and able to reach them for help.

Users can have overview on what courses they are currently taking.

User course details can be viewed from here.
Showing their progress, tutors and course structure.
Users can check what course that are in progress
and also review courses that they have done in the
history tab.
This tab allows user to show which tutor are online or doing live.
Details of each of the tutors can be viewed here. Showing their titles and profile status.

Usability Test Summary

A unmoderated usability test were conducted with students in Singapore.
Each were given a duration and task to complete.

Below are the summarize findings from the usability test

1

Homepage

Users wanted a reminder section that reminds students about their upcoming assignments or consultations
The 'Continue Learning' feature can be simplified by showing just the latest course that the student is taking.

2

Discover Page

Students felt that the Discover page could include a section showing tutors who are teaching live classes, so they can join in if they are interested.
Filter Section took out too much space

3

Tutor Section

Ratings should be removed as many of the tutors are volunteers.

Based on the insights gathered from the usability test, I applied the changes to my high-fidelity mock-up.

New feature reminding users of their upcoming session.

A simpler design of the 'Course in Progress' section has been created, with a progress bar added to show user progression.

Filter section take up less space

Students can now see which tutors are currently conducting live lessons, and they may choose to join in at any time.

No longer displaying ratings on the tutors profile.

Instead, showing tutors years of experience and subject relevant.

Joining in live class
in Edulearn

Students can join live classes conducted by tutors and
ask questions throughout the entire session.

Lesson material can also be access from the menu beside

Booking consultation
with tutor

Students can engage a tutor for extra help by selecting a
tutor profile and choosing available time slots.
Students can reference their booking either in the
profile section or on the homepage

Enrol for a lesson

The Discover page is where students can find available classes, with lessons tailored to their educational level.

Should students need assistance, they can click
on the 'Ask Questions' button.


In areas without internet or WiFi access, students can download lessons for offline viewing.

Responsive Design

To ensure that our platform is accessible to users across a range of devices, we have created designs optimized for different screen sizes and resolutions. Whether our users
access the platform from desktop computers, mobile phones, or tablets, they can expect a seamless user experience that adapts to their devices.

Usability testing

Summary

Visual

Some users have suggested having a 'Hide UI' feature during live class streaming, as the UI can be distracting.
In the homepage, the 'Upcoming Sessions' and 'Reminders' sections seem to convey similar information and could be grouped together for easier reference.

Experience

Users have expressed difficulty with booking consultations with tutors, as they are unable to change or reschedule the timing.

Challenges

Limited Feedback & Testing
Working on this project alone presents limitations in terms of receiving feedback and conducting testing. To gather pain points, I relied on my personal knowledge, experience, and feedback from a small group of close friends. However, I am aware that to gain a comprehensive understanding of user experience, additional research and testing would be necessary.

Accessibility Consideration

All students, regardless of their disabilities, should have equal access to education. While I have considered color contrast for users who are color-blind during this case study, there may be other disabilities that hinder their experience. It is crucial to conduct more research to identify the pain points of these students and ensure that their needs are also addressed.

Next Step

Research & Reiteration

If possible, gather more users for survey or interview to see what are their pain points and reiterate the design based on the new insights.

Dark Mode Support

I am still learning how to design for dark mode and how to configure a smoother transition between light to dark mode. This is essential for users who prefer to use in dark mode and for better visual accessibility.

New features

Implementing a community feature could be beneficial, allowing students to post questions if they are unable to reach a tutor. The community can offer assistance and provide additional resources.
Adding a group session feature where students can join sessions with their friends and
a tutor can foster collaboration and discussion, creating a more interactive learning environment.

What I have Learnt

Participating in this UX challenge as my case study was a valuable and fun experience for me. I have learnt so much from designing, prototyping and thinking from the user's perspective on how they might
approach a certain task. I sincerely hope that I will have the chance to explore more into the education field, as I feel that education should be made accessible to all with the help of technology and design.

Chaik Hong © 2023

Design and built by myself with love & sweat
using Figma & Webflow