I collaborated with the UX Design System team to support the planning, prototyping, and production of the internal design system. My work focused on streamlining interaction design and improving accessibility across the system. I partnered closely with interface designers to develop detailed, annotated interaction specifications and contributed to maturing the conventions used for managing design assets.
Project Summary
01: The Challenge
Internal Design System Development
UX Design Technology Team, 2023
Our team was tasked with updating and deploying a new version of the internal design system to meet modern accessibility standards—specifically aiming for WCAG 2.1 AA compliance. The existing system lacked clear interaction guidance, consistent asset management, and did not fully support accessible design practices. This limited its scalability across teams and made inclusive design more difficult to implement..
02: My Role
I collaborated closely with interface designers, accessibility experts, and engineers to ensure components were both visually consistent and accessible.
My core contributions included:
Creating annotated interaction specifications to clarify behavior across different states.
Maintaining and evolving a Figma-based toolkit used for documenting interaction patterns.
Implementing accessibility design considerations directly into the Figma UI Kit.
03: Design Process
We began by auditing existing components against WCAG 2.1 AA standards, identifying gaps in contrast, keyboard navigation, and interaction feedback. From there, I helped define updated interaction patterns in Figma, focusing on:
Spec documentation: Using component libraries and interactive flows, I authored detailed annotations for states, transitions, and usage guidelines.
Toolkit refinement: I improved our internal toolkit to standardize how specs were created, which helped other designers contribute more efficiently.
Accessibility integration: I worked alongside accessibility specialists to embed compliant color styles, focus states, and semantic usage directly into the design components.
Regular design reviews and working sessions with developers ensured alignment between design intent and implementation.
04: Impact
The updated design system improved accessibility compliance across multiple products, reducing the design team's dependency on one-off accessibility reviews. Designers now had clearer guidance and accessible-ready components to work with, increasing both speed and consistency in UI development.
Achieved WCAG 2.1 AA alignment for core UI components.
Reduced time spent on redundant design spec creation through an improved Figma toolkit.
Supported better cross-team collaboration by creating consistent documentation standards.
05: Key Takeaways
This project taught me how critical clarity and structure are in design systems—especially when it comes to accessibility. It also reinforced the importance of cross-functional collaboration: by working closely with developers and accessibility experts, we were able to deliver a system that was not only scalable but more inclusive by design.
I also gained valuable experience maintaining design tools (like Figma kits) at scale and ensuring that accessibility isn't treated as an add-on, but embedded from the start.