myResponder

Redesign SCDF Mobile App

Project Summary

Results

7/10 people would download and use the application, 5/10 people would refer a friend

Role

UX designer and researcher (decider)

Things Done

User flows, Lightning demos, 4-Step sketch, Low-fidelity wireframes, High-fidelity prototype, User testing

Project Client

Singapore Civil Defence Force (SCDF) (School project)

Tools Used

Figma, Miro board

Team

UX/UI designers

Introduction


Keypoint: Lifesaving app with little active users

myResponder app is a mobile application by the Singapore Civil Defence Force to alert members of the public to nearby cardiac arrest cases and minor fires. myResponder works by notifying members of the public (also known as Community First Responders (CFRs)) of cardiac arrest and fire cases within 400m of their location, and it also highlights nearby automated external defibrillators (AED) that may be available to the responders and provides guided advisories in the mitigation of minor fires. However, to date, there have been very few downloads, and there are not many active users on the platform.

Design Process


Design Sprint is a five-day process that focuses on delivering solutions with a holistic approach to the product, business, and customers or users.

Design Process for myResponder

Monday


Keypoint: Long-term goal definition, sprint questions, and users to focus on

Long-term goal

On Monday, the long-term goal and steps to achieve it are being defined. An optimistic 2-year goal for this project would be:

  1. App to be downloaded by all Singaporeans / Permanent Residents
  2. Have registered responders increase from 116,613 to 450,000 (about 3 times the number of responders compared to today)
  3. Efficiently saving 90% of emergency cases within minutes

Top 3 sprint questions

Different obstacles that will prevent the team from reaching the long-term goal were being brainstormed, and the top 3 were being voted on as the sprint questions by the decider. The key consideration is whether the questions help to feasibly reach each of the three goals listed in the long-term goal.

Top 3 Voted Sprint Questions (in blue)

How-Might-We (HMWs) and Voting Tree

The team then listened to some expert interviews and created a list of HMWs statements for the different categories; this helped the team to diverge into more ideas and converge to focus on the most important question or statement. This helped the team to reframe the problems as opportunities for improvement and determine the parts of the app to focus on through voting on the voting tree.

HMW Categories and Voting

Top HMW Statement on Voting Tree

Mapping and choosing user flow

A user map is then created to clearly identify and connect the users and key stakeholders to our goal. The map allowed the team to visualise every step of the way, from the beginning of passers-by, responders, and SCDF operators' involvement in saving the victim to ensuring that the victim lasts until paramedics arrive and is being saved. For the project, it will focus on solving the HMWs statements for both responders and passersby, as well as the top 3 sprint questions.

Tuesday


Keypoint: Ideation

Lightning Demos

After knowing where to focus our efforts on answering our HMW questions. The team searched for existing ideas on the internet or app store, then took 1 - 3 inspiring examples to present to the team. Inspiring examples came from LinkedIn, Netflix, Classpass, Waze, TraceTogether and Grab.

Lightning Demos Ideation

4-Step Sketch

Ideas were further expanded using sketches, where each member created ideas for the app using inspiration from the lightning demos.

4-Step Sketch Drawings

Wednesday


Keypoint: Deciding on the ideas

Heat Map Voting and Speed Critique

During heat map voting, each member will take 3 minutes to present their concept and answer each member's questions, and at the end of it, every member will use their unlimited vote to vote for the ideas that they think help solve the sprint questions. There were three top ideas being voted on, namely:

  1. Filter
  2. Metronome
  3. Community

Design Ideas

Members Voted Ideas (Coloured Dots only)

Super votes

At the end of the session, the decider will cast up to six super votes, which will decide what the team does moving forward.

Super Voted Ideas

Thursday


Keypoint: Prototyping to solve sprint questions

User test flow matrix voting system and storyboarding

The first step before prototyping is to map out the user flow that a user might go through. Each member gets to come up with a user flow, and the best user flow will be chosen based on its relevance to the sprint questions and feasibility. With the user flow, it will be clearer what the full story might be, and the high-fidelity prototype will be created with reference to the storyboard.

All User Flow Ideas

