Design Report: “Akademia”

Manuel Soria
9 min readFeb 7, 2021

Design process of an app for self-pace learning online

It’ s been a while since I posted here! Today, I want to share with you one of my latest individual projects. In only 6 days, I had to come up with a high-fidelity prototype for an eLearning mobile app to be launched both in iOS and Android. It had to be as inclusive as possible with the different user profiles of this kind of apps.

In addition to that, the app had to be intended to generate revenue based on subscription fees associated with access to content. Since we would be entering a highly competitive market, we had to define our value proposition by adding value to our app, and not compete solely on the price of our content.

This was a very particular project, since I was given a set of 3 proto-personas to work with. The app had to satisfy each of their needs and goals. However, for the presentation’s sake, I had to choose one of them to perform a user flow and walk my colleagues around the app. I will quickly introduce you to them later on this report.

Having put you in context, let me guide you through each step of the design process of Akademia.

“eLearning”?

In late 1997, Elliott Masie, an educational technology expert said,

“Online learning is the use of network technology to design, deliver, select, administer, and extend learning.”

A year later Jay Cross, Founder of Internet Time Group, Berkeley, California, USA and CEO at the eLearning Forum wrote,

“eLearning is learning on Internet Time, the convergence of learning and networks. eLearning is a vision of what corporate training can become. eLearning is to traditional training as eBusiness is to business as usual.”

Check out Cross’ “An informal history of eLearning” for further detail.

The habit of learning formed by the modern necessity of being up-to-date explains the great number of e-learning solutions on app stores […] people experience a less costly, but more flexible and autonomous approach to learning at their own pace and time in a more convenient environment. (

, “Make It Work: Tips On E-Learning App Development”).

eLearning wipes off the table any physical or temporary barrier, offers the opportunity to access to lifelong learning adapted to our personal and circumstantial needs and provides users with certain features that come in very handy: online assignments, quizzes, articles, video tutoring, community, and chatting, amongst others.

The Market browse

Since I wasn’t really familiar with the eLearning market, I kicked off my project with some research on my main competitors, the business models they adopted and the main features they offered to the user. Pricing wasn’t really a subject of my research, since the main goal was to improve the user experience by adding value to existing patterns. Here are some of the main findings.

(Business Models)

I bumped into three different business models:

  • Academy style model: allows users to receive recurring value by building an extensive library of tutorials to cover multiple skills. The app receives recurring income through monthly or yearly subscription fees.
  • Night school model: one-off access to a course where users pay an up-front fee for the course.
  • A combination of the other two models: the app offers both options to the users, and it is up to them to choose one or another.

(Competitors and main features)

The eLearning market niche is highly competitive and there are many different types depending on their audience, the purpose (learning skills or acquiring a new set of professional skills), their partnerships with Universities and Teaching institutions… Some of the main competitors I bumped into were Coursera, Udemy, Domestika, Share Skill and Linkedin Learning.

One may think that there being so many alternatives is good for users to choose amongst, but under my point of view, it is hard to identify their value proposition. The thing is apps and platforms with different scopes are mixed in this chaotic cosmos of eLearning apps. One would run Coursera to, i don’t know, learn how to do crochet, and would find out that it exclusively works with universities and other institutions through partnerships by letting them offer their academic content and courses.

That is the exact reason why I discarded some of theses apps to run a competitive benchmarking. I wanted to focus on apps that offered a variety of content, and gave tutors a space to upload their courses and workshops. That’s why I ran the benchmarking on Udemy, Domestika and Skill Share.

I wanted to learn about their business models, their feature prioritisation and try to determine where there was room for improvement. Every app kept focus on different features: Udemy included a very diverse content, Domestika focused in just in Arts and Crafts to achieve excellency of content and Skill Share built an in-app community where you could even follow your teachers and other students. One of the findings that caught my attention the most was that some of these apps could improve their course overview, to make sure that one-off paying users get every single detail of the course to help them make a decision.

