Covid 19 Vaccine App

Process & Agile Methodology 

To ensure successful materialisation of a user-centered design project, it is imperative to abide by a Project development life cycle. While there are many applicable life cycles, the chosen life cycle for this project is known as the Design Thinking Life Cycle. The design-thinking framework follows an overall flow of 1) understanding, 2) exploring, and 3) materialize. Within these larger buckets fall the 6 phases: empathize, define, ideate, prototype, test, and implement.

Agile, known for its flexible, iterative approach to software development, and Design Thinking, which emphasizes understanding users' needs and creatively solving their problems. When these methodologies combine, they create a powerful framework for innovation that is both user-centered and highly adaptable to change.

Heuristic Evaluation

The website in Qatar for COVID-19 vaccine registration has been found to have several user experience issues. Users reported the absence of FAQs or help sections for guidance, the system's failure to prevent incomplete submissions, and the inability to edit information post-registration. Additionally, users cannot select their preferred date and location for vaccination, leading to potential scheduling conflicts. Despite fulfilling its primary function, these design flaws result in a frustrating experience for users.

Data Collection and Evaluation

Surveys and Interviews 

A survey with 18 questions was distributed to gather diverse opinions on the COVID-19 vaccine. Participants were categorized based on their vaccination status. The survey aimed to understand participants' views on the vaccination process, its difficulties, and any complaints. Additionally, demographic and contact information were collected for potential follow-up interviews. Google Forms was utilized for its data organization and visualization capabilities, details of which will be discussed later.

Selected survey participants were invited for follow-up interviews to delve deeper into their experiences with the vaccination process. Consent was obtained, and interviews were conducted via Zoom to explore their motivations, information sources, vaccination experiences, opinions, and suggestions for improvement. The interview questions were tailored based on the respondents' survey answers, and the discussions were recorded and transcribed for further analysis.

Note: The pie charts depicting the statistics for the answers we received can be seen below. However, not all questions are shown below.

Behavioural Variables

Once the users had been interviewed, a color-coded Excel sheet was used in the mapping of the data we received from the interviewees, which helped to simplify the analysis and identify any patterns or trends in their responses. Their answers were separated into a total of four categories representing different attributes. The attributes are pain points, task/activity, motivations, attitudes and environments. Special attention, however, was paid to the results that generated pain point responses as those highlighted flaws and struggles in the system that can later be improved upon.

Personas

The data analysis identified two main personas: Ryan Howard and Madison Gonzalez. Ryan, chosen as the primary focus, is not tech-savvy but values planning ahead. He's getting vaccinated due to obligations but has no concerns about the vaccine. He prefers online registration that mimics in-person hospital registration. His user story is: "As someone with a busy schedule, I want a straightforward way to register for a COVID vaccine so I can plan ahead."

User Journey Map

The user journey map for Ryan highlights his interaction with the current system, which starts smoothly but quickly leads to frustration. Lack of clear instructions wastes time, navigating between different websites causes confusion, and the absence of options for vaccine location and timing disrupts his schedule. Overall, Ryan leaves the system feeling more frustrated than satisfied, reflecting a negative user experience.

Feature Generation

The design phase prioritized creating features tailored to the needs of the primary user, Ryan Howard. His main requirements included easy registration for vaccine receivers, clear presentation of required information, and minimal redirection to other sites. To address these, the team implemented a system allowing Ryan to select his preferred vaccine location and schedule, streamlined data collection through an ID scanner, and ensured comprehensive data entry before proceeding. Additionally, a separate booking page for the second vaccine dosage simplified the process. By consolidating these features into a single downloadable application, the team aimed to enhance user experience and minimize confusion.

Information Architecture

The team first brainstormed screen ideas and then focused on designing the navigation model for their application. They opted for a blend of hierarchy and hub-and-spoke patterns, favoring a mostly linear structure that branches toward the end. The structure begins with onboarding screens, including a welcome page and tutorial for registration and booking. Users then proceed step-by-step, choosing their preferred vaccine brand, selecting a facility, date, and time, registering information, and scanning their ID card. After completing registration and booking, users are directed to a home screen where they can schedule their second dosage, access FAQs, or view a registration summary.

Wireframes

Wireframing is essential for prototyping, providing a structural outline and feasibility assessment for each screen. In our project, three group members created separate wireframes based on the information architecture, which we then discussed in group meetings, considering feasibility, design guidelines, and our primary persona. By comparing flaws in each design, we drew conclusions to refine our approach.

Wire Flow Diagrams

