The Challenge

Years of accumulated inconsistency with no clear picture of the damage

Ontraport's CRM had grown organically over years, accumulating hundreds of one-off font sizes, colors, paddings, and UI patterns with no shared system governing them. Before anything could be fixed, the team needed to understand the full scope of what they were dealing with — and no one had a clear picture.

The Approach

Building a tool to audit the problem before designing the solution

Leveraging my familiarity with C#, I built a custom tool in Xamarin that parsed the application's CSS file and returned a complete inventory of every font size, color, padding, and spacing value in use. The output revealed the true scale of the inconsistency problem and gave the team a data-driven foundation for prioritization. From there, I led the design system effort in Figma — defining tokens, variables, primitives, and component values that would serve as the single source of truth for the platform's next generation.

The Outcome

A 50% reduction in design-to-development handoff time

The design system gave engineers a reliable implementation guide and reduced handoff time by 50%. UI inconsistencies were systematically resolved as components were migrated to the new token structure. The foundation built during this engagement became the architecture for Ontraport's modernized platform, enabling faster, more consistent product development going forward.