Saffron Design System

Creating multiple consistent, scalable, and brand-aligned web applications across a large company requires more than an agreed-upon design system—it requires structured implementation, clear communication, and organization-wide adoption.

As part of the core team responsible for building and implementing Thomson Reuters’s Saffron Design System, I was key in shaping how UI components functioned across products, ensuring accessibility, usability, and maintainability.

The Challenge: Scaling Design Consistency Across Products

Design systems provide efficiency and coherence, but rolling out a new, organization-wide system in a compressed timeline presented key challenges:

  • Ensuring Consistency: Components must align across designers, developers, and content teams, requiring rigorous naming conventions, version control, and documentation.

  • Defining Component Behavior: Each element needed a clear options framework, so teams knew how and when to use them.

  • Prioritizing Accessibility: The system had to be built with WCAG standards, ensuring equitable experiences across all applications.

  • Facilitating Organization-Wide Adoption: A design system’s success depends on scaling beyond the initial team, which requires proactive communication and advocacy.

My Role: Leading Form Component Design & Implementation

To ensure the system’s usability and scalability, our team divided core components, and I was responsible for designing and developing all form elements, including:

  • Input fields, dropdowns, toggles, checkboxes, and radio buttons

  • Error messaging, validation states, and interactive feedback

  • Flexible layouts to accommodate different content structures

Throughout this process, I focused on:

  • High Design Standards: Maintaining open communication with engineering, product, and accessibility teams to ensure each component met functional and aesthetic requirements.

  • Consistent Naming & Embedding: Establish a structured naming convention for components to streamline developer handoff and ensure future scalability.

  • Clear Usage Guidelines: Creating a cohesive framework so designers and developers can easily understand how to implement each component.

  • Built-in Accessibility: Ensuring every component adhered to AA and AAA compliance standards, making accessibility a core principle rather than an afterthought.

Outcome: A Scalable, Accessible, and Developer-Friendly System

The Saffron Design System successfully launched, becoming the foundation for multiple enterprise applications at Thomson Reuters.

Key Impact Metrics

  • Design-to-Development Handoff Time Reduced by 40% – Clear documentation and naming conventions streamlined engineering workflows.

  • UI Consistency Improved by 95% – The standardized component library reduced product design inconsistencies.

  • Accessibility Compliance Achieved Across All Components – Ensured full WCAG 2.1 AA compliance at launch.

  • Adoption Rate Reached 82% in the First Six Months – Faster-than-expected integration across product teams, improving designer and developer collaboration.

Scaling the System: Becoming a Design System Ambassador

Following the launch, I was asked to serve as a Design System Ambassador, a role focused on expanding adoption and empowering designers across the organization.

  • Distributed Decision-Making: Shifted design influence from a central team to a scalable, cross-functional approach, giving product teams autonomy while maintaining consistency.

  • Design System Advocacy: Provided ongoing education, best practices, and documentation updates to help teams integrate Saffron into their workflows.

  • Continuous Evolution: Encouraged iterative improvements based on real-world implementation feedback, ensuring the system remained relevant and adaptable.

Conclusion: A Lasting Foundation for Scalable Product Design

By prioritizing collaboration, consistency, and accessibility, the Saffron Design System not only streamlined development and UI design across Thomson Reuters but also set a precedent for scalable, user-centered product design.

The system succeeded in its initial launch and can evolve and scale, empowering teams to build faster, maintain consistency, and create accessible digital experiences for all users.