FusionAuth's admin application was the product. Not the marketing site, not the docs. The thing customers logged into every day to manage their authentication infrastructure. And it had been running on a UI derived from CleanSpeak, a separate content moderation product, since around 2016. By the time this project started, the design was nearly a decade old. No design system. No documentation. CSS that was difficult to modify without breaking something else. A product that worked but looked and behaved like it belonged to a different era.
The brief was to change that. A full UI overhaul of the admin application, designed to current standards, implemented with engineering, and built to hold up as the product scaled.
CleanSpeak was a content moderation platform. FusionAuth is a developer-first identity and access management product. The fact that one's UI had been powering the other's admin app for the better part of a decade was not a design decision so much as a historical artifact. Engineers could navigate it. But for enterprise customers evaluating identity solutions against products built in 2022, 2023, 2024, the gap was not subtle.
Making updates was its own problem. The CSS was entangled enough that a targeted change risked breaking something adjacent. There was no design system to reference. Every new feature shipped into an environment where consistency was aspirational.
Before a single screen was redesigned, the system had to be built. A UI design system in Sketch & Figma became the source of truth: components defined, spacing rules established, color tokens mapped to the FusionAuth brand palette, interaction states documented. The system was built for speed. Rapid prototyping for incoming features meant engineering could evaluate a design before building it, not after.
The component library ran on Tailwind. Not pulled from a template and dropped in. Coded, configured, extended, and branded. FusionAuth's color system applied to every token. The library became the shared vocabulary between design and engineering.
Over 260 pages, components, and elements were redesigned. Not templated from a single master. Each one reviewed, rebuilt, and validated against the new system. Some were direct visual updates. Others required rethinking the underlying UX flow, because the interface had been built for a different product and the tasks customers were actually completing had never been the starting point.
The pace was relentless. Three and a half to four months. Every new feature that came in during the redesign was prototyped in the new system before it shipped, so the work was not just rebuilding the past but designing the present simultaneously.
None of this shipped without engineering. Every component, every page, every interaction was coordinated directly through GitHub. PR reviews. Implementation QA. Back and forth on behavior, edge cases, state transitions. Four and a half months of tight collaboration between design and engineering, taking the system from Sketch / Figma frames to production code.
The implementation was the design. Interactions had to work, not just look right in a mockup. That required presence in the code review process, not just file handoffs.
The FusionAuth admin application shipped with a UI designed for the product it had become, not the product it originated from. Modern, branded, consistent. A documented design system that gave engineering and design a shared reference going forward. 260+ components and pages rebuilt to a single standard. Features prototyped in the new system before they were built, so the product could move faster without accumulating new debt.
What had been a decade-old inherited interface is now a design system. The gap between the FusionAuth brand and the actual product experience is closed.
Beautiful design has the power to captivate audiences.
