mobile app
iFirstAid: Redesigning Emergency Response
COMPANY
iFirstaid
ROLE
UX Consultant
EXPERTISE
UX/UI Design
YEAR
2022
Project description
Timeline
18 months
Background
I worked on this project at smile CDR, while also working on multiple other products.
Role
End to end designer - UI Architecture, UX Design, Visual Design, UX Research working with 1 other designer on this project
Initial State Analysis
This wasn't just another app redesign. Our research revealed that 67% of users considered immediate access to first aid instructions "essential," yet the existing app was creating barriers to this critical information. We were dealing with an application where user experience could literally mean the difference between life and death.
"We should convey that we're here to help, not to sell first aid." - CEO
Heuristic Analysis
I began with an exhaustive screen-by-screen analysis of the existing application, while the other designer conducted a parallel heuristic evaluation. When we combined our findings, clear patterns emerged - from critical usability issues to subtle interaction pain points. These insights were powerfully validated during our user testing sessions, where participants struggled with the exact issues we'd identified.

Barriers Before Life-Saving Aid

Barriers Before Life-Saving Aid - 2

Navigation Barriers in Critical Moments

Life-Critical Communication Failures

First Aid Content: When Seconds Count



Critical Navigation Issues
Information Hierarchy
Life-saving content buried in nested levels
Unintuitive back-and-forth navigation
Critical information too many taps away
Non-urgent features taking priority
Suggested Architecture
Replace nested navigation with vertical scroll
Use progressive disclosure within topics
Surface critical content on home screen
Move non-urgent features to menu
Content Quality Issues
Inconsistent Information Delivery
Missing videos for crucial topics (e.g., CPR)
Unexplained medical terminology
Assumed knowledge in critical procedures
Unbalanced topic distribution (5 main vs 18 'other' topics)
Language Barriers
Medical jargon ("foreign body")
Technical terms ("non-adherent sterile dressing")
Missing practical examples
Unclear kit references
Media Format Effectiveness
Current State
Unclear optimal format choice
Video/text relationship undefined
Demonstration opportunities missed
Format effectiveness untested
Research Needs
User stress response studies
Information absorption patterns
Format effectiveness in emergencies
Best practices for critical instruction delivery
Secondary Features & Content Management Issues
Competitive Analysis
When seconds count, how do users actually process emergency information? Our research into crisis communication revealed patterns that fundamentally challenged our assumptions about interface design. The findings reshaped our approach to emergency instruction delivery.
Speed of Access
The Visual Language of Emergency
Offline Access


Key takeaways
→ 67% of people said it was essential to have access to first aid instruction, 33% said it was nice to have, and 0% said access to first aid instructions was dispensable.
→ 71% preferred accessing first aid information via an app that can be used offline.
→ 81% showed strong interest in having access to an app that improved first aid knowledge
→ 90% of people said they would ACT FIRST in an emergency vs. looking up first aid instructions.
Personas
Wireframes
Improvements
Critical Transformation: Removing Emergency Barriers
Initial Design
Required authentication before showing any emergency content.
Users faced immediate video download decisions before seeing any app value
Initial language selection created unnecessary friction in emergency scenarios.
Final
Provides immediate access to critical information while moving optional features like account creation to a secondary flow.
Prioritizes instant information access, introducing optional content downloads only after users understand their purpose.
Detects device language automatically while maintaining easy access to language preferences for non-emergency situations.
Navigation: When Every Second Counts
Initial Design
Logo dominated valuable screen space
Emergency call button buried among other features
Duplicate functions: "Call for Help" vs "Emergency"
Cluttered navigation with non-emergency features
CPR instructions separated from main first aid flow
Travel guides and mental health competed for attention
Multiple navigation paths to same information
Ambiguous button purposes created hesitation
Final
Emergency call button persistent in top navigation
Logo removed to prioritize critical information
Single, clear path to emergency assistance
Non-essential features moved to secondary menu
All first aid procedures unified under one flow
Clean, focused emergency-first interface
Added what3words for the location
First Aid Content: Speed Through Clarity
Initial Design
Critical information buried 5 levels deep
Required back-and-forth navigation
Small, uniform buttons for all conditions
Hidden content behind multiple taps
Mixed emergency and non-emergency items
Final
All critical content visible on first screen
Single scroll replaces nested navigation
High-priority items visually emphasized
Emergency procedures given larger buttons
Color coding indicates urgency level
Important procedures instantly visible
Zero navigation depth for critical items
Secondary Features: Simplifying the Essential
Initial Design
Hamburger menu hid critical features
Redundant emergency buttons in different locations
Search buried in menu options
Many different functionality that doesn't work
Final
Critical functions moved to persistent top bar
Search always visible and accessible
Emergency call button permanently anchored
Mobile-first bottom navigation
Secondary features properly categorized
Clear, consistent back navigation
Simplified account access
Focused feature priority
First Aid Content: Speed Through Clarity
Initial Design
Inconsistent layout (videos, real life pictures, cartoons etc)
Non intuitive navigation with vertical scroll.
Not being able to see the full steps ahead of time.
Final
Used illustrations for instructions
Side scroll navigation (competitive research)
Full steps are shown ahead of time with the ability to jump into any step.