Design systems
Design systems that streamline functionality, accelerate delivery, and bring motion and emotion to every interaction.
Process & Approach
A look at four design systems: The three systems below show how our team approached full-scale design challenges across very different organizations, and I contributed from early direction through final UI and build. Novartis centered on a gradient-driven language that unified a large product ecosystem and fed into a Storybook-powered CMS. Viatris required a confident editorial system to support a major merger and clarify their mission and global impact. Amgen focused on a calm, wellness-led foundation that stayed lean and adaptable for future initiatives. The broader case study continues with Sanofi, where I carried these learnings forward and refined how the system, branding, and UI worked together.
Across these systems I learned that scalability has to be baked in from the start, with lean tokens, variables, and modules that grow without becoming noise. Documentation only works if it is simple, connected, and searchable. Accessibility and motion have to be solved at the component level so every pattern holds up. Fast prototyping with real components lets teams test ideas early and ship with confidence. And the branding has to sit naturally inside the system so the experience feels both functional and emotionally grounded for the people who use it.
Sanofi’s enterprise design system, built to scale across brands while keeping a consistent visual language. It delivers clear UI patterns for sites, emails, and digital campaigns, and sets the foundation for expressive but controlled brand moments across the ecosystem.
Using the system to build the Wyield site keeps everything on brand and strips out visual noise so the key information stands out. Tokens and light motion cues support an emotional connection and help users navigate their condition with confidence and clarity.
This prototype is built around what users actually responded to in testing. They rejected gimmick-heavy campaigns and focused on four things: what the product is, how it helps them, what it costs, and proof it works for others. The layout reflects that. There is a benefit-first opener with motion, a clear testing and cost section for the three target groups, an MOA that explains how it works, and a testimonial path supported by short looping videos. Everything stays lightweight, simple to scan, and accessible despite the motion.
This build is fully responsive and designed with accessibility in mind, so the experience holds up across devices and screen sizes without losing clarity.
