Digital Healthcare

Registration process that balances creating excitement while setting up expectations for the program.

by

OBJECTIVE

Redesign the registration process to increase onboarding completion rates from 45% to 80%.

ROLE

UI/UX designer for the new version of web registration:

  • Worked closely with the product manager to identify problems with the current flow and new requirements
  • Explored multiple concepts ranging from low-effort to high-effort and evaluated each direction with the team
  • Defined the design principles and a point of view
  • Designed the full flow and communicated design specs and logics with the software engineer
  • Iterated the design in the next revisions

WHY REDESIGN?

With the first version of the web registration design, the intent was to make the process as easy and effortless as possible. However, after the launch of the first few pilots, we noticed that there’s a good number of sign ups for the program, but only less than half of those users complete the onboarding process in the app. That was a big surprise – why are all these people dropping off between registration and the first couple of steps of using the app?

HYPOTHESIS

We collected data from user behavior in Mixpanel, conversations with customer support, as well as qualitative research with those who had gone through the program to identify opportunities for the improvement strategy.

The current web registration process promotes mindless form-filling, resulting in people not knowing what exactly they had signed up for.

Some users are coming into registration directly from campaign emails and don't ever see the website to get more information.

We are accepting everyone in the program, although some users may not be aligned with the demands of the program and therefore drop off.

There's a sense of urgency in having a limited number of seats for registration, but no urgency around the next steps, enabling procrastination.

If we create moments of pause and engagement, users will have a higher chance of understanding what they are signing up for.​

By adding key messages from the website, we make sure that users who don't view the website are not missing out.

If users are clear about what the program is asking of them, they are more likely to participate once they complete registration.

The sooner people onboard, the more likely they are to stick with it, especially if they are committing to starting right away.

DESIGN PRINCIPLES

With the requirements and hypothesis, the next step for me was to create a set of design principles to set the tone and behavior for the flow and functionalities for each step of the registration process.

MEMORABLE MOMENTS

Show users what the program is about (rather than just tell) by creating memorable moments in the process of registration.

EXPECTATIONS

Be explicit about setting up expectations about the program and how it works, to make sure that only those who are aligned sign up.

COMMITMENT

Make it clear that they're only committing to a week in the program. Just give it a try for a week - nothing to be overwhelmed about.

CALL TO ACTION

Communicate what's next and make the call to action clear - download the app and start the program while waiting for the sensor to arrive.

ONBOARDING FLOW

In order to think about the registration flow, I mapped out a user’s experience through the entire journey, starting from marketing materials and program communication, to web registration, and the next touchpoints (including re-engagement campaigns). I wanted to make sure that we are porting the right communication from the earlier stages, and setting up the right expectations for the next steps in the journey.

Previous slide
Next slide

MEMORABLE MOMENTS

It’s easier to understand and remember facts when they are in context, personalized and related to one’s situation. Our program is all about “learning about yourself” and I wanted to bring that to the registration process by calculating people’s answers based on the questions that we ask them in registration –we already do the calculations, however only show them the answers in the app, out of context. It’s easy to surface the same content upfront to create excitement with a lower amount of engineering effort.

BEFORE: Questionnaire without explanation

AFTER: Questionnaire in context, followed by relevant, insightful calculations as a teaser to what's to come in the program

Previous slide
Next slide

EXPECTATION SETTING & COMMITMENT

EXPLORATION

In the first version of the web registration, there was no element of expectation setting. I explored 3 different concepts to introduce “the program” during the registration process, taking into consideration level of engineering effort. 

Concept #1: Small effort

Concept #2: Medium effort

Concept #3: Large effort

FINAL DESIGN

The final outcome was a quiz-like format that used a card to explain each aspect of the program that we wanted to highlight. It’s not really a quiz, because we don’t want anyone to feel intimated by the questions. It’s more intended to cause a “pause” and chunk up the information as part of the question as well as the chosen answers.

Previous
Next

CALL TO ACTION

The previous web registration didn’t mention to users what they should be doing next, and relied solely on the following emails to communicate what’s next. I wanted to be as explicit as possible about the fact that “just because you’re done with registration, doesn’t mean you’re all done yet.” That is reflected through the messaging as well as the timeline of the next few days. The primary call to action is to download the app, and the secondary message is to get a sense for when the package will arrive.

OUTCOMES

After spending 3 weeks scoping, designing, building, and debugging, we released an MVP of the redesigned flow. We measured the results and saw that today, 75% of users are completing the onboarding (compared with the original 45%). As we learn more, we keep iterating in small steps to make sure that we can get to at least 80% in the coming sprints ahead.

