Design System maintenance over time
Design software has evolved exponentially over the past few years and it doesn't look like it plans to slow down.
A few years ago, designers would manually configure each variant in the right-hand panel (preferred design software at that time: Sketch), then take all specifications across to another document (preferably: Confluence; probably: Microsoft Word) to prepare for development handover.
For example, a single line of text "Component title", would need the following seven text styles prepared;
- Typeface
- Type weight
- Type size
- Type style
- Type colour
- Type alignment
- Type anchoring
This process was tedious and came with great time cost. Everyone knew about the duplication of effort when speccing designs for development, but no one knew what to do about it.
If someone could come up with a way to systematise UI specifications so they’re all documented in one place, we’d find harmony between design and technology.
Cue, tokens.
Tokens are visual design attributes that act as a single source of truth for consistent design across platforms and technologies, bridging the gap between design and code.
Post production is no longer an afterthought now that design systems have moved toward tokens.
Post-production typically addresses elements that were not prioritized in the initial release, such as accessibility and scaling to additional operating systems, platforms, brands, and modes. This could present a significant challenge for product design if the initial implementation did not consistently adhere to the design system. Close collaboration with the design system during a transformation project from the outset is crucial to scaling a digital product.
A fully tokenised Design System enables design teams to update multi brand themes, operating systems, and light or dark modes with a single switch. Since designs are fully integrated with tokens, teams will only need to prepare one file for their development team, as all other platform considerations are automatically handled by the system.
Could it get better? Yes, with Generative UI, if design tokens are 1:1 mapped with development, developers will only need to read front-end code, as generative UI will be using tokens to write it.
Cue, Generative UI...