IBM
Closing an 8-month gap between IBM.com's internal Figma kit and its production CMS
UI/UX design
Design systems
Component design

Project overview
IBM.com is built on AEM (Adobe Experience Manager), the CMS behind its pages. The internal Figma kit is its design counterpart: a large component library that designers across IBM use to quickly design pages that match what the CMS can build and ship to the live site. It's owned by the IBM.com design team.
I joined the team as a UI/UX design intern, tasked with bringing the kit back in line with production.
1.8k+
Weekly instance inserts
40+
Teams using the kit
The problem
The Figma kit only works if it mirrors the CMS as closely to 1:1 as possible. By the start of my internship, it had drifted in two ways:
New components were missing. Components onboarded into AEM since late 2025 had no counterpart in the kit.
Global updates lived only in code. Starting Apr. 2026, global UI changes were made directly in code and never reached the kit.
Those global updates came from research. Before my internship, the IBM.com design team ran secondary research and identified a set of quick, site-wide changes to improve the UX (i.e. rounded corners, better vertical spacing, more margins between elements, etc.).
Designers were building from components that no longer matched what shipped, which undercut the kit's reason for existing.
8+
Months of misalignment between design and production
Approach
I worked with two other interns on this project. As a designer who thinks in systems and has a background in code, I naturally gravitated toward leading the whole group to align the system, working directly with the design technologists who were updating existing components and building new ones in code.
Updating the existing components to reflect the global changes was necessary, but the real work was building new ones from the ground up. We approached the kit as a product, with IBM's designers as its users:
Mirror the system. We followed the kit's existing best practices so new components felt native.
Stay aligned with code. We built alongside the design technologists' AEM implementations, so what designers insert is what ships.
Design with the users. I led feedback meetings with designers who use the kit and those who had worked on it, presenting each implementation and folding input back in.
New components
We built 15 new components from the ground up, each with configurable variants.
New components
New components from the Figma kit, as they appear live on IBM.com
Outcomes
The Figma kit is back in line with production. We closed 8+ months of misalignment in under two sprints, so designers can build with components that match what ships to IBM.com.
76
Existing components updated
15
New components built from scratch
300+
Configurable variants across the new components
<2
Sprints to complete