Visualizing Health Tracking Data For Consumers And Coaches

If you're familiar with the Nudge app then you probably already know we are crazy about the different ways we can visualize data. It's at the very core of everything we do. Well you may not know we're nearing the launch of a new product, and one that targets a new audience no less. Nudge Coach is designed to take the data we're already collecting from the best health tracking apps and wearables out there, and present it to health professionals - like independent health coaches - to help them provide better, more timely feedback to their clients. One of the truly fun parts of this latest project has been the opportunity to start back at square one and revisit the possible ways of visualizing data to benefit a new audience.

The challenge has been compelling, and at it's core, it's two-fold. One, we want to take the same datasets and visualize them in a new way to provide optimal value to an audience with a different perspective and specific set of goals - in other words, we're repackaging data for use in a different context. And two, this data reshuffle has to serve as the best possible complement to the existing visualizations in the Nudge App. This is because a Nudge Coach's client will always have access to the visualizations available in Nudge. They communicate and share data with their coach directly through the existing Nudge App, so the Nudge Coach implementation must be complementary.

Summary Layers

Let’s start with the highest level views, what you can think of as a "summary layer", and drill deeper into “detail layers" from there. The “summary layer" in the Nudge App is the Nudge Factor pictured below.



As it says in the bottom right corner, it is a 30-day snapshot of your healthy lifestyle. It’s created by indexing 30-days of fruit and vegetable consumption, hydration, sleep duration, and exercise data. A single score as feedback provides the user with the immediate motivation of seeing progress. As the user, I know where I stand over all, and I know if I’m getting better or worse from day-to-day. It’s hard to overestimate the value of this simple layer of feedback.

Now to the visuals, the first thing you may notice is the colors. Green is good and red is bad. There was a time when we considered getting a little more clever with it, but that would have been an enormous mistake. As our UI/UX Director Russ Campbell said, the most common design mistake in consumer apps is designing visuals that are “too interesting". We always ask ourselves if new concepts are too interesting before putting them in front of people. Next, the expanding circular shape allows us to accomplish two things. First, it lets us communicate the idea that more data extends the graph out further - generally speaking, more data is better. And second, it lets us visually communicate the idea of balance between the four segments of a healthy lifestyle. If each segment were green and about the same size, the user gets a clear impression that their lifestyle is in balance, which is something we are keen on motivating our users to achieve.

Now let’s take a look at a “summary layer" in Nudge Coach:



Note that there is actually a summary layer above this in Nudge Coach, which is simply a list of clients sorted by Nudge Factor, but for this post I’m focusing on individual data visualizations.

The first thing that jumps out is the real-estate advantage you have when working with a web interface. This was an important decision we made pre-development. After discussing daily routines with several health coaches, both independent professionals and those working with larger organizations, starting with a web and tablet-friendly interface rather than phone became an easy choice. Additional bits of information that are necessary in the coaching context that were not in the consumer context include (1) who’s data am I looking at - which is shown in the profile information I’ve blurred out for privacy reasons - and (2) which tracking tools are they using - something a consumer would obviously know about themselves but which helps a health coach to "speak the same language" as their client, and also due to differences in the way different tools collect data, to understand why this client’s data might look a little different from others.

Green is good and red is bad. It’s nice to have a consistent theme, but this is also vital to preserve the complementary nature of Nudge Coach as it relates to Nudge. If individuals have different completely different feedback cues from the coaches who are trying to support with them, communication would break down and everyone’s time would be wasted. This is not what we’re going for. You will also notice that we’ve broken out a brief thumbnail summary of each lifestyle factor that contributes to the Nudge Factor. This gives the coach a quick snapshot of high-level trends. This visual saves a coach's time and effort time by making it easy to spot the areas where the trends aren’t optimal, so they can spend their time focusing precisely where their help is needed. The daily averages on each module provide similar value. Even the background imagery was put in place to be functional (as well as to look pretty). The imagery allows my brain to more immediately identify the data I’m looking at. This may only save a few hundredths of a second, but hey, every little bit helps.

Detail Layers

Now that we’ve covered some summary views, let’s dive one step deeper and see how the consumer-facing views differ from the visuals we have provided our Nudge Coaches.

This post is broken up into two parts - Click here to continue reading!

Nudge App for iPhone Nudge App for Android