Unacademy Learning Platform — redefining the online education experience

Objective

How might we help online learners discover content that is relevant to them and easy to consume?

Company

Unacademy

 

Timeline 

Mid 2017

 

Role

UX/UI Designer - I worked on this project independently

Skills

Product Thinking, Information Architecture, Wireframing, Interaction Design, Visual Design

Unacademy is an online learning platform that makes education accessible to over 1 million registered users across India. It is an open platform, which means that anyone can apply to become an educator and start creating and publishing content.

The Problem

Unacademy's biggest audience today are civil service aspirants from lower and middle class India who cannot afford education. The Civil Services Examination (CSE) is considered one of the most difficult examinations in India with 1,000,000 applicants competing for approximately 1000 seats. Without proper guidance, candidates can feel overwhelmed, confused and lost.

Unacademy learners were facing a similar problem. Being an open platform, the courses on Unacademy lacked structure and many CSE aspirants didn't know where or how to start their test preparation. Relevant discovery was also a major problem with 'Which course should I take next?' observed as a common concern amongst users.

First two enrollments get 75% of traffic 

Explore is getting lost

Continue buttons are unnecessary and redundant

Today's goal taking up too much real estate

Content is not personalized or relevant to user

Figure 1: Key problems with the existing homepage  (rollover image to see actual screenshot)

Version 1.0

Designing for Relevance

I conceptualized and designed the list experience to provide candidates a study framework that guides them through their test preparation. Lists are collections of courses that give users in-depth, sequential knowledge of a specific topic—and are especially useful to those who don't have access to offline resources. They were targeted at two types of users:
 

  1. Users at the outset of test preparation who are in browse or discovery mode - Low intent
     

  2. Users who have already started their preparation and have specific topic related queries  - High intent

Figure 2: Visual explorations for List cards

Figure 3: New homepage experience (based on existing design language)

Figure 4: List page on mobile (based on existing design language)

Capturing User Feedback

The new mobile homepage was drastically different from the existing one and I wanted to collect data from actual (repeat) users and learn how I could improve their experienceI was particular about implementing a feedback capturing system that was non-intrusive. I found this lovely piece on integrated app rating asks by Matt Galligan which was effective in driving positive ratings to Play Store and collecting constructive feedback internally.

Figure 5: Integrated feedback cards

I had observed many Uber drivers in India, struggle with the rider rating at the end of a trip. This resulted in a lot of accidental one star ratings. I realized that many drivers from non-metro cities were first-time internet users were not familiar with the star rating system. I felt a visual cue was needed so users would know what to expect on the next screen and how to interact with it.

I also changed the negative response to 'Not right now' so we could show the same user another feedback request, in case we didn't receive a response the first time.

Impact

We released the new the new mobile homepage experience on July 11 and received over 180 ratings within a day of rolling out the new feature.  That's a 600% increase in app ratings from a daily average of < 25. By July 15, our rating was up to 4.9 from 4.8 and today, we have over 89% 5-star ratings on Google Play Store.

Figure 6: Play Store daily ratings from Jun 15 - Jul 12 (2017)

Figure 6: Play Store ratings and reviews (Aug 26, 2017)

Version 2.0

Designing for Discovery

In order to perfect the discovery experience, the content on the website had to be reorganized. I worked on the information architecture from scratch and tried to make the content more accessible by designing a navigation system that was intuitive and user-friendly.

Figure 7: Initial sketches for the homepage restructure

Persistent left-side panel for easy navigation

Bringing up personalized recommendations based on user goals

Right panel showing course playlist

Quick save-for-later feature

Wireframes detailing out key pages

Evoke trust and dependability

I used serif fonts to recreate a text book vibe and add a tone of seriousness and credibility.

 

Focus on content 

I removed content cards and extraneous interface details that were fighting for attention.

Brand refresh and relevance

I switched to brighter colors that were more suited for digital screens.

Homepage experience for desktop (proposed)

Mobile experience for Unacademy (proposed)