Get started as a designer Onboarding for the early adopters program.
  • Get access to the experimental Figma libraries.
  • Use experimental libraries to design or evaluate screens in your service context.
  • Provide feedback on what's working, what's not working and what's missing.

Available resources

Figma assets Production Component library Styles, tokens, icons, and guidelines Patterns library Beta Component library BETA Styles library BETA Illustration library BETA Component names are the same in both libraries, which makes library swapping possible. Be aware this can make it harder to tell which library a component came from once it's on the canvas.

Illustrations

The illustration library is a collection of custom GoA illustrations to be used at various points throughout a service. We will continue to update it regularly, so start by checking what's already available. Can't find an existing illustration that fits your scenario? Need a new composition combining existing illustration elements?

Request an illustration If you're unsure, ask in #design-system-early-adopters or bring it to drop-in hours — we'll help you decide the best path.

Designing with the BETA libraries in Figma

Starting a new design

We recommend starting from DS 2.0 templates.

Starting from an existing design

  • Library swap — If your goal is to convert the whole file to DS 2.0, consider trying the library swap approach.
  • Manual rebuild — The slowest approach, but gives you the most control. Consider using starter templates as a base for rebuilding your pages.
 Library swap results can vary. We recommend creating a copy of the file before attempting a library swap.

Updating an existing project

Developer-first

A developer creates a new branch, completes the upgrade steps, and runs the upgraded application. This helps the team quickly see which areas need design updates to align with DS 2.0. When reviewing the upgraded branch, watch for:
  • Spacing and layout rhythm
  • Typography scale/weight usage
  • Screens with dense content or constrained layouts (these will often have the highest risk of "breaking" during the update)

Design-first

  1. Identify custom elements created to support your users' needs.
  2. Create an inventory and prioritize items by importance and effort.
  3. Redesign the highest priority elements using the visual design values from the Styles library BETA.
 This can allow design work to proceed ahead of development rather than being blocked by the version update. In most cases we recommend the Developer-First approach.

File location and sharing

Early adopter Figma files will be collected within the Early adopter project in the Design system workspace to:
  • Facilitate learning from fellow early adopters and the design system team
  • Avoid confusion / chance encounters of experimental assets by practitioners who are not part of the early adopter program