Breath sensor device measuring carbon monoxide (CO) levels in the body

by

OBJECTIVE

Combine learnings (from the experience with the first generation of the breath sensor) with strategic imperatives (for the company in the future), to create the next generation of the breath sensor, resulting in reduced cost of goods and increased user engagement.

ROLE

Led the overall design effort by defining a point of view for the form-factor, visual and haptic interactions, and the first time user experience of the device. 

  • Collaborated with the R&D and Product teams throughout the design phase and facilitated brainstorm sessions
  • Worked closely with Industrial Designer, UI Designer, and Brand Designer, bringing together design components 
  • Organized and conducted user research sessions to gain insights throughout the iterative design phase 
  • Defined design principles to inform the form-factor, mapped out the user flows and journey

PROCESS

DESIGN RESEARCH: WHAT ARE WE SOLVING FOR?

The design process started by conducting hours of interviews with users of our program who had experienced interacting with the breath sensor. Key insights from those experiences were gathered to inform the decision-making and scoping of the next generation of the product.

The sensor acts as a wake-up call, making the impact of damage from smoking real and tangible for the first time in a smoker's life.

"In my mind, I compared it to stepping on the scale."

CO readings provide a measurable means, enabling people to challenge themselves to do better.

"I hate losing, even if it's just to myself. And you know, red is bad, green is good... I didn't ever want to see red. It was a challenge with myself. Rather than other people trying to hold me accountable for my actions, that made me hold myself accountable, with actual physical results that I could see."

The sensor cues, "I have a problem" and people don't know how to talk about it with others.

"A lot of people thought it was a breathalyzer, especially using it in my car, people thought I was using it to operate my vehicle even though it wasn't attached to anything! I couldn't do it in public without feeling either judges or that I was annoying people around me."

People have to pause their lives to give a breath sample, and the relevance of sampling changes over the course of their journey.

"I thought I was supposed to do it every hour, but I didn't manage to because I'd lose track of time or forget the sensor somewhere."

POINT OF VIEW

Design and develop the next iteration of the CO breath sensor, focused on a form factor that will fit into people's lives, reduce stigma, and encourage ease and desirability of use.

ID EXPLORATION: ITERATIONS THROUGH RAPID PROTOTYPING

We compiled 100+ moodboard examples, focusing on shapes, textures, colors, contours, materials, wearability, portability, affordances, screens, buttons, and more. Two new business requirements were explored by the Industrial Designer: the integration of the mouthpiece to the body of the device, and an addition of a screen to view breath sample results without having to refer to the app.

Having a 3D printer on site, we were able to immediately print forms once there was a new version of the sensor. We started creating stickers in different sizes and shapes to prototype the screen and button placements on the device. The R&D team connected the prototypes to an Arduino to test the screen interactions a-la “wizard of oz.”

USER TESTING: FEEDBACK & CO-CREATION SESSIONS

Once we had some renderings and 3D models ready, I started organizing regular user feedback sessions to understand what people’s experiences were using the sensor. Some sessions were informal, going around the office and asking people to hold the device in their hands and try to blow into it. Other times, a more formal session was put together, inviting users who had previously used the device, and recruiting newbies who had not seen the original device before to come and give feedback on the look and feel. 

We wanted to know: What does the sensor remind people of? Can they use the screen while doing a breath test? Where would they store it? How does it feel holding and blowing into the device? 

BIGGEST SURPRISES

Before testing, our hypothesis was that a "precious looking sensor" would break the stigma and help people want to show off their device and talk about the program with others. We soon realized that people expect the device to be utilitarian, simple, and to the point.

Hygiene came up as a huge issue that we had not considered before. Not only was there a concern for the mouthpiece to get dirty and potentially collect lint while being stored, another issue was the worry of having gunk from exhaling to stick to the interior part of the sensor over time. There had to be an easy way to clean the mouthpiece if it were to be connected to the body.

KEY TAKEAWAYS

We wanted to use the screen to provide guidance on "time left" as people blow into the device, but weren't sure if it was easy to see it. The feedback was clear --as long as there was a big contrast of color, the progress bar was visible, and using vibrations helped with expectation setting of when to start and when to end exhaling.

There was a desire for a consumer health product like a FitBit, or even a trendy e-cig, rather than a medical/clinical product like a breathalyzer or asthma inhaler --size was a huge factor in making that distinction, followed by the choice of material.

