top of page
profile page w bg.png

About

📱Project overview

This vaccination booking app allow users to make a reservation for COVID-19 vaccine. It also offers Antigen results, COVID-19 vaccination certificate, and FAQ's. The app targets citizens who wishes to get vaccinated.

🤔 Problem

Walk-ins are a problem when it comes to vaccination as sites become overcrowded and people get infected before even getting vaccinated.

🎯 Goals

Design an app that will help flow of vaccination process, helping people manage their time to get vaccinated.

💪 My Role

UX designer designing an app for this reservation app from conception to delivery

👩🏻‍💻 Responsibilities

Conducting interviews, paper and digital wire-framing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

🛠️ Tools

Figma, Adobe Photoshop

⏰ Timeframe

August 2021 - September 2021

User research: summary

I used date on vaccination roll outs to develop interview questions, which were then used to conduct user interviews. Most interview participants reported feeling frustrated about being in crowded areas, pushing one another to get in line for a vaccine. The feedback received through research made it very clear that users wanted an easy-to-use app where they could book their vaccination slots in a certain time frame.

User research: pain points

3 main user pain points I conducted from my interview were:

Screen Shot 2564-09-07 at 12.18.59 PM.png

TIME

People do not have the time to be walking in for a vaccination appointment, not knowing when they'll be able to get vaccinated

Screen Shot 2564-09-07 at 12.22.20 PM.png

ACCESSIBILITY

To travel abroad, most countries require a proof of vaccination, therefore a certificate is needed

Screen Shot 2564-09-07 at 12.25.03 PM.png

IA

Text-heavy descriptions in app are often difficult  to read and select from

User personas

bust-mask-12.png

Ross

English teacher

Ross is an English teacher in Thailand who needs access to his vaccination process he is having trouble finding vaccination locations for expats. He would love for an update on his status.

bust-mask-9.png

Jaja

Post graduate student

Jaja is a postgraduate student who is currently working for her family's business. She is frustrated that the vaccine distribution in Thailand is difficult and unfair, and hopes that there will be updates on her vaccination process for her and her family as they would like to get vaccinated.

Site map

sitemap.png

Paper Wireframes

Taking the time to draft iterations for each screen of the app on paper allowed me to come up with a number of different possible solutions based upon my research. This sped up the process and I was able to refine my ultimate choice much more quickly. 

paper wireframe.png

Digital Wireframes

After ideating and drafting some paper wireframes, I created the initial designs for the app. These design focuses on clarity and simplicity for users to quickly get done with what they need to do.

Screen Shot 2564-09-12 at 9.02.01 PM.png

Low-fidelity prototype

To prepare for usability testing, I created a low-fidelity prototype that connected the user flow of booking a COVID-19 vaccine.

low fidel prototype.png

Usability study: parameters

usabiility parametrs.png

Study type

Unmoderated usability study

Participants

5 participants

Location

Thailand; Remote

Length

15 - 25 minutes

Usability study: findings

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Screen Shot 2564-09-12 at 9.06.35 PM.png

Status

People wanted easy access to their booking status

Certificate

People had difficulty with the layout of the certificate, and wishes they could export to print

Booking for others

People wanted to be able to book for their family members

Mockups

Based on the insights from the usability studies, I applied design changes like providing clear sections for each category and a notification button.

Screen Shot 2564-09-12 at 9.10.45 PM.png
Screen Shot 2564-09-12 at 9.11.19 PM.png

Design guide

Color Palette

Screen Shot 2564-09-12 at 9.12.19 PM.png

Typography

Screen Shot 2564-09-12 at 9.19.29 PM.png

Icons

Screen Shot 2564-09-12 at 9.17.50 PM.png
Screen Shot 2564-09-12 at 9.21.20 PM.png

Labels

Screen Shot 2564-09-12 at 9.22.38 PM.png

High fidelity

The high-fidelity prototype follows a very similar user flow as the low-fidelity prototype, including design changes made after the usability study.

Screen Shot 2564-09-12 at 9.28.31 PM.png

Mockups

Screen Shot 2564-09-12 at 9.30.06 PM.png

Accessibility Considerations

Screen Shot 2564-09-12 at 9.06.35 PM.png

Clear labels for interactive elements that can be read by screen readers.

Used icons to help make navigation easier.

Responsive designs

The designs for screen size variation including mobile, ipad, and desktop. I optimized the designs to fit specific user needs of each device and screen size.

Screen Shot 2564-09-12 at 9.37.13 PM.png

Takeaways

Impact

What I learned

Users shared that the app was very helpful. One quote from the peer feedback was that “the COVID-19 vaccine certificate feature was really personal as they wanted to be able to export and print it out.”

I learned that the problem I was trying to solve was a very common pain point in a lot of users, but diligently going through each step of the design process and aligning with specific user needs helped me come up with solutions that were both feasible and useful.

Next steps

Screen Shot 2564-09-12 at 9.06.35 PM.png

Conduct research on how successful the app is in reaching the goal to book vaccines.

Add more educational resources for users to learn about COVID-19

bottom of page