2024
Dealer-FX
https://www.dealer-fx.com/
Background
The client is a premier provider of automotive after-sales service software in North America, acquired by Snap-on to lead their digital transformation. Their platform solves a critical problem for dealerships: the "black box" of car repair. By digitizing the entire service lane—from mobile check-ins and multi-point inspections to transparent text updates and payments—the software helps dealerships build trust with vehicle owners, increase service revenue, and streamline what was traditionally a disjointed, paper-heavy process.
Core problem
Despite its market dominance, years of rapid feature expansion had left the platform stuck with a clunky, inconsistent legacy UI. Accumulated technical debt and "code cruft" had turned the application into a fragmented, "Frankenstein" SaaS environment. Users frequently complained about the terrible user experience, noting that the UI design was particularly egregious and difficult to navigate, which threatened the very efficiency the platform promised to deliver.
Building "Socket UI": A Cross-Platform Design System & Governance Model
System Architecture & Strategy
To resolve the fragmentation, we built a new design system ("Socket UI") that established a tight coupling between design patterns in Figma and code using Web Components. This ensured that the system was framework-agnostic and could be absorbed into any tech stack across the organization. I expanded the system to include 44 robust components and supported 3 distinct brand themes using a sophisticated 3-layer token system.
Documentation & Enablement
We prioritized usability for the internal team by creating extensive documentation: ZeroHeight for designers and Storybook for developers. To ensure successful adoption, we trained both groups through live calls and recorded "how-to" video libraries. We also established an active support channel to address implementation issues in real-time.
Leadership & Governance
I conducted weekly 1:1 design reviews with every designer on the team, correcting mistakes and mentoring them toward better design practices. To measure the health of the system, I conducted regular sentiment surveys across development, design, and product management, consistently scoring above 4/5 for utility and ease of use.
Results and Impact
Efficiency Gains: Developers began shipping almost 4x faster when using Socket UI components compared to creating patterns from scratch. A developer audit calculated over 40,000 hours saved in 2024 alone.
Business Growth: As adoption increased, the UI became consistent, directly correlating to increased customer retention. The growth team also saw higher sales conversions using the new high-fidelity mockups.
Compliance: Accessibility was baked into the components, achieving compliance with ADA standards at WCAG Level AA.
Strategic Expansion: The parent organization increased investment in the system, positioning it as the de-facto driver for digital transformation across other business units.
Innovation: We built new patterns for AI tooling integration using the system. The design team was recognized with the parent company’s top Innovation Award in both 2024 and 2025.