A self-initiated effort to boost the Figma proficiency of an entire design team. A year of weekly teaching turned a one-off file into team infrastructure that became the foundation for a later $2M+ client redesign.
Closing a systems gap
When I joined IfThen, most website projects started from a blank Figma file, and the team of talented designers was rebuilding the same wheel slightly differently for every project. There were no token systems, no shared components, and no consistent handoff to developers. As a Figma wiz, I saw an opportunity for design systems to both optimize the design and development processes and bring the two teams closer together.
I built the Root Design System: an unbranded Figma template any new project could duplicate and make its own, with component and token primitives specific to patterns both designers and devs at our agency frequently used. The system included 127 reusable components, 119 color variables, a tokenized type scale, and a defined breakpoint structure.
This file was a foundation, not a straitjacket. It took care of the boilerplate systems architecture reused on most projects, provided more standard handover for the devs, and let the designers focus on the custom components and unique personality for each site.
Increasing adoption with instruction
To make sure the file actually got used, the Figma proficiency level of the whole design team needed a boost. They were used to working with rectangles and groups, which is one thing… auto layout, variable modes, and components are another. There’s a big learning curve to cross that gap, and all the YouTube tutorial links I was dropping in Slack weren’t getting traction.
I started Figma Office Hours, a weekly, one-hour class for about eight designers. We dug into the advanced tooling so they would know how to work with the file, but we also talked about why systems matter and what they save you down the line.
Things really started to click once I pulled a few developers in to tell their side of the story. They explained how things like consistent spacing and color tokens in Figma had positive downstream effects on the handoff process, making the build (and their working lives) easier. The designers hearing anecdotes like that from the dev team landed the value of systems better than I ever could have alone.
Slowly, the tool became infrastructure for our teams and its adoption increased. Years later, the Root Design System is still the default starting point for new projects at IfThen. In 2025, when the team took on a $2M+ website redesign for AAFP (opens in new tab), they built the site’s design system on top of Root. It became the linchpin of the whole project.
The AAFP Design System changed the way our UX, Design, and Development teams collaborate. It enabled UX and Design to rapidly prototype 100+ new pages based on a componentized system, and it provided developers with the detailed level of component documentation they required. This flexible, extendable system has created a high amount of efficiency that will serve as the backbone to help us succeed in future projects.
— Dave Rickett (opens in new tab), Senior Vice President
Reflections
Although Figma sometimes feels outdated considering the AI tools I build with now, this project still holds a special place in my heart.
First, because it created a collaborative, knowledge-sharing culture among our design and development teams that is still alive and thriving today.
Second, because Figma is where I developed the systems mindset that has become invaluable as I’ve learned to work with AI. Quality systems thinking and execution are still what underpin quality outputs, whether it’s being enforced with Figma components or Claude skills. Boy, do those little robots love to go off the rails if you don’t watch them carefully…catching and steering them back on track requires a sharp eye that’s trained to recognize systems drift, which I wouldn’t have without Figma.
What the team said
The Figma Office Hours set up by Anna Grace for our design team has been informative and extremely useful. My knowledge with Figma has grown tremendously while listening to her intuitive lesson plans, demonstrations, and group discussions. Her live tutorials are easy to understand and filled with relatable examples. I have incorporated new features and best practice recommendations into my daily design projects for the past year.
— Ricky Tse, Art Director
The Design System that Anna Grace has implemented is an elegant, efficient, and well-executed addition to our team’s workflow. This system has reduced the time and effort it takes for our team to create components, design pages, iterate, revise, and hand off to developers. The process is smooth, straightforward, and decisive thanks to the reduction of repetitive work and our team’s newfound technical proficiency — all attributed to the thorough training received from Anna Grace during Figma Office Hours.
— Julie Sharpe (opens in new tab), Art Director, Graphic Designer