We Learn
This project was aimed at facilitating the continuous education during the pandemic. It was also aimed for those who prefer to study through instructional videos online, facilitated by a community of global learners.
Problem Statement
Many e-learning platforms do not offer an enjoyable and smooth user experience, which might affect student engagement and retention. The real question is, How can we keep learners engaged in during online lectures such that learners would return a seamless and interesting user experience?
This was a passion project.
Create Your First Project
Start adding your projects to your portfolio. Click on "Manage Projects" to get started
Design Process
User Research; Understanding the User
Goals
To provide great learning experiences to everybody.
Methodology: 9 user interviews were conducted. Moderated (qualitative)user research was conducted to get the richest sense of pain points and shared challenges users face to create a product that would truly serve user needs. Sessions were 30 minutes long.
Participants: Users were an even mix of males and females, ages 19-30. Education levels varied from Undergraduate level to graduates and working-class individuals. They were learners who desired to upgrade their knowledge through E-learning.
Empathy Mapping /User Persona
Empathy mapping is an invaluable tool for designing e-learning apps. It allows designers to gain a deep understanding of the target audience, personalize the learning experience, anticipate user pain points, enhance engagement, and make empathy-driven design decisions. By incorporating empathy mapping into the design process, I designed the platform to be more effective, engaging, and learner-centric.
Interview Questions
-
What is your age group?
-
What Is Your Occupation?
-
What do you do to improve skills or learn something new?
-
How Do You Choose the Right Courses For You?
-
Which type of classes would you prefer? (online or live)
-
Who do you ask for help when you have problems?
-
How long should the lecture be?
-
How would you like to communicate with your instructor?
Research Insights
-
Results indicated that many people, regardless of their occupation, desired to learn new skills, and oftentimes, they went to the internet to source courses to take.
-
They often had problems with the cost, student-teacher communication platforms and video quality.
The key word from the research was INTERACTION. The learners needed to have a sense of guidance and a relationship with the teacher and their peers.
I created a journey map to understand the pains and frustrations of the user while searching for a desirable E-learning platform. With this, I could have a mental picture of the user's pains.
Competitive analysis
Competitive analysis was carried out against the top E-learning platforms, and they were evaluated based on issues presented by users and observed by me. These points were highlighted and used as a guide to creating features that can solve the user’s problems.
Information Architecture
The information architecture was created to help me understand the most suitable positions to place navigator information to give users a pleasant experience.
Ideation
Low-Fidelity Sketches
Low-fidelity wireframes are how I often begin the design process. This is how I swiftly iterate through several design ideas.
With sketches, I can readily adjust my designs as I test various concepts.
Sketching up potential app pages using user stories was beneficial in this project.
I drew four alternative versions in total and ultimately chose the one that seemed to have all the answers to the users' desires.
The screen's design was the primary factor that set these sketches apart.
The sketches I selected to use and develop mid-fidelity wireframes were simple to traverse.
User Flows
Since user flows are essential for understanding, visualizing, and optimizing the user experience. I created them based on the already identified, and information hierarchy to facilitate the creation of more user-centric and intuitive products.
Mid-Fidelity Wireframes
Before choosing the final wireframe designs, I worked on mid-fidelity using Figma and went through various design iterations. I conducted user testing using Figma.
It is simple and quick to produce mid-fidelity wireframes.
Amazingly, Figma is free and can simultaneously assist with the design and prototype.
To minimize the possibility of encountering issues, I ensured the design layout was functioning properly.
High-Fidelity Mockup
An accurate and realistic portrayal of the finished product is provided by a high-fidelity mock-up, which is a detailed and aesthetically pleasing representation of a user interface (UI) design. By capturing the visual and functional components, I sought to mimic users' interactive experience with the digital interface.
High-quality mock-ups incorporate accurate visual aspects like colours, font, and UI components beyond simple wireframes or low-fidelity prototypes. They are a great tool for stakeholders, designers, and developers to visualize the final project since they frequently reflect the finished product's layout, structure, and content.
Prototyping
Prototyping is a vital part of the UX design process. It enables designers to validate, iterate, communicate, reduce risks, and test their designs to create user-centred and successful products or interfaces.
Prototyping was a continuous part of this design process that was carried out after every iteration.
Insights from testing
The following feedback was given via Zoom call after usability testing
-
“The in-session discussion feature is great. I gave the feeling of the traditional setting.“
-
“It would be great to incorporate a progress monitor to motivate users as they go along.”
-
“The app could benefit from more interactive exercises to help me practice what was learned.”
-
“I found the font size to be too small. It would be helpful to have the option to adjust the font size.“
-
“A landscape view would be perfect for the mobile version.” (i.e. responsiveness)
Next Steps
Test and Iterate until all common issues are identified and solved.
Build Beta backend of this App to enable users to fill in Onboarding information
Market testing
Marketing and Release Plan.
Impact
-
Users will have access to mobile education
-
It will facilitate the rapid spread of skilled persons across the world
-
Increased Product Adoption: This case study can encourage the prioritization of technologically aided education by demonstrating the benefits of user-centred design.
Lessons Learned
-
User-centred Design: This UX case study emphasized the importance of using real-world user data to inform design decisions
-
Importance of Simplicity: I learned that simpler and more intuitive designs often create better user experiences.
-
Mobile First: With the increasing use of mobile devices, I was reminded of the importance of designing for mobile first and responsive design.