DESIGN STRATEGY: THE FOUR PILLARS OF DESIGN

The rapid prototyping and testing phase provided lots of learnings that were synthesized to create a framework of design for this project. This helped make our intentions clear, and the decision-making for the team more objective rather than subjective.

USABILITY & COMFORT

Hygiene | Fit | Ergonomics
The device sits well between anyone’s lips (good seal) • Easy to hold without fear of dropping or covering up device features • Easy to clean and keep clean • People know exactly where and how the device should be held

EFFECTIVENESS

Comprehension | Intuitiveness | Pocketability | Portability
Provides just enough direction on what to do • Communicates a successful breath sample and results • Helps people blow the right amount of air • Fits easily in and out of front and back pockets • Easy to store and retrieve from a bag/purse/carrying case

ENGAGEMENT

Stigma Reduction | Storytelling | Compliance | Discretion
Creates a desirable experience, overall • People are able to use it wherever, whenever • Allows people to show vs tell what they are experiencing • Tactile and audio features add additional delight to the experience

BRAND

Consumer-Centric | Expert | High-Tech
Strikes a balance between credible, trust-worthy and too clinical • Belongs to the family of Pivot products

CONCEPT FINALIZATION: EVALUATION & ALIGNMENT ON THE FORM-FACTOR

The final form-factor was chosen after a detailed evaluation of all four top models. A hybrid was selected that had a clear call to action (distinct mouthpiece), was easy to store and clean (hygiene, pocketability & portability), and looked consumer-friendly (rather than clinical).

UX EXPLORATION: WHAT DOES THE JOURNEY FEEL LIKE?

I coordinated multiple brainstorm sessions, going over different flow paths, looking closely at error states, connectivity to the phone (pairing, connecting, syncing), and the first time use (with a lens toward human factors testing). 

USER FLOWS & FEATURES MAPPING

Through mapping out the different stages in the “sensing journey,” differences in the features and functionalities from the Gen 1 sensor to the Gen 2 model were identified and discussed with the team.

MOMENTS OF ACKNOWLEDGEMENT

Sketching out ways to personalize the sensor, such as showing user’s name, greeting them when they’re back, and celebrating milestones such as the lowest CO level, first green CO reading, and streaks. 

By creating these moments of elevation, users are celebrated for their small wins at a time when they need a lot of encouragement.

UI EXPLORATION: WHAT’S THE LOOK AND FEEL FOR THE SCREEN?

Working closely with the UI Designer, we evaluated different types of visualizations that could work with the resolution of the screen and its processing speed and identified moments were animations could enhance the user experience. 

NEXT STEPS

The design component for the next generation of the sensor is complete and the explorations in this phase enabled the R&D team to be involved in the decision-making process before having to incorporate the internal components and getting into the manufacturing phase. 

Daily check-in experience to provide self-reflection and an extra boost of motivation

by

OBJECTIVE

Introduce a new feature to the app that acts as a “daily check-in” for smokers who have recently quit, to indicate whether or not they have experienced a relapse. The captured information helps health coaches reach out to those in need in a timely manner, helping them stay on track and as a result, increasing our program’s efficacy rates.

ROLE

UI/UX design and user research for creating a new feature in an existing mobile application:

  • Worked closely with product manager and behavior scientist to define the types of information that need to be captured for the coaches
  • Explored different concepts and tested them with smokers and former smokers to identify what matters to them the most and prioritize based on their quitting experiences
  • Created a logic matrix to personalize the experience and add variation to the every day task of checking in
  • Communicated with the iOS and Android engineers on a daily basis and brainstormed new ways to achieve the intention without creating a high engineering lift

FINAL DESIGN

Enabling health coaches to have timely, personalized, and meaningful interactions with their users.

by

OBJECTIVE

Create the next version of the coaching portal, focusing on increasing the coaching team’s efficiency, by cutting down their time spent on touchpoints with their users, resulting in a reduction of costs for the company.

ROLE

UI/UX designer and researcher on a core team with a dedicated product manager, health coach, and a full stack engineer:

  • Worked closely with the product manager to define requirements by intersecting coaching needs and company goals
  • Consulted with the health coach on a regular basis to validate design directions and set up coach feedback sessions to gain an understanding of underlying needs
  • Collaborated with the full stack engineer to identify feasible paths to achieve design intentions
  • Designed multiple versions of the portal, laying out feature releases on a roadmap, adhering to emerging design principles