A ready-made Figma library for common IBM AI use cases
Role:
UX/UI Designer
Client:
IBM
Industry:
Technology
Date:
Result:
Live
Key Responsibilities
- UX/UI design leveraging IBM Carbon Design system - Continuous iterations collaborating with engineers - Worked in a global team across timezones (UK, US, FR, IN)
A collection of Figma files containing UI screens for IBM's most common AI use cases, built to eliminate duplicated design effort across IBM's global UX/UI Designer community. The library aligns to IBM's Carbon Design System and has scaled to 300+ designers worldwide - reducing prototype delivery time from 1.5 weeks to 2 days.
The problem space
300+ UX/UI designers across the globe were rebuilding the same UI patterns for common AI use cases from scratch. The result was duplicated effort and an untapped opportunity to move faster.
The question became: could we build a reusable library of Carbon-aligned Figma templates for the most common AI use cases - one that would let any designer move from brief to high-fidelity prototype in days, not weeks?
Our target user
Through user research conducted globally, we found that users span a wide spectrum of Figma confidence, from those who avoid the tool entirely to seasoned practitioners who simply want a faster starting point.
One insight held true across the spectrum: the blank screen is the biggest barrier. This meant the library needed to work for everyone - structured enough for low-confidence users to feel immediately oriented, and fast enough for experienced designers to move without friction.
The design scope
Through interviews of designers globally and an audit of existing Figma work across engagements, we identified five AI capability patterns that came up repeatedly across client projects, regardless of industry or region. Each use case became its own Figma template. I co-led the AI Content Summarisation template alongside a fellow UX/UI Designer.
Research insights to design decisions
Every design decision was a direct response to a real designer pain point - here's how research shaped what we built.
What we built
A Figma template library covering five common watsonx AI use cases - ready to customise, prototype, and hand off to developers.
Each file contains:
1. Cover
2. Read me - Short description of the use-case
3. Asset Template - A simple template & an annotated version with component descriptions and states
4. Example(s) - Sample screens and prototypes of the template being adapted
