---

A design system brings designers, developers, and products together. It is a platform to identify, decide on, and document what to share, whether a visual style, design patterns, front-end UI components, and practices like accessibility, research, content strategy.

This workshop exposes you to essential foundations of the features, tools, and practices involved — to equip you with techniques and activities to harden, spread, and sustain a system yourself.

We’ll cover foundations from visual style and UI component design to technical and collaborative practices that get designers and developers to work together to make a robust, high-quality system together.

In This Workshop, You'll Learn:

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

• Dig into style like color, typography, space and size,
• Encode visual style in design tokens,
• Compose components — from atomic elements to sophisticated patterns,
• Deliver high quality, well tested features that adopters trust,
• Run a workflow that combines design, code, and documentation
• Document design and code in a way designers and devs value.

Why You Should Attend

All too often, organizations have multiple products that are disjointed and inconsistent. Many teams duplicate work, resulting in a customer journey that’s meant to be cohesive but ends up expensive or impossible to align and evolve together.

With a design system, your teams can align their work across design, code, and documentation tools. Design systems save organizations time and money and foster positive energy among those who value efficiency and reuse.

Using a design system as a backdrop, designers, developers, and product teams align and bridge gaps across a portfolio. All of that leads to the ultimate goal: creating a cohesive, high-quality experience for your customers delivered more efficiently.

Nathan has contributed to or consulted with over 60 design systems over his career, including leading emerging and established teams through major releases. He’ll bring deep knowledge with a nuanced understanding of how systems work in companies of varying scale, business types, and organization models.

Who Should Attend

Designers, front-end developers, product managers, content strategists, their leadership, and anyone interested in learning how to inject design systems into their broader organization. Content will evoke both design and code considerations, at times together, to bridge disciplines to share visual style, UI components, and documentation.

What Hardware/Software Do You Need?

Hand-on activities are collaborative as a team and at the classroom level on using pens, paper, Post Its and other similar materials. Additionally, you will need access to Figjam via a laptop to participate in other activities. You will not use design tools (such as in Figma or Sketch) or code in a code editor.

About Nathan

Nathan co-founded EightShapes with Dan Brown in 2006. He’s passionate about information architecture, UX, front-end dev, and leads design systems consulting at EightShapes. He wrote Modular Web Design in 2009, blogs frequently on Medium.com today, and speaks regularly at events worldwide.

Time & Location

This full-day workshop will take place the day after SmashingConf. The workshop will be running from 9:30 AM to 5:30 PM on Wednesday, September 7.

Schedule for Wednesday, September 7

9:00 AM – Doors open, Registration
9:30 AM – Introduction & Kick-off
11:00 AM – Coffee Break
1:00 PM – Lunch
2:00 PM – Afternoon Session
3:30 PM – Coffee Break
5:30 PM – The End

Save 100 EUR when signing up for the conference and a workshop!