Project 1

1. Purpose and project background

The BP Mind app aims to engage with health by understanding the relationship between stress and blood pressure, enhancing motivation for blood pressure management, and actively supporting improvements in overall health. While it is widely known that stress affects blood pressure, accurately understanding and managing this impact remains challenging. BP Mind focuses on the fluctuations in blood pressure influenced by stress. By recording and visualizing blood pressure, stress levels, stress management practices, and symptoms, the app facilitates understanding of changes and patterns, helping to raise awareness of effective treatment and health management.

Blood Pressure Management

Monitor overall health by recording blood pressure and analyzing patterns.

Symptom Tracking

Identify symptom patterns and their links to blood pressure and stress to enable early detection and effective management.

Stress identification

Understand stress patterns and triggers by evaluating physical, mental, behavioral, and emotional factors to enhance coping strategies.

Stress Care Implementation

Discover personalized stress care solutions by tracking activities, interests, social interactions, and relaxation techniques.

2. Research

The BP Mind app aims to engage with health by understanding the relationship between stress and blood pressure, enhancing motivation for blood pressure management, and actively supporting improvements in overall health. While it is widely known that stress affects blood pressure, accurately understanding and managing this impact remains challenging.
BP Mind focuses on the fluctuations in blood pressure influenced by stress. By recording and visualizing blood pressure, stress levels, stress management practices, and symptoms, the app facilitates understanding of changes and patterns, helping to raise awareness of effective treatment and health management.

2-1. Competitors

Differentiate BP Mind from your competitors by understanding their strengths and weaknesses.

Features

I researched seven apps in the health category on April 30, 2023. While some apps offer memo functions, none specifically addresses stress management.

Design and content

On April 30, 2023, I researched 17 apps. The research focused on design trends and content based on search results from the following keywords: Google search for "popular health app" and the Apple App Store categories "Health & Fitness" and "Medical," particularly apps related to "Stress."

Findings

● Vector graphics has been used more frequently than photographs

● Blue is commonly used

● Compatibility with other Apps is offered

bp mind_research_ competitors_features

bp mind_research_ competitors_design and content

2-2. Research interview

User interviews were conducted to learn about users' health awareness and their needs for managing stress.

April 22, 2023– May 5, 2023

Since more than half of men and women over 50 are reported to develop high blood pressure, I chose people in their 50s as the main target audience. By inviting them to share personal stories based on their own experiences, I aimed to gather their honest thoughts and opinions.

Participants

13 individuals‍

‍● 6 men ● 7 women

60s: ●● ‍‍

50s: ●●●●●● ‍

40s: ●● ‍

‍30s: ●●●

Interview styles

Interview styles: In person, via video, and over the phone.

Research method

I prepared 10 questions divided into three categories: health concerns, stress, and stress care apps.

Insights from the results

Targeting individuals in the 50s

All participants in the 50s had a strong interest in health and were dealing with lifestyle diseases (e.g., hypertension).

Q. Do you have any concerns about your health?

Presenting the specific features and benefits of the App

While most showed interest in health apps that include stress care, they may not get engaged without specific feature proposals.

Q. Have you experienced any symptoms of stress, such as pressure, fatigue, depression, lack of energy, difficulty concentrating, trouble sleeping, or changes in appetite?

Set beneficial content: Visualization of how blood pressure changes and care methods

All participants believed that stress affects health, and they emphasized improving their lifestyles. 85% had experienced stress in their work or private life and were independently practicing stress management methods. 92% were interested in preventive medicine, indicating high expectations for the app in maintaining future health.

Q. Could you please provide three features you would be interested in using from the following six categories:

bp mind Interviews

bp mind_interview research results

2-3. UI design tailored to address age-related vision issues

In consideration of the target users' age-related eye conditions (such as presbyopia and cataracts), I explored how they perceive colors in the UI design.

Problems

● Decline of color vision or the ability to distinguish colors

● Vision impairment

● Decline in cognitive function

Findings

● Use high-color contrast

● Reader-friendly fonts with appropriate sizes