Storyboarding

Prototyping

Solving sprint goal 1: To be downloaded by all singaporeans or permanent residents

Super vote 4 (the addition of distribution channels) helps to spread awareness and encourage users to download the myResponder app by having more distribution channels and partners.

Referral Function with Partners (Super Vote 4)

Solving sprint goal 2: Convincing singaporeans to register and be a myresponder after downloading the app

Super vote 5 (enticing rewards) helps to solve this by giving users some rewards to entice them to get CPR certification.

Rewards System (Super Vote 4)

Solving sprint goal 3: Efficiently saving 90% of emergency cases within minutes

The prototypes are created based on the super votes and user flow with the sprint goals in mind. Super vote 1 (navigation becomes easy) and 2 (live notification) help to solve sprint goal 3, which is to efficiently save 90% of emergency cases within minutes. With these two functions, users can quickly reach the victim with the appropriate equipment, or they can seek assistance from the appropriate professional.

Current User Flow (Super Vote 1 and 2)

Redesign User Flow (Super Vote 1 and 2)

In addition, super vote 3 (emergency guides) can also help to solve sprint question 3 as it provides quick navigation to useful emergency guides where the user can quickly recap what to do in certain situations.

Emergency Guides (Super Vote 3)

Friday


Keypoint: User testing

User Testing

Five different interviewees were being tested on three different tasks. Each task aims to test the different functions of the prototype.

3 Tasks Tested

Feedback and observations

The team consolidated all the feedback and observations from the different user testing sessions, and below are the consolidated findings for each of the tasks.

  1. Task 1: Referral
    • Referring five friends to get free CPR certification was not enticing enough for users to refer the application to their friends
    • Unsure where to collect the classpass credit
    • Need more enticing rewards
  2. Task 2: Navigation
    • To include a back button to allow users to go back to the previous page without having to cancel the ongoing navigation
    • Having drive or walk option to more accurate navigation
    • Arrive buttons not clear that it can be pressed
    • Ambulance icon take up too much space
    • No current location button
  3. Task 3: Metronome
    • Do not understand the meaning of the animated orange circle in the metronome function
    • Flow of calling 995 and using metronome was ambiguous
    • GIF would be a better option as compared to video
  4. Other Findings
    • Not sure where to find emergency guide

Revised Prototype


Keypoint: Changes to "arrived" button, ambulance information display, CPR video, Metronome, and rewards system

We created a prioritization matrix before diving into the new prototype to prioritize more important features that are critical to assisting us in answering the three sprint questions.

Prioritisation Matrix

1. Making the "Arrived" button more obvious and staying in the same area on the page

Made the design more similar to the current app design, changed its colour to green instead of red, and placed it back into its original position.

Before and After Arrived Button

2. Emergency guide buttons always appear on the different pages for easy navigation to the important guides

Ensure that an emergency guide button will be available on every page.

Before and After Emergency Guide Design

3. More discrete display of ambulance information

Ambulance information was removed from the map to save space on the map, and it was grouped with the other information details.

Before and After Ambulance Information Design

4. Replacing the CPR video with a GIF

Changed the video format to GIF so that the user does not have to decide whether or not to play the video.

Before and After CPR Instruction

5. Using numbers instead of repeated beats for CPR Metronome

Simplify the metronome guide by changing beats to a countdown in numbers and using the red button to start.

New Metronome Design

6. Creating more enticing rewards scheme for referral

Introduced a "coin" system where every referral will be rewarded with some coins that can be used to exchange vouchers that can be used in most places.

More Enticing Reward System

Conclusion


The team has managed to come up with user-centric solutions that can help the MyResponder application solve the three design sprint questions, leading us to reach our long-term goal for the application.

Reflection


The team dove too deep into each sprint question and ended up solving a bigger issue than just the single issue that we were supposed to target, which resulted in spending much more time on discussion of the issue and brainstorming on how to resolve it. The lesson learned is to always ask, remind yourself of the goal, and ensure that everyone is on the same track.

Test the Prototype


Please scan the QR code or click on the link to access the prototype. *Contact me if you cannot access the prototype.

×