English
English
English

HealSmart: A healthcare educational app

HealSmart: A healthcare educational app

HealSmart: A healthcare educational app

HealSmart is a digital application combines evidence-based opioid misuse prevention strategies with positive psychology to enhance patient satisfaction and recovery throughout pre-surgical and post-surgical care.

My Contributions

As a UX Designer and researcher, I collaborated with three graduate students from Pratt Institute. I was fully involved in the complete user research process and conducted 3 user interviews. Hi-fi Prototype visual and interaction design, and finalizing design system.


Research: Questionnaire, User Interview, Competitive Analysis, Card Sorting, Tree Testing, Information Architecture, and Usability Testing.

Design: Wireframing, Prototyping, Design system, Interaction & Visual Design.

Duration

Duration

4 months, 2023.09

Client

Client

The Behavioral Health and Wellness Group

Tools

Tools

Miro /Figma /llustrator /Photoshop 

Team:

Team:

Xinru, Nishi, Sayali, Roey

About

About

About

Developed by the Behavioral Health and Wellness Group, HealSmart is a digital tool to combat opioid misuse in response to the opioid epidemic and COVID-19 pandemic. This innovative program combines evidence-based prevention strategies with positive psychology to enhance pre-surgical and post-surgical care, improving patient satisfaction and recovery. HealSmart aims to reduce surgical complications, addiction risk, and healthcare costs while empowering patients with essential pain management skills and knowledge, decreasing reliance on healthcare providers during recovery.

Goals

Goals

Goals

  • Comprehensive Digital Content Completion:

    Finalize comprehensive, user-friendly digital content for HealSmart.


  • HealSmart Mobile App Development:

    Develop an accessible, intuitive, and engaging HealSmart mobile app.


  • Evidence-Based Prevention Strategies:

    Implement evidence-based opioid prevention strategies with positive psychology and self-management skills.


  • Stigma and Risk Reduction:

    Use digital learning to reduce stigma, mitigate prescription pill misuse risk, and enhance recovery outcomes.

Exploratory Research

- Ecosystem map - User interviews with doctors and patients - Literature review - Competitive analysis

Exploratory Research

- Ecosystem map - User interviews with doctors and patients - Literature review - Competitive analysis

Exploratory Research

- Ecosystem map - User interviews with doctors and patients - Literature review - Competitive analysis

Design Schematics

- Persona - Information Architecture - Key workflows - Wireframes

Design Schematics

- Persona - Information Architecture - Key workflows - Wireframes

Design Schematics

- Persona - Information Architecture - Key workflows - Wireframes

Evaluative Research

- Tree-testing - Client feedback - Expert feedback - User testing

Evaluative Research

- Tree-testing - Client feedback - Expert feedback - User testing

Evaluative Research

- Tree-testing - Client feedback - Expert feedback - User testing

Visual Design

- Style guide - Component library - High fidelity screens - Interactive prototype

Visual Design

- Style guide - Component library - High fidelity screens - Interactive prototype

Visual Design

- Style guide - Component library - High fidelity screens - Interactive prototype

Exploratory Research

Exploratory Research

Exploratory Research

Exploratory research is imperative for tailoring the tool effectively to its users. By understanding the unique needs, behaviors, and challenges of those facing opioid misuse—especially in the context of the opioid epidemic and COVID-19 pandemic—this research will ensure Heal Smart's features and strategies resonate deeply with its target audience.

Key Insights

Patients prioritize a speedy recovery with minimal pain.

01

Patients prioritize a speedy recovery with minimal pain.

01

Patients prioritize a speedy recovery with minimal pain.

01

They value an interface that helps them track medications and monitor their effectiveness.

02

They value an interface that helps them track medications and monitor their effectiveness.

02

They value an interface that helps them track medications and monitor their effectiveness.

02

An effective interface aids in mental and physical preparation for surgery and recovery.

03

An effective interface aids in mental and physical preparation for surgery and recovery.

03

An effective interface aids in mental and physical preparation for surgery and recovery.

03

Given that many hip and knee surgery patients are 45+ years old, accessibility and ease of use are crucial.

04

Given that many hip and knee surgery patients are 45+ years old, accessibility and ease of use are crucial.

04

Given that many hip and knee surgery patients are 45+ years old, accessibility and ease of use are crucial.

04

Eco-system Map

Eco-system Map

Eco-system Map

We created a detailed eco-system map of all the stakeholders involved in the project. This gave a good sense of how different parties would interact with each other as well as what data and information was relevant to our target user group. 


  • Patients need to receive accurate information about pain medication before their surgery.


  • Managing pain can be achieved through a combination of medication and other tools with the help of healthcare experts.


  • HealSmart’s team has extensive experience and expertise on the subject of opioid addiction that can be leveraged.

