Marriott-Slaterville City
To build a pleasing, highly usable interface with a clear, meaningful brand identity for a municipal government agency website that functions as the main portal for communication, participation, access, and economic development within the rural community it serves.
Timeline: 5 weeks
About Marriott-Slaterville City
Situated on the northwestern outskirts of Ogden, Utah, Marriott-Slaterville is a rural farming community of nearly 2000 residents, aptly designated “Utah’s Open Space City.”
While locals pride themselves on their dedication to the family, to the land, and to one another, the current branding does not reflect the warm, open, generous, simple, neighborly, hard-working, down-to-earth qualities that its citizens espouse.
Research + Discovery
Agency interview
We interviewed the City Recorder to better understand the agency’s purpose and what they needed their website to do.
By evaluating & redesigning the information architecture, providing better access to online actions, and making common tasks prominent, we can streamline the process of accessing information and forms for residents of the city.
Website audit & analysis
We conducted a website audit in order to assess the current site’s branding, usability, and functionality. We explored the site to become familiar with current branding, design, navigation, and information architecture.
There were several obvious challenges with regard to aesthetics, clarity, color palette, information architecture, readability, technical clarity, and function predictability
Heuristic evaluation
Digging deeper, we ran an evaluation of the website’s efficacy within four key heuristics categories. It failed three of them.
We need to prioritize aesthetics, navigation, and functionality in redesign.
Color accessibility
We evaluated the site’s color accessibility and of the three main colors used, only one of them passed.
Defined user pathway
We mapped out the user path for the building application process. The current webflow for discovering the building codes and ordinances is obscured by confusing jargon and thousands of pages of information to sort through. It’s even more difficult on a mobile device.
We would need to redesign the information architecture & navigation to orient users and eliminate confusing jargon on copy.
Competitor UI feature analysis
We conducted a competitor analysis to gain a clearer understanding of how Marriott-Slaterville’s website features and functionality compared to both a large, well-known municipality and a smaller, more local one.
Insights
For those with mental health struggles, most of their energy is expended well before they can even get to normal daily activities because they are in constant combat with their illness.
Our users need a secure, easy, time & energy efficient way to research compatible mental health care providers in order to begin treatment.
Definition
User Personas
Our research uncovered 2 clear categories, and 4 types of users:
-
Providers (out of scope for project)
-
mental healthcare professionals including doctors, therapists, counselors, etc.
-
-
Clients / patients
-
middle-aged, career women
-
returned military personnel
-
parents of children with mental healthcare needs
-
 |  |  |
|---|
*personas were based on actual user interviews conducted by Amanda & Rebecca
Storyboarding
After interviewing potential users, we aligned their needs with our product goals to develop a common understanding, find compromises, and formulate user insights through their journey. Based on the results, we developed the storyboard which will be the conceptual stage for the (lo-fi) prototype.
Guiding Principles
We had 3 guiding principles that we developed through our user insights and product goals. The product had to be:
Instructive
We wanted to guide users throughout the entire journey and ultimately guide new users who have never searched for a therapist, assuming that they don't know how it works.
Convenient
Since the product aims to offer users a streamlined way of finding a therapist, it meant that using the product has to be more convenient than the current methods. It also meant the product needed to have an all-inclusive database of therapists.
Secure
While interviewing potential users, we learned that they need to be reassured that it’s a trustworthy and reliable product. We wanted to achieve this by not asking for personal information beyond what was necessary to connect them with the right matches.
Ideation
We generated a wide range of ideas and turned the sketches...
...into task & user flows, and turned our flows...
...into wireframes and mocks.
*due to COVID-19 protocols, all testing was conducted remotely
*due to COVID-19 protocols, team meetings were conducted via video conference
Usability Tests
In several rounds, we tested our prototypes, observed users interacting with them, and listened to their likes and dislikes.
After we validated our concepts and assumptions, we applied the visual branding elements.
*due to COVID-19 protocols, all testing was conducted via video conference
Shaping our design decisions based on our
'How might we...' explorations
Make discovery effortless
-
by allowing users to add minimal personal information before accessing full use of the product
-
by adding provider criteria filters accessible from their profile
-
by allowing changes to be made at any time
-
by giving users the ability to remove incompatible providers from their search
Increase the success rate of users
matching with a compatible therapist
-
by allowing users to match with as many providers as they'd like
-
by giving users the ability to schedule chats with multiple providers
Create an end-to-end experience that
delights and earns customer trust
-
by creating design considerations for every step of the journey
-
by clearly communicating using microcopy
-
by considering edge cases and error states
-
by making customer support easy to access
Introducing
THERO
Discover & create your profile
By following quick and easy instructions, you can create an account with minimal personal information.
Access favorite providers, start a new provider search, edit your settings or adjust provider filters all from your profile page.
Choose the criteria that fit your needs
Narrow the field to show only the providers that meet your criteria by using specific filters such as insurance, location, gender, specialties, and years in practice.
You can easily adjust these filters to broaden or narrow your search at any time from your profile.
Read through provider bio & add to favorites or remove to see the next provider in the queue
Choose to connect with the provider or leave them in your favorites and continue searching
Connect through text, phone, or request video chat or appointment
Plan with flexibility
Reach out to a chosen provider by sending a request for a video chat with your general availability.
No need to commit to a full session until you can meet and decide if they're a good fit.
You'll receive a message to verify that your request went through.
Research, discover
& connect in one
fell swoop
We wanted to make sure users had a faster and more convenient way of connecting with a compatible mental healthcare provider.
By thinking about what essential information is relevant while the user is searching, we were able to put the user and their journey at the center.
Reflection
Next Steps
Our immediate next step would be to test our hi-fi iteration, then refine according to user feedback. Once that’s been dialed in, we would need to turn attention toward building out the Provider side of the app.
Learnings
Scope creep is a thing
The scope of this project was huge, and way too much for two people to accomplish well in just a month. It was important to be clear about our goal and priorities in order to make realistic progress.
Spend more time on the research
An Affinity Diagram is only as good as the questions you ask in the interview. If you don't have solid data to extract from the affinity diagram, you need to go back and figure out better questions to ask to get to the heart of the matter, otherwise your design will likely be off target.
What I'd do differently
Because of our limited time and resources, we missed out in opportunities to make this even better. If we had the opportunity to push this even further, these are what I would do differently:
-
Test in a physical setting
-
Dive deeper into the user's journey
-
UI Transitions to give visual orientation
-
Accessibility Considerations