I selected the features I wanted Akademia to include, and decided to keep focus on course overviews, and try to put all the information in a visual way so that it’s easy to digest. Akademia would also include variety of content, without forgetting excellency, and an in-app community. It would be based in a combined business model (monthly — yearly subscription, or one-off access to content by single payments).

Matthew, the digital nomad

Just like the introduction stated, the app had to meet 3 proto-personas’s needs and goals. However, I picked Matthew as my primary persona to build a user flow around in the prototype.

I used this information as a starting point, and carried out a couple informal interviews to do a bit of original user research with similar profiles to Matthew’s. None of them were subscribed to any eLearning app, but they had purchased a course before. They agreed that the lack of a detailed course overview made it hard for them to pick the best option, and that was something very valuable for one-off access payers. The interviewees also confirmed my assumptions regarding value proposition. They didn’t know which specific content each app offers. Many times they have had to download all of them until they found the right course.

The other proto-personas to bare in mind, Sofia and Alicia

Let’s sketch

When I felt confident enough about my research, I jumped to sketching some screens with the main features and display I had in mind. Here are the results:

I pictured a three icon tab bar, a main screen with different options (like upcoming workshops, recommendations and trends), a search screen with a search bar with some categories and the option to sort and filter the results and a profile screen with access to the user’s courses.

I then jumped to Figma to start prototyping. Instead of showing you the evolution from low-fi to hi-fi, in the next section I will guide you through the most relevant changes the design experienced after 2 rounds of usability tests (1 x 1tes low-fit, 1x3 tests hi-fi).

Time to test

Design Variations: Dark/ Light interface: users weren’t sure if the dark interface matched with the tone and feeling of this kind of apps. They immediately though of Spotify or Netflix. So the design was converted to a lighter interface, which had an impact in the color palette at the same time. The brighter colours matched in a better way with the Look & Feel of eLearning apps.

Confusing Buttons: the purchase button was changed to meet the user’s expectations. Normally this kind of buttons are floating on the screen and extended to eachs side of the screen. The original design made it overwhelming and confusing, since the course overview overlapped with these buttons.

Don’t spam me : when users got to the purchase screen, they felt overwhelmed. The UX Writing of the original buttons felt to assertive and the display too invasive. That’s why the subscribe options was moved to a separate pop-up, that invited the user to Learn More about that option to get unlimited access to all the content in the app. The banner with the subscribe option was also removed from the main page.

Profile changes: the profile with “my courses” also suffered several changes. Originally each lecture included a % of progression. But users were confused about the duplicity, since there was another % at the previous screen. Also, some of them mentioned that at first sight they even thought those were discounts. In addition to this, users were missing the option to add a new course from their profile, so an “Add new course” option was added.

Key design decisions

One of the most important design decisions had to do with the course overview. On the one hand, we want it to be as thorough and detailed as possible, but on the other hand, we don’t want never ending scrollable screens that will overwhelm our users. So it was really important for me to use icons and to make the information as visual as possible, to make sure the information was easier to process by our users.

Akademia needed to make sure that the user got a hint of the introductory lessons, for them to determine if the particular course was fit for them. The Overview and the Curriculum were placed one next to the other in order to contain each information in different screens.

Conclusions and next steps

Time restrain was a real challenge. I had very little time to put all the project together. Looking back, I would say I spent too much time doing research. Certainly I could have gathered the information faster. Although i wanted to get a good insight of the market, I lost some valuable time to start sketching and early testing.

This last point will be my focus for my next projects. I will jump to testing as soon as possible. I will remind myself not to spend so much time “making things pretty” before I test my prototypes. In fact, the sooner you test, the less attachment you have to the design, and the bigger room for improvement.

Having said that, I would love to keep working on Akademia and maybe build an in-app community, where you can follow teachers and other students, and interact with them in real time though video calls.

Hope you enjoyed this report as much as I did writing it. Please feel free to have a look at my prototype and play with it!

I will see you on the flip side!

Manuel

--

--