How I contributed to evolving Genesis, Stepstone's design system, improving consistency, accessibility, and scalability across multiple products, platforms, and markets without disrupting the teams that depended on it.
As adoption of Genesis grew, so did fragmentation. Inconsistent interaction patterns across products, accessibility gaps in colour contrast and focus states, legacy components that no longer aligned with modern UX expectations, and increasing effort required for teams to implement and maintain standards.
How do you evolve a design system that is already widely used, without breaking the products that depend on it?
Rather than treating Genesis as a static library, we approached it as an evolving product, identifying high-impact areas for improvement, prioritising changes that scale across multiple components, and ensuring changes were adoptable, not disruptive.
Our existing colour system did not consistently meet accessibility standards, particularly WCAG AA contrast requirements across UI states, interactive elements, and text.
I contributed to evolving the design language (DL2.5), redefining colour pairings to meet accessibility standards, ensuring contrast compliance across all UI states, and creating a more robust and flexible colour system with clearer guidance for designers and engineers.
Focus states were inconsistent or missing across components, creating accessibility and usability issues, particularly for keyboard navigation and assistive technology users.
I led efforts to define consistent visual patterns for focus states and applied them systematically across all relevant components, aligned with accessibility best practices.
Navigation patterns needed to support increasing product complexity and scale across multiple product contexts. I worked on evolving header and footer components to handle complex navigation structures while maintaining consistency across experiences.
File upload interactions were inconsistent and lacked clear state handling. I helped design a multi-state upload component covering default, uploading, success, error, and edge case states, providing a scalable pattern for future use.
Button groups were being misused for selection patterns across products, leading to inconsistent UX and unclear interaction models for users.
I supported the transition to a segmented control component, better suited for single-selection scenarios, with a clearer interaction model and more consistent behaviour across contexts.
Micro-interactions and motion were inconsistent or underdefined, creating an uneven perceived quality across products and no shared foundation for future motion work.
I contributed to defining motion patterns including an AI spinner/loading interaction, consistent animation behaviours, and principles aligned with the system, establishing a foundation for broader motion guidelines.
Alongside the design system work, I was appointed as Accessibility Champion for the organisation. That meant going beyond component-level compliance and taking on a broader responsibility for how accessibility was understood and applied across the company.
I worked closely with the facilitator running accessibility training across the organisation, helping drive engagement and making sure designers actually showed up and got something from it. Getting people to prioritise training alongside live project work takes more effort than it sounds. More significantly, I worked directly with the legal team as Stepstone prepared for the European Accessibility Act, which introduced enforceable legal obligations for digital products operating in the EU. The design system was right at the centre of that response, so a lot of the compliance groundwork ran through the work we were already doing on colour contrast, focus states, and interaction patterns.
Accessibility stops being a best practice and starts being a legal obligation. My job was to make sure the design system was ahead of that, not catching up to it.
This work contributed to a broader shift in how Genesis operates within the organisation, away from a static deliverable and towards a product with its own roadmap, standards, and governance.
A design system isn't just what you build, it's how you enable others to build.