We created a detailed eco-system map of all the stakeholders involved in the project. This gave a good sense of how different parties would interact with each other as well as what data and information was relevant to our target user group. 

  • Patients need to receive accurate information about pain medication before their surgery.

  • Managing pain can be achieved through a combination of medication and other tools with the help of healthcare experts.

  • HealSmart’s team has extensive experience and expertise on the subject of opioid addiction that can be leveraged.

We created a detailed eco-system map of all the stakeholders involved in the project. This gave a good sense of how different parties would interact with each other as well as what data and information was relevant to our target user group. 

  • Patients need to receive accurate information about pain medication before their surgery.

  • Managing pain can be achieved through a combination of medication and other tools with the help of healthcare experts.

  • HealSmart’s team has extensive experience and expertise on the subject of opioid addiction that can be leveraged.

Key quotes from qualitative interviews

Key quotes from qualitative interviews

Key quotes from qualitative interviews

  • Patient Demographics: Hip and knee replacement patients are usually over 45, emphasizing the need for accessible care.

  • Conversation for Support: In addition to doctor consultations, patients benefit from discussions with peers who have experienced similar surgeries.

  • Unique Recovery Needs: Each patient's recovery journey is distinct, with varied support and assistance requirements.

  • Following Doctor's Instructions: Patients are particularly attentive to doctors’ advice on pain management and opioid use.

We created a detailed eco-system map of all the stakeholders involved in the project. This gave a good sense of how different parties would interact with each other as well as what data and information was relevant to our target user group. 

  • Patients need to receive accurate information about pain medication before their surgery.

  • Managing pain can be achieved through a combination of medication and other tools with the help of healthcare experts.

  • HealSmart’s team has extensive experience and expertise on the subject of opioid addiction that can be leveraged.

We created a detailed eco-system map of all the stakeholders involved in the project. This gave a good sense of how different parties would interact with each other as well as what data and information was relevant to our target user group. 

  • Patients need to receive accurate information about pain medication before their surgery.

  • Managing pain can be achieved through a combination of medication and other tools with the help of healthcare experts.

  • HealSmart’s team has extensive experience and expertise on the subject of opioid addiction that can be leveraged.

Design Principles

Design Principles

Design Principles

Personalization

Personalization

Each patient has a unique journey to recovery, which makes having a personalized experience for the user an essential part.

Each patient has a unique journey to recovery, which makes having a personalized experience for the user an essential part.

Engagement

Engagement

Learning about pain management in the app is engaging and informative to reduce the cognitive load in the user.

Learning about pain management in the app is engaging and informative to reduce the cognitive load in the user.

Accessibility

Accessibility

Considering that most of the users are 45+, it’s crucial to have a simple and intuitive interface that adheres to WCAG accessibility guidelines.

Considering that most of the users are 45+, it’s crucial to have a simple and intuitive interface that adheres to WCAG accessibility guidelines.

Data Privacy and Security

Data Privacy and Security

As the app deals with sensitive healthcare information, prioritizing

As the app deals with sensitive healthcare information, prioritizing

Stigma Reduction

Stigma Reduction

As the topic of opioid addiction is a bit sensitive, using non-judgmental language and emphasizing that this app is a wellness education app is crucial.

As the topic of opioid addiction is a bit sensitive, using non-judgmental language and emphasizing that this app is a wellness education app is crucial.

Design Schematics

Design Schematics

Design Schematics

Persona

Persona

Persona

After analysing the data we collected through our qualitative interviews with both doctors and patients, we created a persona to match the qualities of our target users. This persona then helped us create our designs and helped us stay focussed on the needs of the user.

Product Architecture

Product Architecture

Product Architecture

The Product Architecture outlines our app’s components and interactions, ensuring it meets patients’ objectives and adapts to changes. It helps users find non-pill pain management methods, educates them on medication addiction, and provides tools for better recovery.

Information Architecture

Information Architecture

Information Architecture

As a majority of our user group was slightly older (50+ years), we head to ensure that our information architecture was simple and easy to understand.


Goals:

  1. Educate users and set expectations about their surgery.

  2. Help patients manage their pain level through alternate activities than medication.

Wireframe

Wireframe

Wireframe

Evaluative Research

Iteration

Iteration

Iteration

After having a design-decision meeting with our client, we made a few changes to our wireframes.

Visual Design

Visual Design

Visual Design

Style Guide

Style Guide

Style Guide

  • Fonts:

    Titles: Merriweather font adds sophistication and emphasis to key elements.

    Content: Lato font for its clarity and readability, ensuring seamless communication.


  • Colors:

    Theme Color: Calming and trustworthy green was adopted as the theme color for the healthcare app.
    Logo: Green is prominently featured in the company logo, ensuring a cohesive brand identity.


High Fidelity Prototype

High Fidelity Prototype

High Fidelity Prototype

We meticulously crafted all user flows within the app, ensuring a seamless and intuitive experience. This includes:


  • Sign-In Process


  • HealSmart Program:

    Pre-surgical: Medication Storage & Disposal

    Post-surgical aspects: Check-in with patient, Long-term recovery and healing


  • ComfortCare Kit : Medication reminder, Breathing exercise, Meditation, Gratitude journal, Music therapy, Aromatherapy


We meticulously crafted all user flows within the app, ensuring a seamless and intuitive experience. This includes:


  • Sign-In Process


  • HealSmart Program:

    Pre-surgical: Medication Storage & Disposal

    Post-surgical aspects: Check-in with patient, Long-term recovery and healing


  • ComfortCare Kit : Medication reminder, Breathing exercise, Meditation, Gratitude journal, Music therapy, Aromatherapy


We meticulously crafted all user flows within the app, ensuring a seamless and intuitive experience. This includes:


  • Sign-In Process


  • HealSmart Program:

    Pre-surgical: Medication Storage & Disposal

    Post-surgical aspects: Check-in with patient, Long-term recovery and healing


  • ComfortCare Kit : Medication reminder, Breathing exercise, Meditation, Gratitude journal, Music therapy, Aromatherapy


Sign-up

Sign-up

Sign-up

  • Diverse Login Options:

    Provide multiple login methods (Google, Facebook, Apple ID) for easy and secure access.


  • Efficient Recovery Tracking:

    Collect detailed surgery information to tailor and optimize patient recovery plans.

Homepage & Pre-surgical

Homepage & Pre-surgical

Homepage & Pre-surgical

  • HealSmart Progress Tracking:

    Provide easy access to program tracking and shortcuts to ComfortCare Kit functions for a seamless user experience.


  • Module Completion Indicator:

    Use check marks to indicate completed modules, giving patients a clear sense of accomplishment.


  • Standardized Pre-Surgical Modules:

    Use the ‘Medication Storage & Disposal’ section as a template for all pre-surgical modules for consistency and clarity.

Post-surgical

Post-surgical

Post-surgical

  • Pain Level and Emotional Sharing:

    Patients can share pain levels and emotional updates with their contacts, fostering support.


  • Customizable Recovery Goals:

    Allow patients to set and track personalized recovery objectives tailored to their needs.

ComfortCare Kit

ComfortCare Kit

ComfortCare Kit

  • Gratitude Journal Calendar:

    Patients can review past entries via a calendar, enhancing reflection on positive moments.


  • Medication Reminder:

    Integrate medication tracking with timely reminders for consistent adherence.


  • Flexible Music Therapy :

    Allow users to choose their preferred platform for music playback in the therapy module.

Reflections

Reflections

Reflections

We successfully presented the analysis and prototype to the client, incorporating all specified functionalities. Our team delivered a comprehensive mobile product mock-up, evolving from concept to completion, with the client expressing high satisfaction with our design achievements.

We successfully presented the analysis and prototype to the client, incorporating all specified functionalities. Our team delivered a comprehensive mobile product mock-up, evolving from concept to completion, with the client expressing high satisfaction with our design achievements.

"Your work has far exceeded our expectations! We are thoroughly impressed by the depth of insights and the quality of the prototypes you've developed."

"Your work has far exceeded our expectations! We are thoroughly impressed by the depth of insights and the quality of the prototypes you've developed."

"Your work has far exceeded our expectations! We are thoroughly impressed by the depth of insights and the quality of the prototypes you've developed."

Takeways

Takeways

Takeways

The following learnings stood out the most to me as part of this project:


  • Effective Project Timeline Planning: Strategic planning ensured flexibility for executing all project steps effectively.

  • Importance of Regular Communication: Open communication with team members and the client kept the project on track and aligned with objectives.

  • Advantages of Component-Based Design Systems: Developing components and a design system accelerated the creation of designs and prototypes, streamlining workflow.

The following learnings stood out the most to me as part of this project:


  • Effective Project Timeline Planning: Strategic planning ensured flexibility for executing all project steps effectively.

  • Importance of Regular Communication: Open communication with team members and the client kept the project on track and aligned with objectives.

  • Advantages of Component-Based Design Systems: Developing components and a design system accelerated the creation of designs and prototypes, streamlining workflow.

Get in Touch

© 2024 Designed by Xinru Wen.

Get in Touch

© 2024 Designed by Xinru Wen.