top of page
Screenshot 2024-03-18 at 10.27.36 AM.png

CPR Training Guide

"Design a platform tool to help young adults learn how to give CPR"

The final project for the Coursera Google UX Design Certificate was to design an app for social good from start to finish. Finding users, creating our own research questions and then ideating, designing, testing, and prototyping. We were given a number of prompts to select from and I chose the following based on a close connection to the matter.

Role: Lead UX Designer

- Empathize

- Ideate

- Design 

- Test 

- Prototype

Goal

The goal of this project was to create a platform tool for social good. We wanted to create an app to help young adults learn how to give CPR. Not many people know the proper steps and we wanted to give the world a way to help others in need with confidence as it is a good skill to have.

Research

I started by creating a list of questions that I felt were important to know from potential users before starting the design process and to avoid designs based on my own ideas and biases.

​

Being AED, First Aid/ CPR certified myself, I had to disconnect my own thoughts and ideas in order to create a tool for the user. 

​

Using "Typeform'' I created a 3-6 minute questionnaire to gain insight on people's CPR knowledge. I posted the survey on Reddit in hopes to gain a plethora of individuals from all backgrounds.

Screenshot 2024-03-18 at 9.44.27 AM.png
Screenshot 2024-03-18 at 9.44.54 AM.png

In addition to the survey I also conducted a Competitive Audit to find other CPR Learning tools and found a few.​

Screenshot 2024-03-18 at 10.19.12 AM.png
Screenshot 2024-03-18 at 10.19.23 AM.png
Screenshot 2024-03-18 at 9.51.05 AM.png

Users

Unfortunately after being posted on Reddit for a number of days/weeks, I only received 5 responses. This is a small sample size, but I feel it represents a decent diverse group of participants age and occupation. 

SiteMap

The Original idea was to have a hierarchical sitemap, but after consideration I reworked the information architecture to have more of a sequential pattern based on steps to CPR as it could be used more for live CPR and not just a learning aid.

Screenshot 2024-03-18 at 9.56.50 AM.png
Screenshot 2024-03-18 at 10.03.45 AM.png

Before

After

Screenshot 2024-03-21 at 9.58.19 AM.png
Screenshot 2024-03-18 at 10.10.14 AM.png
IMG_0736.jpeg
Screenshot 2024-03-18 at 10.10.19 AM.png

WireFrames

After performing a round of Crazy 8's I settled on a few key design features that I wanted to implement in future drafts

Digital Wireframes

Once I was happy with the homepage layout, I went ahead and continued to design for the following screens. 

Screenshot 2024-03-18 at 10.10.31 AM.png
Screenshot 2024-03-18 at 11.02.35 AM.png
Screenshot 2024-03-18 at 10.23.36 AM.png

MockUps

Following a usability study on the lo-fi wireframes, I began testing colors using Color Palette with a red emergency color theme to ensure I was following WCAG using WebAim.

Screenshot 2024-03-21 at 10.26.00 AM.png

Prototypes

Determining the correct action (instant vs slide in) when triggered was important. Making sure not to have any delay or "distraction" of a sliding screen experience when going from screen to screen, but to have a more quick and instant approach. 

Screenshot 2024-03-18 at 10.25.09 AM.png

Final Polished Designs

Screenshot 2024-03-18 at 10.27.17 AM.png
Screenshot 2024-03-18 at 10.27.36 AM.png
Screenshot 2024-03-18 at 10.27.46 AM.png
Screenshot 2024-03-18 at 10.28.15 AM.png

Results/Outcomes

Overall the app seemed to be enough for people. There was still confusion as to what it was. People didn't seem to think it was solely for CPR. I need to expand on this more by reiterating or designing that it is solely for CPR and not all first aid scenarios.

What I learned

images.jpg

- Sometimes being too vague isn't helpful. I tried to avoid leading questions, biases, and yes/no answers, but I think I over-corrected and didn't give the participants enough information to accurately portray the use of the app. They made comments during the study such as "what if something else happens and CPR isn't needed in this situation?". I take it upon myself that my prompts and introduction to the study did not outline clearly what they would be looking at. A "platform tool to help young adults learn how to give CPR". 

- Some participants also mentioned that some features weren't "working". While I did note in the prompts that some features would not work at the moment, they must not have read it thoroughly or forgot so I need to be more clear. 

What's next?

- I want to keep improving this platform tool. I believe it can be valuable to everyone. "Rather have it and not need it than need it and not have it"

- I would also like to replace the pictures with live videos and icons using Google's Material Icons

- I need to learn how to create a metronome to count the correct BPM of compressions and number of breaths.

- Create a set of conditions to start/repeat on certain numbers when selected to have more of a hands free experience. 

- I would also like to speak with First Responders and see how they would find the app and ask them what kind of data or information they would need to know or would like to see if they approached a civilian performing CPR on another civilian.

download.jpg

Check back for updated prototyes and iterations

  • Screenshot 2024-04-04 at 10.56_edited
  • IMG_1532_edited
  • LinkedIn

©2017 BY MIKE TAYLOR. PROUDLY CREATED WITH WIX.COM

bottom of page