Design report E-Learning App, Weclass

Miquel Delaurens
4 min readFeb 7, 2021

Case study: E-learning App for Android.

Goal: Help users who want to learn with a simple platform.

Role: Solo project, I was responsible for UX and UI.

Time: 6 days in February 2021.

Problem context

In a fast-changing world, we need to keep learning about new technologies, expand the knowledge in our jobs, or just learn about the latest revolutionary diet. All this during a pandemic where our mobility is reduced and schools are mostly closed.

For this reason, E-Learning apps are becoming more important nowadays.

Design Process

User persona

In this project the user persona was already given to us with a lot of detail, I took the following conclusions regarding the user needs.

She wants:

_ Learn to prepare meals from different cultures.
_ Meet new people.
_ Practice languages.
_ All this while a pandemic situation.

What do we need to give her?

_ A place to chat and interact with other people.
_ Fresh and cool recipes to engage with her.
_ Flexible options for payment and membership.
_ Easy intuitive app.

Benchmarking

For this project, I studied the features and options offered by other apps. A total of 8 direct and 2 indirect competitors:

From this comparison and taking into consideration the previous needs from the user I gather the next conclusions:

To make a clean and intuitive app there were some clear paths I didn’t have to follow, such as minimizing features and making minimalistic screens.

On the other side, I found many other features and tools that would help me make a fresh app, such as simple cards, clean pictures, horizontal menus, Ratings, chat groups to interact or the use of famous teachers to attract more clients.

Color palette

The user persona needs help me pick some of the colors to use in the app.

Ideate

Taking all the previous information I started to draw some screens in Low-fi prototypes. when I was confident with the content on the screens I draw the flow with simple sketches.

Prototype

These are some screens from the app, you can also access the link here.

Test and iterations

To build the prototype I made a Mid-fi for test and iterate until I could do the Hi-fi prototype. I did a total of 3 rounds of testing (3 users per round) and 4 versions of the final Hi-fi.

Android Vs iOs

In addition to the final design I made a couple of screens to see how this app would look in a iOs platform:

Tab top menu from Android would be at the bottom, setting menu have the specific arrows from iOs, and search bar would have iOs look with the cancel button in the right side.

What I would do different?

During this project I learned some tools that will be very useful in the future.

_ I started to use CRAP to improve usability and accessibility.
_Started to be thoughtful with the use of colors
_ Learned the diferences between iOs and Android plaforms

In the other hand I leaned other things I will try not to repeat:
_ I would start testing before everything is finished
_ I would learn more about how to apply color
_ I woul be more careful with the weight of the font

Next steps

_ Do more research about the content I can ad to the app, to make it more consistent.
_ Finish the app from the screens to interactions.
_ Try to partner with some business or schools to make the app profitable
from the start.

--

--