“Improving Your Healthy Habits” App Feature

Role

I worked in-house at Onlife Health as a UI/UX designer on this application feature. The team consisted of myself, another designer, product owners, a scrum master, developers, and a user testing consultant.

Objective

The objective was to provide our users with a way to cultivate new habits in order to improve their health. The feature needed to utilize the company's educational content, and work seamlessly as a feature within a larger application.

The Onlife Health wellness application already had a health survey in place, so we utilized it for this feature. Once a user took the survey the data was used to push specific health improvement recommendations to the user. For example, if a user indicated a lack of exercise, this new feature would recommend a physical activity program.

A final mockup of the web-version of the product.

A final mockup of the web-version of the product.

 
Early wireframe sketches from a brainstorm session.

Early wireframe sketches from a brainstorm session.

Process

The project began when a client identified the need to have a program their members could use to help form new habits in order to improve health and reduce insurance cost for the employer. We brainstormed on a variety of ideas to help develop the necessary habit-forming behavior to keep users motivated to continue with the program.

One requirement from our clinical experts was to utilize a specific behavioral method where you choose a “When I” statement and finish it with an “I Will” statement. For example, “When I wake up in the morning, I will pack my gym bag.”

 
Early wireframes for prototypes and testing. (From left) Screen 1: an early screen that would appear if a user is recommended to join a stress program, screen 2 a screen from stress program enrollment, screen 3 is the view a user sees each day when …

Early wireframes for prototypes and testing. (From left) Screen 1: an early screen that would appear if a user is recommended to join a stress program, screen 2 a screen from stress program enrollment, screen 3 is the view a user sees each day when they check in on their habits.

 
More early prototypes. (From left) Screen 1: another iteration of the daily view a user would see to check in on habits, screen 2: the expanded view where a user could quickly swipe through and check-in, screen 3: the end-of-week recap to show progr…

More early prototypes. (From left) Screen 1: another iteration of the daily view a user would see to check in on habits, screen 2: the expanded view where a user could quickly swipe through and check-in, screen 3: the end-of-week recap to show progress.

 

Feedback and Iterations

Once prototypes were created we collected user feedback via in-person and online testing. We iterated upon the designs and got stakeholder approval before we began collaborating with the development team. We faced a quick turnaround given a tight deadline to have the full product ready in about a half a year. The final product has 22 unique programs covering a wide variety of health topics.

Here are a few of the final screenshots. We updated the prototypes to reflect some of the changes we discovered via user testing. For example, we included a calendar view on the progress page to provide a quick glimpse at the daily progress made ove…

Here are a few of the final screenshots. We updated the prototypes to reflect some of the changes we discovered via user testing. For example, we included a calendar view on the progress page to provide a quick glimpse at the daily progress made over the course of a month which was helpful given the program lasts 6 weeks.

 
Current iteration of the web version of the app feature.

Current iteration of the web version of the app feature.


Retrospective

After development and QA testing the project went live in January. It has been a nice addition to the application and has received good feedback so far.