Modernization & Design System Leadership

At SafetyChain, the product suite had grown through years of iterative development without a cohesive design strategy. Even within a single platform, generational releases left product areas disconnected and often subject to the UI patterns available by default to developers across disconnected, offshore engineering teams. As a result, interfaces were inconsistent across modules, which confused customers and increased training and support needs.

Internal teams struggled with design debt, duplicate work, and slow delivery velocity for development, QA, support, and product design processes without a standardized framework guiding solutions. The lack of a unified design system limited both product usability and company-wide efficiency.

The first step in achieving a consistent design system was defining what the system should be. Each product had grown on its own, with inconsistent styles and no shared foundation. Brand guidelines had shifted over time, and there was no unified sense of what "good" looked like. On top of that, accessibility had never been a priority, which meant that even the pieces we could salvage fell short of WCAG standards.

At the same time, we were moving from Adobe XD to Figma. Instead of porting over broken patterns, we decided to rebuild everything from the ground up. Every page, component structure, workflow, drop-down, and button family was re-imagined inside a brand-new Figma library. We designed with symbol and state variants, critiqued and tested as we went, and we deliberately broke patterns down and rebuilt them stronger. The result was a living library where each element included contextual guidance, use cases, written examples, and related content suggestions so any team could adopt it.

In parallel, we worked to connect this system with engineering practices. Development was divided across multiple groups that often overlapped but rarely coordinated, so identical components were built from scratch time and again, each with different interpretations, live across the product. To address this, I partnered with engineering leadership to evaluate options for bridging the gap between design and development. We discussed best practices for globalized components and design acceptance stages, and researched tools like Figma Dev Mode, Storybook, and custom-built solutions, to identify the best way to govern and share components across both functions.

Contributions as Director of UX Research, Analytics, & Design:

• Established a Scalable Design System. Defined core patterns, components, and accessibility standards. Balanced modernization with compatibility for existing product modules to minimize disruption.
• Cross-Functional Alignment. Partnered with engineering and product management to ensure adoption. Built governance processes and contribution models so all teams could own and evolve the system.
• Enablement and Training. Led workshops, created documentation, and mentored designers and engineers to embed design standards in daily work. Introduced tooling that improved design-to-dev handoffs.
• Iterative Modernization. Phased rollout, beginning with high-impact modules, proving ROI early. Paired modernization efforts with customer-driven feature priorities to maintain trust and momentum.

As the system rolled out, the improvements were clear for both external customers and internal teams. For customers, the product became more consistent and easier to use. Screens that once felt disconnected started to follow the same patterns, which made tasks faster to learn and less frustrating. Support teams began to see fewer tickets tied to usability issues, and onboarding sessions were smoother because new users could apply what they had already learned across different modules.

For internal teams, the benefits were just as clear. Designers no longer had to rebuild basic elements or argue over standards. They had time to focus on solving real problems instead of debating which button style to use. Developers could finally work from a shared library, which reduced duplicate builds and kept pages aligned across teams. With governance in place, both design and engineering had ownership, which made the system something they trusted and kept improving.

• Faster handoffs. Design-to-development handoffs sped up by roughly 30–40 percent after component adoption.
• Less duplication. Fewer duplicate builds across engineering teams working on overlapping modules, with clearer ownership.
• Fewer support tickets. A noticeable drop in usability-related tickets in the first modernized areas.
• Accessibility built in. All new components aligned with WCAG accessibility standards.
• Higher satisfaction. Improved satisfaction from both designers and engineers, captured through internal surveys.