Premium Workshop: Architecting Design Systems

Workshop details:

Workshop summary

A design system brings designers, developers, and products together. It is a platform to identify, decide on, and document visual styles and front-end UI components.

This workshop exposes you to essential foundations of design system architecture — the naming, composition, configuration, and process challenges involved — to equip you with techniques and activities to harden, spread, and sustain a system yourself.

You’ll learn all the fundamentals, from design tokens and UI component design to collaborative processes that get designers and developers to work together to make a robust, high-quality system.

What will attendees learn?

This workshop will engage participants in hands-on activities, spark new ideas, and moderate challenging conversations so your team can:

• Dig into visual style and design tokens with a focus on colour.
• Compose and arrange elements in a component — from atomic elements to sophisticated patterns.
• Configure and organise component properties.
• Establish a workflow that combines design, code, and documentation.

Who is the workshop for?

Designers, front-end developers, product managers, content strategists, their leadership, and anyone interested in learning how to craft design systems features.

The workshop will evoke both design and code considerations (at times together) to bridge disciplines and blend visual style, UI components, and documentation.

What are the attendee requirements?

To get the most out of the workshop, you’ll need a laptop to access FigJam (for hands-on activities) and a Google Doc (also shared as a PDF) with links to the course materials. However, you will not use design tools (e.g. Figma or Sketch) or code in a code editor. Instead, you’ll participate in FigJam activities as an individual, in teams, or with the entire classroom all together.