Design Systems
These are some of the design systems I’ve built from scratch and maintained over time, working closely with developers along the way.
// Project Details
I built this design system from scratch in Figma and worked closely with developers to keep design and code in sync. Using the Tokens Studio for Figma plugin, we translated Figma variables into a JSON file that developers could process to automatically generate CSS variables for the React components. This setup helped keep the system consistent and easier to maintain as it evolved.
Role
Lead UI/UX Designer
Team
1 Designer, 5 Devs (3 FE, 2BE)
Challenge
Component Synchronization
◀ Browse Design System
// Project Details
As part of the design team, I worked extensively with Salesforce’s Lightning Design System, using it to design consistent product experiences while also contributing back to it. I created new components and updated existing ones when product needs evolved, helping expand and improve the system so it could support new features across the platform.
Role
UI/UX Designer
Team
Houndreds of Designers & Developers
Challenge
Complex Design Processes
◀ Browse Design System
// Project Details
I created this design system from scratch, working both as the designer and frontend developer. The system was designed in Figma and then implemented in Vue.js, building the components directly in code to match the design.
Role
UI/UX Designer / FE Dev
Team
3 Designers, 2 FE Devs
Challenge
Multi-Role
◀ Browse Design System
// Project Details
I contributed to building and maintaining a scalable and consistent UI foundation. I designed and developed reusable components aligned with accessibility and usability standards, ensuring they could be applied across a wide range of services and use cases. I also collaborated with cross-functional teams to keep the system up to date, refining components and patterns to support evolving product needs while maintaining visual and functional consistency at scale.
Role
UI/UX Designer / FE Dev
Team
5 Designers, 2 FE Devs
Challenge
Accessibility
◀ Browse Design System