Search
  • Skylab design system
  • Skydesigner agent
<
>

bringing polish and velocity to ​a design system 

Project
Transform and scale Avalara's Skylab design system 
Skylab documentation (Opens in a new tab)

My role
Lead design, production, documentation, sequencing, and maintenance

Challenges
The Skylab design system at Avalara was created in 2018 and maintained and broadened by a small dedicated team until the beginning of 2025 when I became its owner.
  • A siloed team with limited resources and a growing backlog struggled to meet Product and design needs.
  • New components took too long to ship due to labor‑intensive documentation processes.
  • The design system wasn’t rooted in real product design scenarios.
  • Work created by product designers wasn’t being effectively leveraged or scaled.
  • Components were built in isolation, resulting in inconsistent visual language and mixed signals.
  • Limited resourcing left component styles stagnant in an evolving UX landscape.

Highlights
  • Streamlined process to:
    • reference a complementary design system created by the company's marketing team, aligning where possible.
    • also reference a shortlist of other leading design systems like Carbon, Material, and Polaris.
    • include the use of AI tools for speedier, deeper analysis and speedier documentation maintenance.
  • Evaluation
    • Performed an audit of the foundations and components and developed a point of view as to overall direction and specific updates to make.
  • Strengthened and built relationships of trust with the product designers, giving them pathways to collaborate and brainstorm as part of the process
  • Created and now maintain the Skydesigner agent that:
    • saves people from having to dig through documentation for specs and guidance
    • delivers design scorecards that facilitate design system consistency and alignment
    • makes creating and maintaining documentation faster and better
  • The Skylab Figma library now aligns properties 1:1 with the SDK in readiness for MCP integration. This update yields production-ready code (from a Skylab perspective) for engineers to work from.
Vertical Divider
A sea change in color
In support of dark mode and scalability, in 2026 all components were updated to use semantic tokens instead of primitives.
Color documentation
Being AI-first
Created a Figma library of patterns and elements to support Avalara's transformation of its product experiences to be AI-first, leading with agentic workflows and chat tools.
Pattern documentation
​

Faster access to answers + powerful screen review

​Skydesigner
A Glean agent trained on the style guide (including content guidelines) and user persona information.
  • Helps designers save time, adhere to guidelines, and build consistent experiences
  • Helps the design system team create and maintain documentation

Skycheck
A feature within the Skydesigner agent. Skycheck is a screen review tool for fast, structured design feedback. Skycheck evaluates screens against the Skylab design system standards: layout, components, interaction, accessibility, content, and persona fit. It uses a strict rubric grounded in real product behavior. Skycheck helps teams move faster while staying aligned with Skylab’s component usage, content standards, and page patterns.
​
How Skycheck works
 • Upload a screen image and request a Skycheck
 • Get a clear scorecard showing alignment and gaps
 • Optional flags highlight missing states or patterns

Bonus feature
Every Skycheck includes an invitation to run a heuristics check based on Nielsen Norman Group’s 10 usability principles. (You can run the checks in either order.)