Project duration:
March 2021 to July 2021
March 2021 to July 2021
My Role:
UX design and research of Hands-Only CPR Smartwatch Application design from conception to high-fidelity prototype.
Tools:
AdobeXD, Adobe Photoshop, Adobe Creative Cloud Express, and Miro
Please click on images for high resolution.
Motivation:
According to statistics, many people face sudden cardiac arrest away from the hospital, and only less than half can get help from other people who know the CPR method due to a lack of know-how [1]. Importantly in case of sudden cardiac arrest, chest compression is more effective than breaths in terms of CPR. The person who has a cardiac arrest can be an infant, a child, or an adult.
Therefore, considering the importance of urgent help, smartwatches can be helpful to understand whether the heart pulse stops with the heart pulse feature and if so how to apply chest compression in a proper way by sending vibrations along with a visual count screen while applying CPR. This usage of HCI can save lives at the time needed.
Important Disclaimer:
This smartwatch prototype does not cover all CPR methods and should be revised by national health services before actual usage in the marketplace.
About CPR Pro Application:
The vibration technology along with visual stimulations in the HCI field has been increasing in many fields in recent years. With the use of smartwatches, we can perform CPR in a proper way. In this project, the user can sense when to compress to the patient’s chest with how many times on the watch’s screen.
Before starting, the user must select the patient type, whether that person is an infant, child, or adult, so the pulse numbers can be automatically set. Our project is a smartwatch application that holds the CPR compress numbers and patient type. We use the smartwatch's pulse and vibration feature and voice command to perform the application idea.
So, What Are the Challenges and Design Considerations?
-Users should be able to perform quick operations via the smartwatch screen.
-Due to the small size constraint, the design should provide a simple and effective interface.
-The navigation between pages should be fast.
-The Smartwatch size is small. Therefore buttons, texts, and images should not be small.
-The interface design should apply the visibility principle. By looking, the user should tell the state of the interface.
-In terms of screen feedback, whenever the user selects patient categories, the colors could be understandable since each patient will have its own color. Therefore, for the next step, the countdown borders of the interface will be the selected patient's color.
-Haptic vibration and voice commands should be synced.
Design Process:
Here is the iterative design process:
Deep Diving into Defining Problems:
I tried to focus on core problems as follows:
-Design should be agile and easy to use for emergencies.
-Design should provide an intuitive interface for first-time users.
-Design should lead users to achieve their goals in the fastest way possible.
-There should be different stimulants and guides other than images and text since there is a time constraint.
Gathering Thoughts with Mind Mapping:
Researching the Problem
Wait, What Is CPR?
I gathered and the data from official health publications and picked the most beneficial ones for the research.
CPR Research Information
Moving on! So, How Are We Going to Apply It in the App?
Furthermore, I continued to collect data from resources and tried to understand compression details on a patient.
The aim is to guide users while performing these actions with visual, audio, and haptic feedback!
Age-Based CPR Visuals
Why color feedback?
Because of an emergency, there is no time to read the text and pop up related feedback.
There are only 3 official patient-type options for hands-only CPR so it is easy to keep in mind color mapping for the selected patient.
“Color images were reported to have better memory recognition over black-and-white. Color has the potential to increase chances of environmental stimuli to be encoded, stored, and retrieved successfully.” [4]
Personal Interviews:
I conducted my survey with 10 people aged between 15-60. I paid attention to include not only smartwatch users but everyone to be able to come up with a big tent design.
Key findings:
Users find voice and vibrations useful while using their smartwatches
Users are skeptical about the agility of using a device in case of emergency
Users stated that memorizing color is easier than numbers or texts
Persona:
Empathy Map:
Scenario and Storyboard:
Benjamin sees a person lying on the floor and asks for help but there is nobody to help that person at that moment. Then, Benjamin checks the scene and the person. Benjamin also checks to make sure the scene is safe. Benjamin taps the person on the shoulder to see if he is OK and looks for signs of rhythmic, normal breathing. He sees that there's no response from the victim when asked if he or she is OK, then he calls 911. [5]
He quickly opens previously downloaded Hands-Only CPR via the Smartwatch app and recognizes the letters representing the patient type with its color. He then selects the patient type and starts performing CPR. When he is directed to the countdown screen he can be sure that he selected the correct type by seeing the color at the countdown border. Then the countdown starts immediately and guides the instructions via voice commands. For each pulse, the app sends vibrations to the watch to keep up with the related rhythm. When the countdown ends he stops and checks the person and realizes that the condition remains the same. Therefore, he restarts the countdown until the ambulance or a professional arrives.
User Flow Diagram:
Low Fidelity:
High-Fidelity Solution:
-The main aim is to provide fast assistance to perform hands-only CPR.
-Users can select the patient type (infant, child, or adult) quickly before starting hands-only CPR.
-The watch vibrates with the related rhythm while performing chest compressions.
-During compressions, the user can see the countdown.
-At the same time, the user can hear the commands while performing hands-only CPR.
-Commands guide users about hand/finger positions along with the depth of chest compressions.
Adult Select Screen
Child Select Screen
Infant Select Screen
Adult Countdown Screen
Child Countdown Screen
Infant Countdown Screen
Adult Restart Countdown Screen
Child Restart Countdown Screen
Infant Restart Countdown Screen
Quick Glimpse of the Visual Elements:
Usability Testing:
I conducted usability testing with three people whose ages are 15, 30, and 55. I observed their interaction and initial moves when they first encounter such an application. I asked attendants to complete certain actions on the Adobe XD prototype with a computer and I asked open-ended questions. In each session, I paid attention to how quickly they can engage with the design and I noted their overall thoughts about the concept along with the design.
The question list:
- What do you think this application is used for?
- In case of an emergency, can you read/see the screen clearly?
- Can you name the patient types on the screen?
- Can you tell me whether the selected patient color at the countdown helps you to remember what you chose on the previous screen?
The action list:
- Can you please select the patient type?
- Can you please start the count?
- Can you please stop the count?
- Can you please restart the count?
Results and Improvements:
Results were promising where participants were able to complete the task within a similar time. Regarding the questions, some participants failed to understand the patient type due to a lack of information.
From the results, I concluded some key findings for future improvement which are:
-Some visual support may be added just before the countdown begins or during the CPR.
-There may be an indication of the depth of the compression during the CPR.
-Emergency calls may be automatically started whenever the users press the start button.
Conclusion:
To create a safe and reliable human-computer interaction solution I get help from many medical resources about CPR. After understanding the necessary moves to perform CPR, I was able to break those down into tasks to create my design. After finishing the prototype, performing user testing was the most beneficial phase of my project.
Having the perspective and task results of participants, I was able to come up with key points for future considerations. Combining all these with the smartwatch design considerations and limitations has tremendously contributed to my design vision.
References:
1-) British Heart Foundation
2-) National Health Service UK
3-) Adobe Design Advices for Smartwatches
4-) The Influence of Color on Memory Performance
5-) Hands-Only CPR
