UW Medicine
‘Near Me’ Location Search + Card View Element
Business Goal
Create an experience that enables potential patients to easily explore locations, choose one that meets personal selection criteria and make an appointment or contact the location.
User Story
As a potential patient of UW Medicine, I would like to 1) easily search for and choose a location that meets my needs, 2) quickly vet the breadth and availability of services offered and 3) view contact information readily, so that I can reach out if I need to and book using the channel most convenient for me.
Context
When users come to UW Medicine location search, they have a specific task in mind and are thus activating the task positive neural network. When they are looking to assess the convenience and breadth of care available, they have very specific questions in mind such as:
Is it close to me?
Are the services I need offered?
What do I do next?
How can I get this done quickly?
These guiding questions were compiled from preliminary user interviews around information seeking behavior completed in February.
My Impact
I served as the sole UX/UI resource tasked with designing a flexible search results system and a deep preview card element that could be used across the website.
Redesigned elements of the experience included
Responsive, deep preview card results that surface key information and pathways
Incorporation of a ‘Use my location’ interaction option
Location search results before the card view redesign
Design goals
How can we make the interface more useful by prioritizing the information users seek and providing a deep preview about a particular location?
How could we make the interface more actionable by providing opportunities for user to not only find information they seek, but appoint and act on it?
How can we reduce the visual clutter and make the information more scannable?
Key design considerations
Creating a snapshot that would provide utility and value to potential patients, so they aren’t forced to click through to a location result page to view the information they need
Balancing the representative content with brevity
Building a cohesive experience while surfacing information of varying lengths/detail
Responsibilities
Generative user testing (via UserTesting.com) to determine content/UX elements of the location cards
Wireframing
Evaluative user testing of the search form and results display
High-fidelity UI design
Participation in all Agile ceremonies as an embedded member of the development team
UX/UI review before code release
Process
The screens below illustrate what I call the “messy middle” of the project. They represented exploratory versions I completed before landing on a final design.
After 5-6 competitive takedowns of other search experiences in the same vertical, I began by focusing on horizontal view. Yet it didn’t guide the user’s eye or allow them to credential several clinics at the same screen latitude on larger devices (tablet and desktop).
Two conversations meaningfully impacted the project. In one, a developer mentioned that it would be easier to build if the card width was set. In another, our product owner asked whether I could see other uses for the cards across the site.
These pivotal conversations set me on a path to create cards with a standard width used not just on search but on two other page types across the site.
Presentation Gallery About My Process Creating the Location Cards
Click a slide to view it | Presented at a team meeting for UW Medicine staff
The cards reduced the interaction cost for users who had the information they needed and were ready to make an appointment. They no longer needed to click through to the clinic pages to see the phone number, hours and specialties offered.
Front page of location search
Use my location reveal
Using testing showed that most users preferred to enter a zip code rather than use their own location. Rather than cluttering the interface with this option, it is revealed when the user clicks into the text entry box for use should a user choose to leverage it.
