Saniya Sethi
Enhancing YouLearnt's online tutoring platform
Share knowledge, Grow together
YouLearnt is an online learning platform designed to connect students with tutors for a wide range of subjects in any language accessible to anyone, anywhere, and at any time.
Our goal
To design and optimise the YouLearnt platform to improve usability and user satisfaction for a diverse range of tutors and ensure a seamless experience.
Our solution:
After understanding the challenges tutors face with current platforms, I contributed to a solution that increased user satisfaction by 60%. Scroll through some of the screens below and try the high-fidelity prototype to see the platform in action.
Project outline
Duration
4 months
Tools used
Trello
Figma
Otter
Google Docs
My roles
UI/UX Designer
Our Process
During August 2024, I joined Youlearnt's organisation and was excited to focus on improving the tutor experience on the platform. I became a part of a collaborative group called 'Team Sketch' with 5 other UI/UX designers determined to increase the platform's usability and functionality.
Throughout the project, we followed the Double Diamond approach involving 4 key stages to guide us from identifying a problem to delivering the solution. Each phase was designed to focus on specific goals, with regular team check-ins and feedback sessions to improve the overall tutor user experience. While we worked closely as a team, we also valued independent contributions, allowing each member to take ownership of tasks within their expertise, ensuring a balance of collaboration and freedom throughout the project.
Discover
Design audit
Competitive analysis
Primary research
1. Understanding the user experience of the website through a design audit
-
Identify potential usability issues and assess design consistency, including content structure.
Home page
-
The flow of information is confusing as the messaging lacks clarity, making it unclear whether it's aimed at students, tutors, or both.
-
The lack of breathing space across the page causes sections to appear cramped, making it difficult to understand and retain the information.
Having consistent alignment helps users scan pages quickly
Tutor registration
-
Similarly, the tutor registration page feels very crowded. The long list of reasons on the left side adds to the cluttered look, making the page overwhelming.
-
The sign-up form feels busy and squashed, with too many input fields that could easily be completed later in the process.
Tutor dashboard
-
The left-hand navigation lacks clear prioritisation, with duplicated links and poor colour contrast making it difficult to use.
-
The icons have such low opacity that they’re barely noticeable, and the light grey background further reduces their visibility.
-
The webpage lacks engaging elements like statistics or graphs to showcase user progress, leaving empty spaces that could be made use of better.
Providing a clearer explanation here would help users better understand the feature's purpose.
Post course creation
-
The completed course interface lacks visual appeal, clear structure, and user-friendly design.
-
After creating a course, users have limited quick-edit options and no preview of how the course will appear to students.
2. Get inspired from the current market research
-
Investigate what educational platforms are offering and discover features that would help fill YouLearnt's gaps
Opportunities for YouLearnt
1.
Simple onboarding process that provides helpful tips on how best to use the platform.
2.
Background checks of the tutors, helping all users to feel safe.
3.
Tutor community to connect with other teachers.
4.
Allow for customisation to hold the user engagement.
3. Learn about our users with our research goal of:
Understanding tutors’ key challenges with existing platforms to design a more usable, accessible, and efficient dashboard that enhances engagement, supports personalisation, and ensures privacy and transparency.
Usability Testing on YouLearnt's platfrom
I felt that using only the highlighted issues from the design audit as our main takeaway was insufficient, so I suggested that, as a team, we observe user behaviour and uncover hidden problems that we did not detect in the design audit. We gave 6 online tutors 2 tasks to complete on YouLearnt, a platform they had never seen before.
Task 1:
Add your education details to your profile and view the changes
Task 2:
Create a course and then reschedule it to a time of your choice
Using quantitative analysis and the think-aloud method, we found that most participants considered the website to have several inconsistencies and be challenging to navigate. This was evident in the number of errors they made and the time it took to complete a task.
Quantitive data
-
Task 1: Average time: approximately 11 minutes, with a total of 30 errors.
-
Task 2: Average time: approximately 10 minutes, with a total of 29 errors.
-
The SUS score was below 50 for all participants, which falls within the unacceptable range, reflecting the platform's design.
'Think aloud' feedback
-
Many of them found Task 1 very confusing because three different pages were called 'profile'.
-
Half of the participants found the text hard to read, due to the small size and light grey font colour.
-
When completing Task 2, they found themselves lost when trying to reschedule the course because the platform took them through 2 or 3 different pages, and there were no breadcrumbs to guide them back.
"Why is the menu so confusing? Where do I go to edit the profile?" - Participant 6
"It won't let me change the time of my course" - Participant 1
Diving deeper into their experiences with online teaching platforms
I began with a brief questionnaire to gain an understanding of their background, followed by in-depth interviews to empathise with their challenges and learn what we can do to make YouLearnt better than others.
Participant 2
I love teaching online, but sometimes I waste time figuring out how to use the platform, especially when planning my lessons.
Define
Once the research was complete, we used affinity diagramming to uncover patterns. During the usability testing and interviews, my colleagues and I noticed recurring words and phrases across participants, indicating that common themes may be hidden within the data. This insight influenced us to choose affinity diagramming as our main analysis method.
From this process, we identified the key challenges participants faced with online tutoring platforms as follows:
1
Participants find it difficult to interact with and complete key actions without clear guidance or tutorials.
2
Advanced English speakers found some platform terms and phrases confusing.
3
Participants often struggle to create courses due to unclear instructions and unreliable media uploads.
Visual storyboard to empathise with what users experience
While my colleagues were hesitant as they had concerns that it would take too much time and slow us down, I had a different opinion. Storyboarding allows us to put ourselves in the user's shoes and gain a deep understanding of their challenges before moving to ideation. It enables us to step back and evaluate further.
Our user is Sarah, a recent immigrant who has always been passionate about teaching and connecting with students. Read through Sarah’s story below.
Problem Statement
Tutors using online teaching platforms struggle to complete basic actions efficiently due to unclear guidance and confusing terminology, leading to frustration, wasted time, and decreased motivation.
Develop
At this stage, we could sympathise with the struggles users were going through, and it was essential for us to prevent other users like Sarah from becoming overwhelmed and frustrated. I contributed to organising and structuring content using information architecture to make it easier for users to find what they are looking for. Below is a summarised site map showing the primary and secondary navigation.
Moving into the design phase
I felt confident fulfilling my role as a UI/UX Designer during this period. Having built trust with my team, I took the lead on internal screens, such as the dashboard, while my colleagues focused on external screens, such as the homepage. My goal was to transform the challenges users like Sarah faced into enjoyable, intuitive interactions.
Designing the screens also allowed me to refine the information architecture, ensuring each flow felt efficient and valuable to the user. Below are the wireframes for the dashboard and creating a course.
Dashboard
Creating a course
Conducting user testing to help in validate the designs
To validate our design decisions, we asked the same six users to repeat the key tasks of updating their profile, creating a course, and rescheduling a lesson, using the high-fidelity prototype. This allowed us to notice any changes in the quantitative data and their thoughts and opinions directly. The results were extremely positive: task efficiency improved significantly, and the average SUS score increased from 28% to 88%, well above the acceptable usability mark.
Deliver
Despite positive results from the SUS score indicating smooth interactions, after changing the low-fidelity wireframes into high-fidelity prototypes with a dark colour palette, user testing revealed key issues, particularly in accessibility and consistency within the design system. Tutors found the dark palette visually exhausting for long teaching sessions, leading us to shift towards a more lighter interface theme.
One challenge I faced as a key designer on this project was that some colleagues preferred the original dashboard layout. However, the testing results revealed that users wanted the interface to be less text-heavy and more visually appealing. I used evidence from the sessions to support user needs and to suggest an improved version. By applying problem-solving throughout, I made sure the final design benefited both business goals and user needs.
From the old dashboard
To the new
At this stage, my colleagues and I refined the designs using insights from user testing and team reviews. We made specific adjustments to ensure our designs complied with accessibility guidelines.
Below is the final prototype showcasing 5 flows, including an onboarding journey, which also received a positive response from users. I recommend interacting with the prototype in full-screen mode for the best experience.
Continuation of Sarah's journey to YouLearnt
My final thoughts
Being a UI/UX Designer for this project was enlightening for me, as I became aware of many important aspects to the UX design end-to-end process along the way. Below are some of my highlights:
-
Value of storytelling
The storyboard helped me and my team empathise with tutors’ struggles. It reinforced the idea that storytelling can be a powerful tool to understand user's pain points in a different perspective.
-
Growing confidence in my design leadership
Taking ownership of internal screens and guiding the team through iterations strengthened my confidence in delivering solutions that balance accessibility and feasibility.
-
Flexibility within the design system
Refining the design system for consistency taught me how much stronger designs become when supported by a clear structure.