● Avoid troublesome actions and tasks

bp_mind_UI design considered for eye aging symptoms

3. Ideation

Using insights from the research interviews and reflecting on the traits and behavioral patterns of the target audience in their 50s, I developed personas to uncover user-centric needs.

3-1. Personas

The ideal user is a hypertensive individual in their 50s who experiences stress. To address common eye conditions affecting middle-aged and older adults, like cataracts and glaucoma, I plan to enhance accessibility by adding color to blood pressure readings. To keep users engaged and interested, I will provide regularly updated content, including a user community and expert health information.

3-2. Empathy map

Set BP Mind apart from the competitors by identifying their strengths and weaknesses.

3-3. Mood Boards

Understanding the actions and emotions that arise when using a product can help identify challenges and areas for improvement, enhance the user experience, and provide effective communication and support.

3-4. User Journey

FIndings

● Provide "sign-up options": Email sign-up and social media sign-up

● Sync data from blood pressure monitor to phone

● Create charts to help visualize changes.

3-5. User tasks • Information architecture • User flows

Understanding the user flow provides insight into the steps users take, revealing needs and opportunities to refine navigation.

Insights and goals

● Organize the blood pressure management page without overcrowding, using an effective UI to guide users to achieve their goals smoothly.

● Set search functionality, filter, and sort to find information quickly.

● Functional and appealing buttons and icons improve user experience by enhancing ease of use and clarity.

3-6. Style guide

To maintain brand consistency, coherence, and design quality.

Logo

The BP Mind logo is designed to reflect the connection between blood pressure and 'Mind,' with the 'M' in 'Mind' resembling a blood pressure graph. This represents the key themes of BP Mind: blood pressure management and mental care.

Color

I chose blue as the primary color for the BP Mind logo. Blue is commonly used in health-related contexts, symbolizing trust and reassurance while promoting a calming effect. It encourages stress reduction and highlights the importance of blood pressure management and mental care. I selected a high-contrast blue as the primary color and used the Material Theme Builder to choose secondary, accent, and other colors. The gradient used for the background color was created using Figma.

Text style

Based on the search results from the Readable font app, which included Roboto, and the fact that Roboto is utilized in Google's typography, I used Google's text style as a foundation while making adjustments to better suit the content of BP Mind. For instance, while Google's body large size is set at 16px, I increased it to 17px to accommodate the eye conditions of BP Mind's targeted middle-aged users.

‍

4. Wireframing

Wireframing involves organizing information, visualizing the design structure and layout, and reviewing user flow and navigation to assess overall usability.

4-1. Wireframing draft

I researched seven apps in the health category on April 30, 2023. While some apps offer memo functions, none specifically addresses stress management.

Onboarding

Overview and log in

Entry, edit and records of blood pressure, symptoms, stress and stress care

Data

Charts of blood pressure, symptoms, stress and stress care

Wellness

Expert Articles

Forum

Community among BP Mind users

Profile, favorites, settings, about, FAQs, contact us and terms of use

4-2. Process

I developed solutions to design an appropriate UI that organizes information, clarifies priorities, and guides users to operate correctly.

Calendar

● When displayed monthly, the space for blood pressure records is significantly reduced. Since blood pressure records take priority over the calendar, I changed the calendar to display every three weeks so that blood pressure records can be more visible.

● Blood pressure records are displayed below the dates in blue (normal) and red (high blood pressure), making changes easily recognizable at a glance.

● The font size for dates were increased to 20px to improve readability.

● If the calendar numbers are in dark colors, the most important blood pressure records won't stand out, making it difficult to see the priority of information. The calendar is styled in a subtle black to emphasize easy navigation to the blood pressure data. By lightening the tint for Saturdays and Sundays, I distinguished between weekdays and weekends.

BP record

● To create a layout focused on blood pressure records, only the blood pressure records are displayed by default, while other information is shown in a dropdown.

● Symptoms, stress, and stress care are differentiated by color and shape.

Data

● The graph incorporates a gradient for a more aesthetically pleasing representation of the data.

High fidelity wireframing