The product:
CertificAid helps users find information about Covid-19 and schedule vaccination appointments.
Project duration:
May - June 2022
My role:
UX designer & UX researcher.
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, visual design, interaction design.
The problem:
Since Covid-19 reach a pandemic level there is a need to find information about the virus, symptoms, prevention, vaccination and book an appointment for vaccination.
The goal:
Create a user-friendly website with all necessary information in one place with functionality that allows users to book an appointment easily.
Understanding the user
User research: summary
I conducted interviews and created empathy maps to understand users I’m designing for and their needs. Primary user groups identified before the research were Millennials and Gen Z who appreciate convenience of using web to learn about Covid-19 and schedule an appointment. After the research I came to a conclusion that Baby Boomers are also interested in using online resources to make vaccination appointments or find necessary information about the virus.
The research confirmed initial assumptions that a successful website is supposed to rely on infographics and user-friendly presented information. On top of that the process of booking a vaccination appointment is supposed to be easy and clear. Identified user problems included: too technical and difficult to comprehend for general audience information, bad accessibility, limited language support, outdated information about the vaccination centres and available vaccines, long and unclear booking process using external websites with very bad UX and UI.
User research: pain points
Lack of clear information
Unfortunately, the lack of information together with misinformation make it hard to convince people to get vaccinated. Therefore, giving access to clear and user-friendly information can help educate people and prove that vaccination can save their lives.
Bad accessibility
Many of the websites are not accessible, even the ones meant to help with health matters.
Lack of multilingual support
Many users who live abroad don’t speak local languages. They would benefit if the website had multilingual support independently from their location.
Unclear booking appointment process
Too complicated booking process can discourage people from getting very needed vaccination.
User research: personas
Problem statement:
Peter is a 41 year old working single parent who needs to find out if his child needs to get vaccinated because they need to travel to Belfast.
Problem statement:
Sada is a busy 24 year old Human Rights student who wants to find a vaccination centre nearby and make an appointment online.
Competitive audit
Goal
Compare the user experience of each competitor's website.
Conclusion
Majority of the websites present information in very dry, unengaging way. They would benefit from refreshing their design style, using more infographics and animations, better user flows and clearer hierarchy. Feature “book a vaccination appointment” would also be useful for many people. Also the accessibility could be improved, especially considering the importance of the topic.
Ideation
Starting the design
Digital wireframes
Low-fidelity prototype
The low-fidelity prototype connected the primary user flow of finding information about Covid-19 and booking an appointment.
View the low-fidelity prototype
Usability study: parameters
Study type:
Unmoderated usability study
Location:
Remote (online)
Participants:
5 participants
Length:
10-15 minutes
Usability study: findings
Side Buttons
The buttons on the side “Search”, “Book an appointment” and “Login” can be confusing. Suggestion to move them to the header.
Layout
The layout can be refined (by introducing more engaging ways of representing information: more icons, illustrations, different arrangement of the elements, etc.)
Steps
The process of the booking an appointment and checking for the eligibility can be improved if the number of steps are indicated and the progress is shown.
Refining the design
Mockups
Side buttons were moved to the header to improve the UX.
I specially designed illustrations and infographics for this project to present the information in more engaging and friendly way and to explain otherwise difficult to comprehend topics.
Steps and progress were added to the booking appointment flow to give users an idea how long it would take and to encourage them to finish the booking.
Sitemap
High-fidelity prototype
The high-fidelity prototype connected the primary user flow of finding information about Covid-19 and booking an appointment.
View the high-fidelity prototype
Accessibility considerations
The forms were designed according to the Web Accessibility Standards
The colours and contrast are compliant with Accessibility Standards
The website is designed to support assistive technologies
The website has multilingual support
Responsive Design
Going forward
Impact:
The website makes it easy for users to find information about Covid-19 and makes it possible to book an appointment in several easy steps, it guides user through the process giving clear instructions and showing the next steps.
What I learned:
It’s very important to present information in engaging and clear manner especially when the subject is really serious and can be hard to understand for general audience.
It's also important not to assume that the main target audience would be tech-savvy people. Covid-19 proved that it's important to design services for everyone whether they are familiar with web or might have to use it for the first time because of necessity caused by pandemic.
Next steps
Create a totally different user flow for logging in and managing the appointments. Create a user flow for the search.
Conduct another round of usability study and validate if the user pains points were effectively addressed.
Comments