CanadaCare
UI/UX Designer
@UofT Course Project
Overview
Note: This was my very first UX project!
CanadaCare is a mobile application that encourages Canadians to book medical appointments while minimizing waiting time.
My team and I were given the task of designing a health-care related mobile application for a human factors interface design course. My team consists of myself and three other Industrial Engineering students.
Access the prototype here!
Team
Timeline
Tools
1 UI/UX Designer
2 User Researchers
1 Project Manager
Sept 2019 - Nov 2019
Adobe XD Illustrator
Miro
Research
1) Wait Time
2) Making decisions
Finding a clinic that matches personal preferences and needs can be a struggle for many Canadians. Our team found that most users spend a lot of time waiting at clinics in order to see a physician and to select the right clinic that suits their needs.
Activity Theory Diagrams from User Observations
This diagram shows action items (orange sticky notes) where the user spends time waiting.
30 - 60 mins
Average time spent waiting in queue
44%
Percentage of time spent waiting in queue
In addition to inefficiencies due to time spent on waiting, we found that people tend to have a negative correlation with time spent making a decision and making the decision itself. A study suggests users should ideally spend less time overthinking in order to feel satisfied with their choice (Hughes).
Factors to be considered when choosing a clinic are the following (with proximity being the most important):
1) Proximity
2) Reviews
3) Wait time
3
Therefore, the team chose to design a mobile application that will recommend clinics (based on proximity and reviews), along with a display of current walk-in wait times of the following clinics.
Some added functionalities such as: holding a spot on queue, booking appointments, viewing available clinics, and choosing a physician will be added. These functionalities were added as a result of bench-marking. CanadaCare differentiates itself from other applications by optimizing the waiting time and recommending clinics based on proximity and reviews.
Wireframes
After creating use cases and personas, I created wireframes for how a user can accomplish the tasks indicated in the use cases while keeping in mind our personas.
I created two different design alternatives. Below is a comparison of the alternatives and a design rationale for why one alternative was chosen over the other.
Chosen Alternative
Since this is an application meant for a mobile phone, a hamburger menu would result in more clicks to accomplish a task. Having a menu bar at the bottom is more convenient for users, as they can easily navigate between pages.
Below are four videos that showcase the wireframes with a description of tasks given to participants. Our team was able to interview 6 participants in order to collect feedback.
Usability Testing
Results & Addressing Usability Issues
-
Users were confused on how to view appointment walk-in times from the Home Page
-
Solution: A "Map" tab on the navigation bar and adding the word "Book" with the "+" button for redundancy.
-
Clicking on these buttons re-directs them to the map, prompting them if they would like to choose "Walk-in" or "Appointment"
-
-
Confusion on how to search nearby clinics
-
Solution: Provide the user more flexibility by having them manually click on "my location" as opposed to the system automatically doing it for the user
-
Final Prototype
