Hahow App:

Project Year
2021
Duration
1.5 months
Client
Conceptual Case (Self-learning project)
My role
Product Managment
User Research
UX Design
UI Design
Introduction

Hahow is a teaching pre-purchase web-based platform where students can call for the content of courses, and teachers can make proposals to raise funds to start classes!

*Please note that it was a passion project only, it had not been published to the market but this project could be shared and showed my design thinking and skill.

Problem statement

How might we increase the percentage of students completing the full course?

Hahow has pointed out that there are many people who bought the course but have not watched all of them, so it is worth finding out if there is a barrier to watching videos or completing the courses.

Research

Competitors Research

Udemy has its own app which allows students to purchase the course and pre-download the course on their mobile and tablet which is Hahow has not. As a user, the pre-download function of Udemy helped me a lot which I can plan to watch several courses on the bus and I also notice the discount on the landing page easily to ensure I can make my decision before the deadline.

Interviews and Surveys

To verify my hypothesis of the problem of the Hahow app, I joined Hahow's learning community to conduct a survey of 23 people and interview of 13 students about how did they spend time when they were travelling on transportation and how did they feel about the Hahow's learning experience, and I listed out the most common reviews below:

"I don't know why Hahow has not its own app, it is not convenience if I want to browse their platform while I am at outside"
"I have bought online course on other's platform, and their app let me pre-download the course that is very convenience for me to watch them on train"
" I am not satisfy if Hahow reach me via email only. Honestly, I hate checking email, so I easily to miss the discounted course, what a shame!"
"Actually, I am willing to download the Hahow's app if they have one, they can pop me the promotional news and I can notice them in a short time"
"I have to wait for a few days for the tutor to answer my question, it was hard to catch up to learning every day"

Main results:

69%
People using mobile when
they are on the transportation
23%
People have joined unlimited
mobile data plan
85%
People will NOT watch video
if they have not unlimited
data mobile plan

Insights:

Most people killing the time with their mobile when they were travelling, and they are carefully on how to spend their limited data since lots of them had not join unlimited mobile plan.

  • People love to listen or watch the pre-downloaded music or video. (Spotify/ Youtube)
  • People thought the network experience was not smooth when they were in the tube.
  • People prefer use their mobile data to watch live video, such as football match.
  • People expect they can communicate with their tutor like they use instant app to communicate with their friends.
Design

Information Architecture

As usual, before making any fancy document, I would think about the sitemap and visualise the architecture that users may go through and grab some comments from my teammate to align our thoughts.  

Wireframe

I started to make the wireframe after users confirmed the information architecture. By following the mental model, most users expect they have different ways to register or to log in, so I also gave them these options to let them join us without a doubt.

Users will see the "my course" page as default since the main purpose of this app is letting users watch their online courses anywhere. Users can select the course and pre-download each video before they go out to enjoy a smooth learning experience under a no wifi environment.

Moreover, each video has its own question button, users can click this button to ask the question directly and the tutor can be informed that where are those questions come from which video.

Prototyping

Let's try the prototype and feel free to leave me some comment!

Design System

Usability testing

Verification

It is very important to verify if users are on the same page with design team. I have used Maze to setup different scenarios to check the effectiveness, efficiency and the overall satisfaction, finally, there were 8 testers to join the usability testing. Maze showed heatmap and every steps that made by users which allow us how the users act in the reality.

learning

The interview atmosphere is the key to grab more information

Creating a relaxed atmosphere during interviews proved crucial; when perceived as a professional, interviewees tended to express less due to apprehension about saying something 'stupid.' Recognising the impact of mood on research outcomes, I prioritized building rapport through casual conversations. While questionnaires are essential for gathering insights, establishing a friendly connection through shared interests during small talk became a key part of my approach.

The power of design system

In my initial experience developing an app without a design system, I vividly recall the challenges—time-consuming revisions, communication gaps, and the constant search for the latest design elements. Learning from this, I made a deliberate shift in this project. By adopting and crafting a robust design system, I've witnessed firsthand its transformative impact on efficiency and consistency in the development process.

"I believe I can upskill myself wherever
I am, the concept is amazing!"

- Chloe Wong, Hahow's student

"I hope Hahow could take this concept and develop the real app to us"

- Alex Chung, Hahow's student

👇 Get in touch for opportunities or just say 👋
IntroductionProblemResearchDesignUsability TestingLearning