Vax Ontario
-
Helping all Ontarians beat Covid-19.
-
App design.
-
This is an academic project done under the guidance of Professor Markus Grupp at Humber college.
-
Many people were not showing up to their vaccine appointments with no prior notice, leading to a loss of time, money for distributors and the government.
-
Vax Ontario is a centralized solution to this issue, to track vaccine appointments.
What is the Problem?
-
Fragmented Booking systems: Required users to sign up and use multiple different websites.
-
Poor Usability: The usability of the booking systems is challenging.
What was the Impact?
-
Many people were not showing up to their appointments with no prior notice, leading to a loss of time and money for distributors and the government.
-
Slower than expected ‘vaccine rollout’ and slower ‘reopening of society’.
Potential Solution:
-
Developed a centralized solution to this issue, an application called Vax Ontario. Through this app, users will be able to book an appointment, manage their existing appointments, access a vaccine passport, and learn more information about vaccines.
Timeline:
-
Jan - Feb, 2022
Tools & Methods:
-
Figma, Miro
-
Desk Research
-
User Task Flows
-
Information Architecture
-
Low-Fidelity Wireframes
-
Paper Prototype
-
Usability Testing
-
High-Fidelity Wireframes
Credits:
-
Vijay Kumar
-
Riley
-
Michael
-
Ara
Desk Research:
Engaged in comprehensive desk research to gain insights into the current COVID-19 vaccination scenario in Ontario.
User Task Flows:
Familiarized with the user journey of the COVID vaccination process, and strategically crafted task flows, ensuring a seamless and logical sequence for a user-friendly experience.
​
Information Architecture:
To optimize the user experience and streamline interactions, an Information Architecture (IA) diagram for the app was crafted, aligning with user task flows.
Low-Fidelity Wireframes:
Incorporating insights from user task flows and information architecture, preliminary low-fidelity wireframes were crafted on paper to undergo user testing. Subsequently, this guided the progression to developing high-fidelity wireframes for the app.
Prototype:
Using the Marvel application, the low-fidelity paper wireframes were transformed into a prototype, subsequently undergoing testing with actual users.
Usability Testing:
Conducted user testing on the low-fidelity paper prototype to identify and address any issues within the app, implementing improvements as necessary.
​
High-Fidelity Prototype:
Based on the user feedback, the wireframes were polished and a final high-fidelity prototype was created.
Desk Research:
-
Booking a COVID vaccination appointment in Ontario has been a challenge for many citizens.
The Causes:
Fragmented Booking Systems:
-
100+ different booking systems based on city, health network, neighbourhood, level of government (provincial, regional, municipal).
-
Fragmented systems has led to citizens sometimes booking in several clinics to try to secure an earlier appointment.
Poor Usability:
-
The usability of many of the booking systems is challenging for many citizens to book an appointment.
Miscommunication by public health authorities:
-
Communication from various public health officials has been confusing and at times, contradictory.
The Impact:
Human-level:
-
Increased confusion & frustration (“How can I actually get an appointment?”)
-
Increased anxiety (“When will COVID finally be over?”)
-
Did my booking go through?
System-level:
-
Missed appointments and unused vaccines due to “no shows” largely caused by citizens not canceling appointments that they cannot make.
-
Slower than expected vaccine rollout.
-
Slower “reopening of society”.
How might we create a single COVID vaccine booking experience that allows Ontarians to easily book an appointment?
Requirements from the Ontario Minstry of Health:
-
This design brief provides the high-level functional requirements on what a citizen needs to do and the back-end systems need to verify and confirm.
-
It provides the high-level user and data requirements.
Eligibility Confirmation:
The citizen is required to enter the following details to confirm their eligibility for a vaccine:
-
Postal code.
-
Birth year.
-
Ontario Health Card #.
Success scenario:
-
Eligible for a vaccine.
Error scenarios:
-
Address is not yet eligible for a vaccine.
-
Age is not yet eligible for a vaccine.
-
Incorrect health card entered.
Identity Confirmation:
The citizen has to enter the following information in order to reserve a vaccination slot:
-
Postal code.
-
Date of birth (YYYY-MM-DD).
-
Ontario Health Card number, 9 character code on the back of the health card (2 letters, 7 digits).
-
Email address.
Success scenario:
-
Identity was successfully confirmed.
Error scenarios:
-
9-character code is incorrect.
-
Health card number is incorrect.
-
Postal code.
-
One or more fields was left blank.
Appointment Selection:
After their identity has been confirmed, the citizen will select an appointment:
-
Select a nearby vaccination clinic: Location name (i.e. school, pharmacy, park name), Location address, Any other necessary geographic info.
-
Select a date and time.
-
Display the vaccine being administered (no option to choose).
Appointment Confirmation Details:
At any time, the citizen should be able to view the details of their appointment:
-
Date and time of appointment.
-
Location of clinic (with any specific transportation / parking details).
-
Any preparation instructions (shirt with loose sleeves, etc.).
Appointment Reminder:
An appointment reminder will be provided:
-
X days before the appointment (you determine).
-
The morning of the appointment.
-
Reminding the following details: Date and time of appointment, Location of clinic (with any specific transportation / parking details), Any preparation instructions (shirt with loose sleeves, etc.).
Appointment Check-in:
-
Upon arriving at the vaccine clinic, the citizen will need to show an appointment confirmation, their health card and 1 piece of identification with name and address (driver’s license, a bill, etc.).
Appointment Cancellation:
-
At any time after the booking and before their appointment, the citizen should be easily able to cancel their booking.
Define...................................................................................................
User Task Flows:
Familiarized with the user journey of the COVID vaccination process, and strategically crafted task flows, ensuring a seamless and logical sequence for a user-friendly experience.
Information Architecture:
To optimize the user experience and streamline interactions, an Information Architecture (IA) diagram for the app was crafted, aligning with user task flows.
User Task Flows:
-
Familiarized with the user journey of the COVID vaccination process, and strategically crafted task flows, ensuring a seamless and logical sequence for a user-friendly experience.
​
-
User Flow 1: New user booking a vaccine.
-
User Flow 2: The user wants to show proof of vaccination.
-
User Flow 3: Returning user booking a 2nd or 3rd dose.
-
User Flow 4: Finding out what you are currently eligible for.
Task Flows:
Information Architecture:
-
To optimize the user experience and streamline interactions, an Information Architecture (IA) diagram for the app was crafted, aligning with user task flows.
Ideate...................................................................................................
Low-Fidelity Wireframes:
Incorporating insights from user task flows and information architecture, preliminary low-fidelity wireframes were crafted on paper to undergo user testing. Subsequently, this guided the progression to developing high-fidelity wireframes for the app.
Low-Fidelity Wireframes:
Usability Testing:
User feedback from usability Testing:
-
Scan/picture health card to make it quicker.
-
Add a family member to my account to book for multiple people if they want.
-
Change "view or cancel application" to "appointment" on the homepage and add a back button to the appointment selection page.
-
Continue as guests: Are they able to view their information again if they continue as guests? maybe have a way to log back in as a guest.
-
Force the user to get a specific dose depending on what dose they already have instead of having them pick (more personalized).
-
Extra click to view details of appointment: put details on the page after the home page (when clicking view details/cancel) and have a cancel button at the bottom.
High-Fidelity Wireframes:
