SisterLove - Mobile Health Services App prototype on Figma

A discreet and user-friendly platform for accessing HIV, STI, and reproductive health services.

Mobile App Prototype of Figma for Health Services

Inclusive and accessible mobile application design on Figma for comprehensive sexual and reproductive health services platform

Figma

Prototyping

UX/UI Design

Client

CDC & Sisterlove, INC

Date

2023

Role

Lead UX/UI Designer

The Design Process

Understanding The Challenge

Research

Interviews
Empathy Maps
User Personas
Competitive Analysis
Accessibility Compliance

Ideation & Lo-fi Design

Paper Sketching
User Flows
Information Architecture
Paper Wireframes & Testing

Hi-fi Design

Visual Design
Interaction Design
Motion Design

Evaluation & Iteration

Figma Prototype
Collaboration Boards
Testing
Last UI Changes

Documentation

Bussiness Challenge

To create a discreet, user-friendly mobile platform that addresses the anxiety and discomfort users face when accessing HIV, STI, and reproductive health services.

Pain Points

- Anxiety over confidentiality and judgment in traditional healthcare settings.
‍
- Difficulty tracking personal health due to multiple data sources.
- Intimidation by medical jargon and technical language.
‍
- Mistrust in generative AI for sensitive health topics.

Goals & Objectives

- Develop a discreet, user-friendly mobile platform to access HIV, STI, and reproductive health services.
‍
- Create intuitive tools for tracking personal health metrics and scheduling consultations.
‍
-Design an inclusive interface that offers easy access to health information and a generative-AI personalized health assistant chatbot.

information architecture

Data Audit and Content Inventory: Conducted a thorough audit of existing health data sources and created an inventory of content to be included in the app.

‍Data Hierarchy and Organization: Structured data in a hierarchical manner to enhance clarity and accessibility, ensuring that key information is easily accessible.
‍
‍Wireframes and Low-Fidelity Prototypes: Created paper wireframes and low-fidelity prototypes to visualize the layout and user flow before progressing to higher fidelity designs.

Visual Design

Data Visualization Techniques Chosen: Bar charts, line charts, pie charts, heatmaps, and interactive maps to represent various data metrics.
‍
Color Palette and Typography: Opted for a calming color palette to promote trust and comfort. Used typography that balances readability with modern aesthetic appeal.
‍
Dashboard Layout Options: Explored multiple dashboard layout options, ultimately choosing one that offers clean navigation and a focus on key functionalities like scheduling and personal health records.
‍
‍High-Fidelity Mockups: Developed high-fidelity mockups to represent the final design, ensuring all visual elements align with user needs and project goals.

Parameters

Usability Study

Study Type

Unmoderated usability study

Location

United States, Remote

Participants

5 Participants

Lenght

20 to 30 min

Key Findings About Users and Their Needs

Users needed a simplified way to track the distribution and impact of HIV self-test kits, with clear visualizations of key metrics and demographics.

User Personas

Based on the research, we created personas like Aasha, a woman of color concerned about the confidentiality of her health data, and who seeks a trustworthy, straightforward platform for managing her reproductive health.

User Journey Maps

Developed journey maps for users like Aasha to identify pain points and improvement opportunities, particularly focusing on interactions with health services through the app.

User Journey Maps & User Flow

Results & Impact

Metrics and KPIs

Increased user engagement, improved data interpretation accuracy, and quicker decision-making capabilities.

User Feedback

Positive feedback from users on the dashboard’s ease of use and clarity.

Business Outcomes

Enhanced ability to track and report on campaign progress, leading to better-informed decisions and improved campaign strategies.

Final Solutions

Overview of Final Design: The final dashboard design is an inclusive and accessible mobile app focused on sexual and reproductive health services. It features a clean, intuitive interface with easy navigation and access to vital functionalities.

Design System: I have designed a full assets library, including typographic styles, buttons, cards and windows.

Implementation and Rollout: The final solution was implemented and rolled out to stakeholders, accompanied by comprehensive documentation and onboarding sessions to ensure smooth adoption.

Lessons Learned

Challenges Faced and How They Were Overcome:

- Adapting generative AI for sensitive health topics was challenging; we overcame this by focusing on empathy and user comfort in the design.

- Ensuring accessibility required iterative testing and adjustments for optimal readability and navigation.

Key Takeaways:

- The importance of empathy and confidentiality in health service design.

- The value of iterative testing and user feedback in refining the user experience.

- The need for accessible design elements to cater to a broad user base.

Future Improvements and Next Steps:

- Continue refining the AI assistant for better personalized interactions.

- Explore additional features to track more health metrics.

- Conduct ongoing usability tests to keep enhancing the user experience.

Conclusion

Project Achievements

The project successfully addressed key user pain points by creating a confidential, user-friendly platform for accessing health services. It demonstrated strong skills in user research, UI design, accessibility, and iterative development using Figma.

What I Learned

Through this project, I honed my skills in user research and accessibility, and deepened my expertise in wireframing and prototyping on Figma. This experience solidified my ability to develop user-centered and inclusive design solutions.