accessSOS | UX/UI DESIGNER
Designing a flow for deaf and hard of hearing users who may otherwise experience difficulty communicating an emergency to first responders using their voice.
Role
UX/UI Designer
Timeline
Aug-Dec, 2023 (4 month contract)
Skills
User research, app prototyping, WCAG
Context
Brief
accesSOS is a tech nonprofit that provides a life-saving solution by enabling direct access to emergency help for the deaf community.
The icon-based app allows users to describe their emergency and sends these details in comprehensive text form directly to responders. As the organization expands, they want to reduce the amount of time it takes users to complete a flow while simultaneously providing responders with complete and accurate details.
As a researcher and designer, I created and led user interviews as well as participated in the prototyping and designing of icons that were added to the interface.
Problem Scope
Calling 911 is the go-to for most people during an emergency, but for many Americans, verbally communicating to an operator is not an option.
01
In life-threatening and time-sensitive situations, it is important for users to be able to complete the accessSOS flow as quickly as possible.
02
Meet our Users
Deaf and Hard of Hearing
Non-English Speakers
Victims of Domestic Violence
It was important to consider the experience of users who are deaf/hard of hearing, non-English speaking, and domestic violence survivors in our testing and prototyping to consider how they would interact with the app and where its painpoints are.
How Might We Statement
HMW: design a customized reporting system that allows users to accurately report emergencies as quickly as possible?
User Research
Guiding Questions
Why are users taking so long to describe their emergency in the current flow?
01
Which icons in the current flow provide an unclear description of their emergency scenario?
02
Our Method
We decided to explore these questions primarily through user interviews, receiving data from 45 users across 5 different studies. Each participant was provided a scenario and asked to imagine themselves experiencing the emergency as they went through the flow.
Key Insights
01
Users struggled searching for icons, taking up time when reporting their scenario. This was especially true for scenarios that required two types of emergency respondents (e.g. fire and medical help).
“There’s all of those icons? If you have to swipe or scroll a lot, then there’s too many”
02
Users found that the current icon library for the fire category was not sufficient for describing their scenarios.
"I can’t detail how urgent the emergency is and how bad its gotten”
03
Users thought that the overal flow was too long with too many steps to report an emergency.
"If there’s a way to condense the information a little bit, it’d be better"
04
Some of the icons were unclear in their design and the message they were trying to convey.
"I'm not sure what's happening in these two icons (suspicious activity and stalking)"
Prototyping
Organizing Emergencies by Urgency
Mid-Fidelity Renders
Prototype 1:
Dropdown Menu
In this render, users could easily find icons by looking into relevant categories and searching for specific icons.
We considered this solution because dropdown menus are a familiar layout and reducing icons on initial screen can help users scan the page quickly.
Prototype 2:
Expansion
Here, users were given the option to expand icons to provide more details about their emergency.
The benefit of this prototype is that users can report their emergency more accurately with additional details. However, additional interactions may be overseen and hinder search experience
Prototype 3:
To Scroll or to Swipe?
In our first prototype, we divided and color-coded icons by emergency type but kept the vertical scrolling interface (pictured right).
We also considered adding a toggle bar to better organize icons and change the interface to horizontal swiping (pictured left). We also placed the icons into subcategories based on similarity, thus making them easier to find.
Based on our research, we determined that users prefer the scrolling method (left) which is the version we opted for in our final solution.
SECTIONS
TABS
Prototype 4:
Refreshing the Fire Page
Here we consolidated the fire emergency page and added a size of fire category. This improvement keeps the flow short while maintaining flexibility for users to report a wider range of scenarios and provide responders with relevant information about the urgency of the situation.
Pictured here is a side-by-side comparison of the original flow (left) next to our optimized prototype that was used in the final product (right).
Final Product
Introducing a more streamlined
emergency reporting solution.
CATEGORIZATION
Find the right icons, easily.
Icons are grouped and labeled by category to make searching for icons more optimal while completing the flow under pressure.
OPTIMIZATION
Receive emergency help quickly.
The introductory questions of the flow have been reduced from a 5-step process to a 2-step process, providing only necessary information for respondents.
ICON REFRESH
Report emergencies with confidence.
Newly designed icons to minimize time spent scrolling and interpreting.
In the end, we reduced the icon library from 36 to 30 icons to include only necessary information. Here is a highlight reel of our designs.
REVIEW AND SUBMIT