MOBILE APP

AI-driven B2C health manager that increased sales 100% and pipeline conversion 300%.

Industries: Healthcare, Wellness

Platforms: iOS, Android

Competencies: Project and team management, research, product design, UX and UI design, visual design, Agile software development

Deliverables: Competitive analysis, sketches, wireframes, visual concepts, prototypes, style guide

Team: Sr. UX Designer, CTO, three offshore Developers

Full project details are protected under the terms of an NDA.

PROBLEM

For the users: Medical record information is scattered across multiple providers and clinics. Consumers need a way to centralize all their records, share relevant information with their providers and access personalized recommendations to improve their quality of life.

For the business: As an early-stage startup, the company needed an initial product aligned to their goals. They wanted to demonstrate the power of their healthcare AI to potential clients in a way that was visual, interactive and relatable.

COMPANY

HealthPointe Solutions is a technology startup that improves the health and well-being of consumers by using the power of AI to modernize practitioner and consumer interactions.

CHALLENGES

Limited resources for user research
Switching from proto.io to Axure prototyping tools midstream because the former did not provide enough stability
New offshore front-end development team required extra communication and collaboration

TARGET USERS

There were two very different user groups to focus on for this project.

Consumers who needed a central place to manage their health and wellness across providers and over time. They would be offered access to the app by their medical provider or employer.
HealthPointe's COO, CTO and sales team needed an initial product that not only aligned to their business needs, but also demonstrated the company's capabilities in healthcare AI in a concrete and accessible way.

With zero budget and limited time for user research, I relied heavily on my colleagues with extensive healthcare experience. I also did informal research with friends and my own healthcare team. I used what I learned to define the initial direction and features. We plan to beta test the app with initial clients and perform more formal research exercises.

PROCESS

I started this project as a contractor working up to 10 hours/week for the first seven months. After I became a full-time employee and hired a senior UX designer, we started dedicating 25% of our time to it.

Flow chart of my design process: 3. Sketching, 4. Wireframing and 5. Creating visual concepts

Flow chart of my design process: 6. Prototyping

Flow chart of my design process: 7. Supervising advanced prototyping and 8. Managing front-end devs.

1. ANALYZING COMPETITORS

I reviewed seven competitive apps to learn about health chat and scheduling best practices and opportunities.

Key takeaways were that the best apps made it easy for consumers to succeed in their tasks and that there were opportunities to integrate differentiating features using HealthPointe technology.

Sample of research findings:

Best Practices

Scheduling - Offer multi-dimensional search
Chat - Use buttons instead of free text to make simple answering easy

Opportunities for Differentiation

Scheduling - Provide a price estimate for self-pay and insurance
Chat - Integrate medical history and data to personalize

2. DEFINING REQUIREMENTS

I gathered information from internal stakeholders and research to define anticipated requirements, create a shared team understanding and provide direction for a flexible information architecture.

Sample of requirements for consumers:

Learn about what the AI can help with
Chat with the AI and take quick surveys to improve health recommendations
Find providers
Schedule appointments and wellness classes
Attend telehealth appointments

Enter and update health information (medications, conditions, etc.)
Learn about ways to improve your health
Connect external devices
Get reminders about healthy activities
Purchase health related items

3. SKETCHING

I started with pencil sketches of the main sections to keep creative ideas flowing. This also enabled quick and iterative feedback from the remote team.

Profile

(Later named Health)

This sample sketch shows the section of the app that holds all the consumer’s medical information.

I incorporated progressive disclosure to keep this large and complex section from overwhelming the consumer.

4. WIREFRAMING

I initially built black and white wireframes so I could focus on the layout and organization without the distraction of visual design decisions.

Home

This is where the consumer can start a chat with the AI, view a summary of actions or things that need attention and explore recommended resources.

Profile
(Later named Health)

When the app is connected to the consumer’s medical record it is updated automatically.

The consumer can also add additional information such as goals and interests.

5. CREATING VISUAL CONCEPTS

I created six design options for review. After a few rounds of collaborative feedback, I combined elements from several to set the app's visual direction. Here are three samples:

6. PROTOTYPING

I built a prototype with over 100 screens in proto.io. It included all the required functionality for both consumers and our internal sales team. Here are some sample screens:

Home

Where the consumer first signs in, the AI offers personalized suggestions to start chats and demonstrate capabilities.

Health

After the first sign in, personalized suggestions can be found in the drawer above the global navigation. The AI encourages the consumer to add more information and shows a progress bar at the top of the section.

7. SUPERVISING ADVANCED PROTOTYPING

I supervised Daniel Soltis, senior UX designer, in creating a new prototype with Axure, a more stable platform for complex interactions. We collaborated to add features, refine visual design, start a style guide and pattern library.

Sample of improvements:

New COVID-19 and goal tracking features
Adjusted color for appropriate contrast and to match more recently designed apps
Created and integrated custom icons
Defined touch targets and updated sizes for accessibility
Adjusted screen layouts to accommodate both iOS and Android devices

8. MANAGING FRONT-END DEVELOPMENT

Daniel and I managed a team of offshore front-end developers with weekly meetings, feedback and testing on both iOS and Android.

Screen capture showing issues tracked in GitLab

This screen capture shows five (out of 133) Eva Health issues we managed in GitLab.

RESULTS

"Zahra has aligned consumer and business needs to create a simple yet intuitive design for Eva Health, which will lead to adoption and continuous use. She is an extremely talented user experience designer. "

Mark Anderson, President and COO

The Eva Health mobile app has been developed for both iOS and Android, QA tested on iOS and is ready for deployment and beta testing with the company's next client. It was instrumental in increasing sales contracts by 100%.

Before the interactive prototype was available, the sales team were having problems moving prospects to the next stage in the pipeline. Of 15 presentations, only about 30% got to the product demo phase and only 20% of those were moving to the proposal phase. After the design was completed, the number of prospects moving to the demo phase and beyond increased 300%.