Fresh Connect
Overview
Fresh Connect at this time was a 3 year old, HIPPA compliant, tech-enabled food prescription program empowering patients with the money and flexibility to buy the foods they need to be healthy. This program and its associated web app platform, allowed healthcare partners and providers to enroll cardholders, manage financials, and provide cardholder success to patients.
The Problem
The Boston-based nonprofit was looking forward to a nation-wide expansion of services and retailers along with an estimated quadrupling of cardholders in one year. This created an urgent need for an expanded, automated toolset for cardholder reporting. Much reporting was being done ad hoc and by hand. These items needed to be improved and designed to scale with the expansion:
- Running cardholder engagement reports was a top user task, but was hidden under many clicks. Also, multiple report types were available, but users only found the engagement reports of use.
- How can we direct users to the report they need quickly?
- Users had to sort and filter data in Excel to fully run reports.
- Is there a way to anticipate user needs and answer high-level questions in a new dashboard?
- Parts of the dashboard had become inaccurate due to lagging updates.
It had to be pulled down and fully revamped.
The Goal
Our goal was to create an accurate, actionable dashboard and more accessible reporting. This goal was identified through heuristic evaluation, UX auditing, and business needs.
The Team
Director of Product, Product Manager (External), Development Team (Two External teams were involved on this project)
My role: Lead Product Designer
Research and Insights
Over a period of a month, while the dashboard was down, the Director of Product captured data from customer requests pertaining to their needs and desires for reporting. We gathered a lot of great information on what customers wanted out of reporting. We also spent a good deal of time sketching on paper, in Figma, and even in PowerPoint - like you see here.
We were arriving at a narrative and actionable dashboard concept.
Design Process
After the initial sketching process, I began exploring many dashboard layouts and concepts in Figma
For the first round of prototyping for user testing, I used grayscale graphs to not distract users with color. I really just wanted to understand that the data story was being told correctly at this point.
I conducted user testing through a standardized protocol, walking through the prototype with 3 customers and 3 internal stakeholders.
- Desire for percentages & absolute numbers in data
- Users want to see baselines - are we performing well
- Shopping Activity and Fund Utilization, the most important program metrics overall
We came up with many tweaks to the graphs and story. After a series of design reviews with internal stakeholders and developers, we narrowed down the widgets, and I was able to create this prototype which:
- Provided engineers with a clear vision of flow and interactions
- Was used in all-hands for internal awareness
- Was presented in sales & fundraising demos
Unfortunately we hit a snag
At this juncture we began working with a new external development team. They discovered a loss of data, and we would not be able to proceed as planned. But we came up with a compromise (see below).
Outcomes and Reflections
While the rollout of the updated dashboard was less than ideal, the team learned a great deal while achieving the goal of creating a functional dashboard.
- The dashboard now contained directly actionable items
- Partner co-branding, and personalization was soon at hand
- And an updated, bespoke design system was now in use for future iterations.
