"Program builder" experience design

for Ravenhealth

A feature that solved one of the highest priority problems for behavior clinicians(users) and set up the foundation for other critical features of the Ravenhealth patient behavior data collection software

The app was released on App store and Google Play in 2022

2021 Apr @Kin + Carta

Project Initiative

Ravenhealth is a startup health-tech company. They reached out to us to build their very first product with the same name - Ravenhealth- from scratch. The software can help ABA(Applied Behavior Analysis) clinics collect patient behavior data and manage clinicians’ daily tasks.

ABA clinics are for kids with autism. Technicians collect patient’s behavior data like “in 10 times how many times the kids can identify an object correctly” to decide if the patient’s symptoms get improved and what the next step of treatment is.

The current traditional way of data collection is using the data sheet on paper, but it is inefficient because technicians can’t focus on patients while writing down patients' every response.

The Ask

Ravenhealth asked us to build software (tablet for MVP) that can digitize the data collection process so that users could document patients' responses by simply clicking on the button on the screen.

For this case study, I will focus on one of the critical features of Ravenhealth I designed - Program Builder.

Discovery and Feature prioritization

Why Program Builder?

Overall we are following the user-centered design process - research, define the problem, and design. But our client came with very clear requests for features, and we have a tight timeline, so we used the discovery workshop to understand the context and validate their requirements. Then we started two tracks of design to build out all features. (see the timeline graph below)

*Each feature would be developed right after its design phase was finished. Our design team closely communicated with the development team every day, and we had daily scrum meetings to make sure there was no road blocker or confusion.

As the UX design lead of design track 1, I prioritized the program builder feature for the team from over 30 loosely defined requirements based on our discovery research due to the following reasons:

User's perspective

01 The usability of Program Builder decides if users' high-priority pain points can be solved properly, which is:

Clinicians(target users) struggle to understand program mechanisms while creating new ones, slowing down their workflow.

See detailed persona & journey

Client's perspective

02 The MVP needs to be new-user friendly and easy-to-understand

Ravenhealth was focusing on expanding the market after the MVP release. There should be as few understanding barriers as possible for new users.

Design team's perspective

03 Other features are impacted by or related to Program Builder

Unnecessary iteration is not needed. And program builder is the basic feature that directly affects many other functions of Ravenhealth software. We need to do things right at first instead of rushing to conclusions.

Dev team's perspective

04 Database setup of programs is essential & time-consuming

Data collection program experience decides the data that needs to be stored and the relationship between the behavioral data, which needs to be set up at first.

problems

What are we solving?

Therefore, this is the key problem I prioritized and would like to solve through the Program Builder experience design:

• So that clinicians create programs more efficiently and save more time for other management work.

• The communication effort between clinicians and technicians will be less.

• The program created through this builder could be easier to use and speed up data documentation for technicians.

Overview

Program Builder design overview

Problem Statement

How might we eliminate the gap in understanding program mechanisms for clinicians?

Outcome & Impact
  • 7/8 clinicians left positive comments in 2 focus group testing sessions
  • Re-designed the program building flow, which positively impacted the overall usability of the top 3 critical features of the Ravenhealth app
  • Helped the team prioritize the key feature among 30+ loosely defined requirements
  • Initiated the design system for Ravenhealth
  • The Ravenhealth software was released on App Store in Sept. 2021.
Scope
Tablet (MVP)
Duration
10 weeks
Team Collaboration
Product Designer (me), 1 Design Lead, 1 PM, 1 Brand Designer, 5+ Developers.
My Role

I took responsibility for the design track 1 (as displayed in the project timeline diagram below), crafting the features to solve the user problem as an end-to-end product designer.

About (see detailed design timeline below)

I help our team prioritize the program builder feature to solve the problem - "how might we eliminate the understanding gap between users and program mechanism." And I earned extra week for this feature to do more research so that we can define the understanding gap in current program creation experience.

Program Builder Design Timeline
Research

What is the "gap" for clinicians?

To better understand the gap, I conducted the following research activities in a week.

Research the current programs

I researched over 20 current popular ABA data collection methods to identify the patterns.

Follow-along sessions w clinicians

I set up five online follow-along sessions via Miro with clinicians to observe how they create a program and understand their mental model, workflow, and behaviors.

User survey

I conducted 16 quick surveys to understand challenges in clinicians’ current digital experience

Findings

Users take lots of time to recognize the raw data that is packed into the program form

The way clinicians think about the program is not aligned with how a program has been structured in the form. The Current program is a black box for clinicians. It packed the raw data collection methods in itself, like identifying frequency, timing duration, and counting steps, which really matter to clinicians.

Users set up wrong parameters due to the input fields not representing parameter structure

For example, this app only has text fields. New users might not be clear about the information format they need to input. So users have to write a lot in the fields to explain the parameters and their relationship, which increases the time cost.

Tasks

Problem refine

Process

General process

3 rounds of iteration, 7 variations(scenarios) of primary user flow, and 2 rounds of testing with 8~10 participants within 4 weeks.

solution

Solutions

01 Subdivided the program into 7 variations based on raw data collection methods

So that users can

  • create programs that are aligned with their mental models without spending time decomposing the original program

  • have more flexibility to create more dynamic and suitable programs for patients

02 Surface program structure via progressive form design

So that users can

  • have a quick understanding of program structure which surfaced by each step in the form

  • navigate the program creation experience easily with a guided flow (especially for new users)

  • spend less time on making mistakes or recalling the process of how to create programs

03 Add a standalone step for program type selection to onboard users

So that users can

  • decide which type they want use quickly with precisely define program type and abundant introduction to program type

  • save time by quickly building expectations of the upcoming steps (especially for new users)

04 Enable highly customizable parameters

So that users can

  • edit the options of each parameter to flexibly customize and create programs with surfaced parameter structure

  • efficiently manage parameters globally to save more time for other tasks

05 Initiated design system to based on Material Design

So that users can

  • be familiar with commonly used input patterns and has less understanding barriers

  • make fewer mistakes with clearly outlined error states

06 Create a new component "prompt selector"

So that users can

  • clearly understand the complicated structure of the parameter "prompt" by the input fields without redundant explanation

  • make fewer mistakes while identifying it in the program creation process

Final Design

Testing

Testing results

I conducted 2 focus group sessions with 8 clinicians to validate the program builder experience design.

7 out of 8 Clinicians left positive comments and felt confident that the new design would drastically improve current experience.

After program builder design

Support design of other features

After I finished the design for the program builder, I also helped another designer iterate on related features. For example, the patient data collection result page, Since I separated the old program into 7 types of smaller programs, now it can display the detailed progressive change of patient’s performance in one activity. So clinicians can make decisions more quickly without reading a long paragraph of text description

Details

Design details & solutions

view
Impact

Impact

  • Re-designed the program building flow, which positively impacted the overall usability of the top 3 critical features of Ravenhealth app

  • Helped team prioritize the key feature among 30+ loosely defined requirements

  • Initiated the design system for Ravenhealth

  • The Ravenhealth software was released on App Store in Sept. 2021.