✦ Case Study · Featured

PayGaps
B2B SaaS Dashboard Redesign

Redesigning a B2B SaaS dashboard that had outgrown its early-MVP layout — giving users a clear, scannable view of the metrics that actually drive their decisions.

Product
PayGaps
Role
UI/UX Designer · Product Strategist
Platform
Web — Dashboard-first, B2B SaaS
Scope
Research · IA · Hi-fi UI · Handoff
PayGaps Job Structure Dashboard

The dashboard had outgrown the product.

PayGaps' dashboard was built fast, early, and generically — the layout it shipped with wasn't designed around what B2B users actually needed to see first. As the product matured, the gap between "what's on screen" and "what the user came here for" kept widening.

I led the redesign end-to-end: stakeholder and user research, information architecture, a rebuilt component system, and high-fidelity UI — ready for engineering handoff.

1
Full dashboard redesign
Time-to-insight for daily users
100%
Developer handoff documentation

Generic layouts hide the metrics that matter.

The existing dashboard treated every metric with equal visual weight — a common symptom of MVP-stage design decisions that never got revisited as the product and its users matured.

Problem Statement

Users had to hunt for the numbers that actually drove their decisions, buried among lower-priority data with no clear hierarchy or path to action.

Pain points uncovered

  • No visual hierarchy between critical and secondary metrics
  • Layout inherited from an early MVP, never re-validated against real usage
  • Users needed multiple clicks to reach frequently-used views
  • Inconsistent component patterns across the dashboard

Business goals

  • Cut the time it takes users to find key metrics
  • Establish a reusable component system for future features
  • Improve daily-active engagement with the dashboard
  • Ship a redesign engineering could build without ambiguity

AI as leverage, not a shortcut around judgment.

This project was a good test case for folding AI tooling into a real B2B redesign — using it to compress the slow parts of the process so more time went into the decisions that actually needed a designer's judgment.

Claude — Research Synthesis
Used to synthesize stakeholder interview notes and support-ticket themes into clear pain-point clusters before wireframing began, instead of manually re-reading every transcript.
Visily — Rapid Layout Exploration
Used for early low-fidelity exploration of dashboard hierarchy options — testing several information-architecture directions before committing to one in Figma for final builds.
Where the judgment stayed human

AI tooling shaped the speed of exploration, not the final call. Which metrics earned top-of-fold placement, how dense the tables could get before they hurt scannability, and the actual visual hierarchy were all decisions made through direct stakeholder feedback, not generated output.


Rebuilding hierarchy from the metrics up.

01
Discovery
Synthesized stakeholder interviews and usage patterns to identify which metrics actually drove decisions.
02
IA & Exploration
Explored multiple dashboard hierarchy directions fast, before narrowing to one direction for Figma.
03
Component System
Rebuilt the dashboard's components for consistency — cards, tables, and status indicators aligned to one system.
04
Hi-Fi UI & Handoff
Final high-fidelity screens with clear developer handoff documentation and interaction specs.

Structure and status, both readable at a glance.

The rebuilt dashboard gives two complementary views: a Job Structure grid mapping every role across department and seniority level, and a Job Catalog list showing evaluation scores, pay-gap status, and headcount per role — so users can move between "where does this role sit" and "how is it actually performing" without losing context.

PayGaps Job Catalog View

A dashboard users can actually scan.

Time-to-insight for daily-active users
1
Reusable component system for future features
100%
Handoff-ready documentation for engineering
B2B SaaS Dashboard Redesign Information Architecture Component System AI-Assisted Research
Lessons Learned

AI tools are genuinely useful for compressing the parts of a redesign that don't need a designer's judgment — synthesis, early exploration, first-draft copy. The parts that do — what actually matters to the user, and why — still come from talking to them directly.

Next Case Study
Base360 — Unified Inbox Design System