Plain Proof

Understanding what existed

We began by conducting a comprehensive site audit to map out the existing UI, identifying friction points and catalog opportunities and redundancies. We also built a library of references to analyze similar tools to learn and provide discussion on how they were presenting and handling complex, high-density data.

Since Plain Proof is a small development team, we also examined lightweight CSS frameworks like Web Awesome, Material, and Bootstrap that could provide rich customization where required, while integrating with Plain Proof’s Smalltalk backend. We ultimately chose Bootstrap as we collectively felt it offered the quickest path to MVP while allowing sufficient ways to use variable driven themes to produce a distinct feel for the product. Perhaps most important, Bootstrap’s long history of consistent evolution bring a stable foundation of well thought out helper classes, theming, and documentation that this small team can leverage over a long product roadmap.

Mapping themes and repeatable data patterns

With the audit complete, we began categorizing feature and data themes revealing the essential patterns and use cases. These foundational element would the help us to apply distill down to a component driven design standard shared across dashboards. These templates found structure from consistent data tools and predictable navigation that support each diverse sets of data, lowering cognitive load around tooling, while focusing the user’s attention on the data itself and the care outcomes the user is hoping to effect.

Remapping content this way did two important things:

1. It ensured we didn’t leave behind any critical compliance data the team had captured, and
2. The new library of blocks gave Plain Proof a blueprint for assembling clean, reusable patterns that would work reliably across any device.

Creating natural pathways

To simplify how users move through Plain Proof, six key tasks most commonly taken by busy facility administrators were captured. The goal was to further reduce cognitive load showing only the data or actions essential these tasks, restructuring the navigation to boost completion of these high-priority actions. We also wanted to push further into the ‘next best actions’ a user might consider as they finished each of these tasks.

By defining swim lanes—like uploading fresh data, analyzing a competitor, or updating a clinical improvement plan—we could explore ways to optimize and reduce steps required to complete tasks. 

Designing for momentum and scale

With each low fidelity layout, we strip away the visual noise to turn a wall of intimidating numbers into a clear, reliable map.

In the final sprint, we translated these low-fidelity blueprints into functional, responsive layouts. Screens were created using standard components from the Bootstrap 5 framework, ensuring they were immediately compatible with the client’s existing front-end pipeline. Big thank you to Emily Mason and the excellent work she adapting Bootstrap to Figma with her Figma Bootstrap 5 UI Kit which was very robust and really helped speed things up for us.

For the public-facing screens, we focused on high-readability layouts that communicate authority and trust. For the deep, authenticated dashboards—such as the Summary Report and individual Quality Improvement Plans—we designed rich, high-density layouts optimized for quick scanning. On desktop, these reports utilize a structured sidebar navigation that keeps critical clinical subcategories (Staffing, Quality Measures, Health Inspections) exactly one click away. On mobile viewports, these elements stack gracefully into collapsible sections, maintaining absolute clarity without sacrificing access to robust federal metrics.

To add speed up and enrich our design handoff, Plain Proof was given Figma Dev Mode while visual design were meaningfully annotated with a specific Bootstrap details to highlight specific deviations from the Bootstrap standards. This prevented unnecessary guesswork, ensuring developers were able to quickly flag areas of customization.