DESIGN FOR EMERGENCIESPROJECT MANAGEMENTMENTORSHIP

ASAP

A website connecting EMTs & Resident Assistants to expedite on-campus emergency response.

Date November - December 2018
Platforms Mobile, Desktop
Team Yellina Yim, John Han
My Role Project Manager, User Research, Interaction Design, Visual Design

PROBLEM SPACE

How might we expedite the process of receiving care in an emergency?

On-campus emergency calls are diverted through a grapevine of police officers and dispatchers. By the time an EMT receives a message about an emergency, he or she must drive to the scene, park, locate the patient, and collect background information. Precious moments are wasted when the patient could be receiving medical care vital to his or her survival.

SOLUTION

A responsive website giving EMTs a report of location, symptoms, and patient status prior to arrival.

ASAP connects university Resident Assistants (RAs) with EMTs during emergencies, improving efficiency by speeding up the process of locating each other, providing context prior to entering a situation, and decreasing time spent assessing a patient's initial condition.

FEATURES

Establishes trust with pre-populated information & location services.

All RAs become members of ASAP and remain signed into the site, streamlining access when confronted with an emergency situation. Meanwhile, the Res Life Office loads all students' information into the site prior to the beginning of the semester.

Provides procedures to take while waiting for help.

Research has shown that any prior training goes out the window during an emergency. ASAP solves for this by guiding users through a simple, step-by-step website to both report an emergency and receive instructions while waiting for medical help to arrive.

EMTs receive live updates as RAs complete ASAP.

EMTs traditionally enter emergency situations without sufficient context about the patient, condition, or specific location within a dorm. By giving specific location details, ASAP helps EMTs locate patients to provide medical care as quickly as possible.

GENERATIVE RESEARCH

Through 13 interviews and 4 contextual inquiries, we heard that students deal with intoxicated roommates most frequently.

Binge drinking is the most common emergency situation dealt with on campus, and roommates and friends often get caught in the middle of it. Of 500+ calls to the CMU EMT, over 100 were for intoxication alone.

→ INSIGHT #1

Students are afraid to call 911 to get help for intoxicated roommates or friends.

CMU leaves ambiguity around sanctions for underage drinking which exacerbates a preexisting fear of calling for help. Resident Assistants are often the ones to intervene in an emergency situation related to drinking, as it is a job requirement.

→ INSIGHT #2

The steps between calling 911 and receiving help are disjointed and inefficient.

Emergency calls are diverted through a complicated phone tree. By the time an EMT is dispatched, drives to the scene, and parks, he or she has to navigate through a complicated student dorm to find the patient.

JOURNEY MAPPING

We pivoted from focusing on students to solving lapses in communication between RAs and EMTs, mapping out their journeys.

We decided to diverge from our original user group (students) and focus on RAs as our primary users due to uncertainties about fellow students being intoxicated. We mapped out EMTs & RA journeys in the context of helping an intoxicated student who needs medical care.

→ INSIGHT #1

RAs and EMTs both struggle to locate each other & apply medical care quickly.

With both our customers’ and service providers’ journeys mapped out, we were able to see overlap between their unique pain points and begin to envision solutions.

PERSONAS

We designed personas to represent our core customers: resident assistants & EMTs.

STORYBOARDS & SPEED DATING

We speed dated 5 solutions with 4 students and RAs.

We envisioned scenarios relevant to our personas with responsive web solutions. We translated these scenarios into storyboards for speed dating to validate needs we had identified through research.

Speed dating ensured that we would not create an unadoptable or inappropriate solution, allowed us to abandon bad ideas quickly, and adjust our storyboards on the fly.

WIREFRAMES

Low-fidelity wireframes helped us simplify ASAP.

Through wireframing, we better understood what elements to include and exclude from our interface. We were able to test out many different ideas quickly, figuring out an optimal layout for our users.

Wireframing helped us solidify a site map & user flow.

Wireframes informed the logical steps in ASAP's process, and determined the order of our screens. Testing out low-fidelity mockups taught us to include "next" buttons on screens in which it could be easy to make a mistake, but leave it off of confirmation-only screens.

Through usability testing, we iterated to create more functional designs.

User testing taught us what worked and didn't worked in terms of button placement, color, typographic hierarchy, and wording. Over time, our designs became more polished and straightforward, focusing on functionality and simplicity.

DESIGN DECISIONS

1. Reduce cognitive load through progressive disclosure.

Action: Show only one necessary action on each page.

Rationale: Minimizing content reduces users' cognitive load, allowing them to move through the website more quickly and accurately.

2. Large buttons & text for faster clicking and scanning.

Action: In line with Fitts' law, make buttons large and easy to click. Use a large pt size to improve readability.

Rationale: Speed is everything in an emergency. Optimize all content for fast usage.

3. Add context to establish trust.

Action: Rephrase text to add context; i.e., "is the student" & "dorm".

Rationale: Make it incredibly clear that the system is campus-specific, and knows exactly where students needing help are located.

4. Progress bar to reinforce the site's brevity.

Action: Give users an idea of where they are within ASAP's system through a progress bar.

Rationale: A progress bar reassures users and reinforces the site's efficiency.

STYLE GUIDE

We chose a cool color palette to create calm in chaos.

We decided to implement cool colors and a dark, tranquil top banner to calm down users in an emergency situation.

1. Color Palette

2. Typography

REFLECTION

Scoping is extremely important.

We were given the broad category of emergencies at the beginning of this project. By narrowing our project scope down to roommate emergencies on campus, and then further focusing on the window of time directly following an emergency call, ASAP became tremendously easier to design.

Emergencies have unique design considerations.

Working within the context of emergencies was a unique design challenge. Unlike typical design projects, our team focused on getting the user out of our site as quickly as possible, to confront the real-life scenario taking place. We integrated psychological concepts including Fitts' Law and progressive disclosure, into our design to maximize usability.

Design can establish trust & self-efficacy.

Instilling trust was a primary concept throughout our design process. By integrating features such as automatic sign-in and a thorough onboarding process, we provide users with the relief and knowledge necessary to manage the difficult situations unfolding in real time.

< PREVIOUS PROJECT
NEXT PROJECT >
OVERVIEWPROBLEM SPACESOLUTIONGENERATIVE RESEARCHJOURNEY MAPPINGPERSONASSTORYBOARDINGWIREFRAMESDESIGN DECISIONSSTYLE GUIDEREFLECTION

"Let the beauty of what you love be what you do." –Rumi

© Molly Vierhile 2019