defining the project
I conducted a cognitive walkthrough with the product manager to identify more specific pain points on the current site selection page.
Color is a population health platform that seeks to bring health services to large numbers of people. For this project, I worked with the Vaccines team to enable our partners to vaccinate members in their communities. My focus was on redesigning the location/site selection page with in the patient registration flow.
Lead Product Designer
Product Manager
Product Designers
Content Strategists
User Researcher
Engineers
With the stress of the pandemic and rising contagious viruses/illnesses, patients are looking to book appointments for multiple vaccines such as COVID-19 and Flu in one visit. They need a clear way to book an appointment for multiple vaccines in one registration flow.
I conducted a cognitive walkthrough with the product manager to identify more specific pain points on the current site selection page.
These were our 3 identified pain points:
Current design does not support displaying more than one vaccine at a time.
Sifting through search results is not optimized, it does not clearly show which site offers which of the user desired vaccines.
There was new content (string with location info) that is required to be added to scale experience to other products but it gets lost in current design.
Since the stakeholders had a deep understanding of who their patients are, I interviewed them and learned that the patients ranged in age, were located in California and Massachusetts, and were primarily registering for vaccines on their mobile devices. This information led me to ideate from a mobile-first lenses.
Since I observed that users' emotions, decisions, and motivations while going through vaccine registration were impacted by their surroundings and loved ones. That is why I took a unique approach of thinking of patients' vary needs as the varying needs of a family unit rather than a single user.
From here, I collaborated with the product manager to use our insights to create user stories and help brainstorm edge cases that I would need to design.
As someone who needs to register for more than one vaccine...
In order to best advocate for user needs, I familiarized myself with the larger team goals to align them with the goals and needs of the users.
I took what information I learned about the project and users to expand on the user stories and address more inclusive needs.
I focused on 3 unique stories and laid out different user priorities:
Now that I built an understanding of the motivations and pain points of the Fischer family, I searched for solutions that would address their needs. I collaborated with a user researcher to conduct a competitive analysis.
50% of vaccine sites & 60% of indirect competitors used 1 shared map.
More than 67% of site selection pages combined date & time into each individual location cards.
91% of all competitors organized locations by distance.
Cognizant of what I learned, I went ahead and started sketching out some solutions. I started out creating hand-drawn wireframes to jot down as many component explorations as I could. I started out with mobile layout and explored content hierarchy for each site.
After I finished ideating, I used Color's design system to transfer my initial designs over to digital mock ups to receive feedback from the design team during a design crit. I also conducted a crit session with the developers on my team to better understand the feasibility of my explorations.
After many walkthroughs with stakeholders and in design crits there were a few tradeoffs I made to reduce engineering cost and align my work with other products. I provided alternative solutions without deprioritizing any of the user's needs.
Throughout the ideation process I faced a few challenges that I had to adapt and evolve my work around to ensure I was always advocating for the most important user needs
Throughout my process, I kept tabs on areas where I had to make decisions around incorporating accessibility
As I started to polish off my final mobile designs and aligned them to our newest design system, I worked with another user researcher and designer to put together a usability testing plan. I also ensured my final designs were WCAG compliant during this stage before going on to testing.
In the end, I was able to align our team's capabilities with users needs. Real participants gave overall positive feedback on the new site selection experience:
"I appreciate the information on the sites that it offered while I was choosing between options - including the address hyperlinked to maps"
"their feature i.e. wheelchair accessible etc. was fantastic"
"really appreciated being able to see the dates so that I could know right away what would be better in that sense versus opening each to compare"
Since the priorities of this project relied on changing federal guidelines more than the design thinking process, I used the information I knew at each step to try and navigate closer towards human-centric solutions.
This project was the first time I collaborated in a cross-functional team with non-designers. Some of the best design feedback I received came from indirect stakeholders and engineers. Moving forward, I want to invite them to collaborate earlier in the ideation phase of my process.
Scheduling feedback or crit sessions became nearly impossible with several busy schedules towards the end. I learned to document my files, video record processes, and provide more context to allow for async feedback and collaboration.
.svg){kind=small}
I'm Blanca Díaz, a people advocate and an insight-driven designer who takes a holistic approach to solve complex world problems. I'm a lifelong student and supporter of accessible and inclusive design.
