Who it's for
Designed around these roles
Design leads, UX/UI teams, front-end engineers, product owners and delivery leaders working across digital products.
Purpose
Give design and engineering a shared basis for building the experience.
Move beyond handing over screens. Clarify reusable patterns, component behaviour, decisions and responsibilities so design intent can be discussed and evaluated through delivery.
- Best for
- Design leads, UX/UI teams, front-end engineers, product owners and delivery leaders working across digital products.
- Planned outputs
- 3 draft outputs for your team to review
- Topics
- 6 topics of learning and practice
- Formats
- Online, Onsite, Hybrid
- Engagement
- Standalone workshop or a module in a wider engagement
At a glance
Why teams take this workshop
Challenges this workshop addresses
Screens handed over without behaviour or states
Inconsistent patterns across products
No owner for shared design assets
How the workshop works
From your challenge to working material
Follow how the topics build towards each planned output. Select a stage or a topic to step through it.
Learning outcomes
What your team leaves with
The outputs below are proposed workshop deliverables: drafts and working tools for your team to review and develop. Final scope is agreed before an engagement. Business results depend on subsequent decisions, implementation and context.
- Output 1A draft component and pattern inventory for a defined product area.
- Output 2A handoff checklist covering states, behaviour, content and implementation questions.
- Output 3A proposed contribution, review and maintenance workflow.
Workshop outline
Topics and the outputs they feed
The outline below shows the learning scope. Sequence, depth and timing are agreed during scoping.
| Session | Topic | Builds towards |
|---|---|---|
| 01 | Design-system purpose, scope and users | A draft component and pattern inventory for a defined product area. |
| 02 | Components, patterns, tokens and documentation | A draft component and pattern inventory for a defined product area. |
| 03 | Interaction states, content and accessibility considerations | A handoff checklist covering states, behaviour, content and implementation questions. |
| 04 | Design-to-code collaboration and handoff | A handoff checklist covering states, behaviour, content and implementation questions. |
| 05 | Review criteria, quality checks and exceptions | A proposed contribution, review and maintenance workflow. |
| 06 | Contribution models, ownership and maintenance | A proposed contribution, review and maintenance workflow. |
01
- Topic
- Design-system purpose, scope and users
- Builds towards
- A draft component and pattern inventory for a defined product area.
02
- Topic
- Components, patterns, tokens and documentation
- Builds towards
- A draft component and pattern inventory for a defined product area.
03
- Topic
- Interaction states, content and accessibility considerations
- Builds towards
- A handoff checklist covering states, behaviour, content and implementation questions.
04
- Topic
- Design-to-code collaboration and handoff
- Builds towards
- A handoff checklist covering states, behaviour, content and implementation questions.
05
- Topic
- Review criteria, quality checks and exceptions
- Builds towards
- A proposed contribution, review and maintenance workflow.
06
- Topic
- Contribution models, ownership and maintenance
- Builds towards
- A proposed contribution, review and maintenance workflow.
Engagement paths
Two ways to run this workshop
Our team will discuss the current design and engineering workflow and include the perspectives needed to make the exercises useful.
Standalone workshop
Use a collaborative workshop to assess one product area and draft a workable design-to-development agreement. Building a complete design system is outside this workshop scope.
Related