eHAC Mobile App Redesign — A UX Case Study

The eHAC Case Study Overview

Hello everyone, Dina here! In this story, I would like to share the case study that I did in Binar Academy Bootcamp for UI/UX Design. In this project, the participants were set into a group of five, and my partners were: Mas Hazwo, Mba Mia Pangestie, Mas Mimo, and Mba Archela Neysa. I acted as the team’s scrum master, where I arranged the tasks of the whole team and oversaw the progress. Besides, I was also involved in the research and ideation process and helped brainstorming in the design process.

Why eHAC?

Amidst the global pandemic situation, traveling becomes one of the most complicated things to do. Even so, we observed that some Indonesian working in big cities far from their hometown finds a need to travel back. In order to control this situation, Indonesian government has established for all travelers to record their travel journey through a mobile application called eHAC (electronic Health Alert Card) for tracing purpose.

Despite its urgency, our team suspects that users might find it troublesome to complete the eHAC assessment in the middle of chaotic pandemic travelling. Hence, we conducted a study to investigate the improvement we could make in the eHAC mobile app.

The Design Process

I will describe our design process based on the Revamped Double Diamond Framework

Revamped Double Diamond — From The Design Council Website

Discover — Research the Unknown

We started the process by conducting 5 interview sessions with Indonesians who travel by airplanes in the past 3 months. The objective of the interview was to empathize with their journey while using the eHAC mobile apps. We also wanted to know their pain points as well as the perceived usefulness that they felt in eHAC apps.

From the interview results, there are 3 main activities that eHAC users did in the apps: registration, form submission, and validation. Users encountered several problems especially in finding the way to submit eHAC form and validating the eHAC submission at their destination. We synthesized these findings into a User Journey Map

User Journey Maps for eHAC apps

Define the Problem

After understanding the user journey, we pinpoint all the problems our users encountered in submitting eHAC. Here are the details:

eHAC apps Problem Breakdown

Afterwards, we compiled all of this problems into one problem statement and the metrics to monitor the design success. This will help us to stay in line while ideating the solutions.

The Problem Statement

Develop — Ideate & Evaluate

Next, our team conducted an ideation session to answer our problem statement. We each came up with ideas, then we perform affinity mapping to organize similar ideas. Afterwards, we prioritized the ideas by factoring the impact of the ideas and the effort needed to execute it. We decided to focus only on the high impact, low effort solutions as we were bound by a short timeline. You can see the grouped ideas mapped to their respective impact and effort below:

The Ideas Prioritized

Deliver — Design & Test

Finally, it is time for us to visualize the solutions. Using the most prioritized idea, we went our separate ways to sketch how we would like it to be implemented. Afterwards, we evaluated all the sketches and discussed how we would combine the ideas to solve our design problem. Here is the result:

The Crazy 8 for eHAC Homepage

Then, Mas Hashfi, Mas Mimo and Mba Nesya started to do the complete design and prototyping based on our brainstorming session.

The Redesigned eHAC

Click Here to view the prototype

To see whether our new design has answered the initial problem, we set up a remote usability testing using Maze. From several tasks that we tested, I will only pick one that shows we really nailed the main How Might We, where we asked users to find the button to start eHAC submission. Here is the result:

The Usability Testing Result

From the UT result above, we can see that the time needed for users to find the button to initiate eHAC submission decreases dramatically. Connecting it back to our main problem, we have improved the findability of the eHAC submission form in the new design by having the users find it quickly.

Lessons Learned

This opportunity is really valuable in my effort to learn the UI/UX Design field. If I have to pick, here are my top 3 takeaways from working on the eHAC redesign with Rojo Team:

  1. Defining the metrics that will be achieved by resolving a problem is important. It helps you to stay on track in the design and validation stage
  2. Working in a team does really help in the ideation process. You get perspective from a lot of people on how to handle the problems
  3. Prioritization matrix comes handy for decision making. It helps us to visualize impacts and efforts, not just imagining it

That’s all from me! I would really appreciate it if you could drop feedback in the comment section. Thank you for reading my first case study till the end!

A digital product design enthusiast