Claude Code and the Figma MCP
Claude Code can connect to Figma through the Figma Model Context Protocol server, which turns Figma into a tool the agent can call. With the Pando skill loaded and the codebase in scope, a prompt in the terminal produces editable Pando components on the Figma canvas.
Component and pattern work in Pando
A sample of ongoing component and pattern work in Pando: a card refresh, responsive tabs shaped by user research, a new pagination component, modal iterations, and a badge redesign that came out of the Pluralsight rebrand.
Pando Figma UI-kit upgrades
The Pando Figma UI-kit gets maintained alongside the React component library. Staying current has meant adopting Figma’s newer capabilities, working through a Pluralsight rebrand, and building out the features that make the kit genuinely useful rather than just complete.
I created a set of design guidelines based on the Pando Design System component set, color values, typography, and UX best practices.
As Principal Product Designer, Design System at Pluralsight, I worked on standing up the Pando Design System - a framework-agnostic and accessibility-driven suite of design and development tools and guidelines.
Moving from Zeplin, Invision, and Sketch to Figma
For Cars.com, I helped steer a transition from using Invision, Sketch, and Zeplin apps and services to primarily Figma for our Product Design team.
Spark Design System homepage
I built Spark, Cars.com’s design system, from the ground up — from the first research session to a mature, Figma-integrated system used across the product org.