In order to better understand the structure of the application and how one screen flows to another, each member also arranged their wireframes into wire flow diagrams. The links to these diagrams can also be found in the appendix. 

High Fidelity Detailed Mockups

Help and documentation

To enhance user support in line with Nielsen's last heuristic principle, we've integrated FAQ screens and detailed tutorials. These sections offer step-by-step guidance and address common queries, enabling users to easily navigate the app and troubleshoot issues by moving from instructional content to FAQs with a simple click of the 'next' button.

Aesthetic and minimalist design

This heuristic focuses on providing only essential information to users to ensure a seamless booking process. It emphasizes simplicity and clarity in the app's design and information presentation, avoiding user overwhelm by keeping details concise and straightforward. An FAQ section is available for in-depth queries, but accessing it requires user initiative. Additionally, the app is designed intuitively, allowing users to bypass tutorials if desired, as the necessary actions, buttons, and inputs are self-explanatory.

Consistency and standards

To ensure a seamless user experience, our application was designed to keep users engaged without navigating to external sites, maintaining a consistent design and aesthetic throughout. This approach includes uniform color schemes and a cohesive look and feel, aligning with our initial commitment to a unified application environment.

Match between the system and the real world

This is the quality of using language and concepts that are familiar to the user in order to make the application more accessible. Our primary persona Ryan Howard expressed frustrations with other applications for not making it clear what the inputs required of him are. For our application, we made certain to use simple, straightforward, and easy-to-understand language that makes clear what it is that the user needs to do and will guide them through the application smoothly.

User control and freedom

In heuristics, granting users control over their actions is crucial. This includes providing the ability to undo and redo both intentional and unintentional actions. Our app ensures this by offering a back button on nearly every screen, allowing users to easily navigate back and correct any mistakes made in previous steps.

Visibility of system status

This application prioritizes user experience by ensuring clear communication of the system's state throughout processes. Upon completing the booking process, users are directed to a success screen displaying confirmation details and allowing actions such as printing, downloading the registration summary, or returning to the home page. This feature is available for both the first and second doses of the COVID-19 vaccine.

Scenario & Tasks To Be Evaluated 1

Before initiating testing or participant recruitment, we had to create two scenarios tailored to our prototype's objectives. One scenario reflects the frustration of our primary persona, who couldn't select their preferred vaccination location. Consequently, in the prototype, users were provided with the ability to customize the vaccine's date, time, location, and brand.

Scenario & Tasks To Be Evaluated 2

In the initial prototype iteration, we omitted an option which we had discussed in our coursework report. We intended to provide users with the ability to reschedule their first dose appointment. However, we did not include the option to reschedule the second dose date because its timing depends on the consumption of the first dose. Failure to receive the second dose within a specific timeframe renders the first dose ineffective.

Procedure

Once the scenarios and tasks were decided, it was time to recruit the participants so the tests could be started. The participants were recruited if they met one of the following conditions.

1. He or she has gone through the vaccine registration process in the past.

OR

2. He or she is going to register for the vaccine.

OR

3. Had issues with the previous vaccine registration apps.

OR

4. Going to book the second dose soon.

Participants underwent online testing via Zoom, where they first consented to the process, ensuring their information's confidentiality. They accessed the test through a provided Zoom link, engaged with a Figma prototype, and were informed of a known glitch requiring multiple button presses. Their task performance and thoughts were recorded, and these recordings were securely stored post-test. Following the test, they completed a modified System Usability Scale (SUS) questionnaire, originally developed by John Brooke in 1986, using Google Forms for easy submission and analysis. This questionnaire, adapted to fit the project's needs, included seven out of the original ten questions.

FAQ and Instructions Screens

We initially designed these screens to assist users who might encounter issues by providing relevant information about the application. However, we inadvertently created screens overloaded with text, deviating from our goal of a minimalist design. The dense layout and lack of spacing between instructions resulted in a cluttered and potentially confusing user experience.

We chose to address the issue of the cluttered screens and overflow of information by first properly spacing the tutorial pages, thus giving the screen a more organised feel to it. As for the FAQ, rather than displaying both the questions and answers for the user, we opted to only display the questions and make it so that the answers only display themselves when the user clicks on them thus the user will only have to see the information they want. 

Registration Summary Screen

For the registration summaries, we simply added a back button to the screens where there weren't any, thus giving the user more freedom and control.

During the creation of the summary page, it seems that we had failed to include a reschedule button to take the user to the previous screen. This was a slight but important error to correct because, during the initial conception of the application, we placed emphasis on granting the users the freedom and control