Page MenuHomePhabricator

Define and document the visual guidelines for styles/design tokens of the Codex design system in Figma
Closed, ResolvedPublic5 Estimated Story Points

Description

Background

In order to build our design system on top of a solid visual foundation that enables the application of consistent, predefined styles, we need to consolidate and document its articulating design guidelines. Visual guidelines have a strong impact on design tokens (T293127), since tokens names and values are directly dictated by said principles.

User stories

As a designer, I need to have access to the foundational visual principles of the system, so I'm able to reproduce systematic decisions related to colors, spacing, typography, etc. when designing components and creating other system-compliant designs.

Conditions of Satisfaction

All the visual guidelines of the design system are consolidated and documented in the Figma library.

Design spec

Done

Consolidate and document in Figma the system's tokens for:

Notes

It still needs to be decided whether we also want to document the system's visual principles in an external resource (whether that would be the system's demo page or the Design style guide).

Defining a Layout grid for the system (see T90687) is out of scope for this particular task due to its blocking complexity.

Related Objects

StatusSubtypeAssignedTask
Duplicate STH
InvalidNone
ResolvedVolker_E
ResolvedNone
Resolvedbmartinezcalvo
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
Resolvedldelench_wmf
ResolvedVolker_E
Resolved EUdoh-WMF
ResolvedSarai-WMDE
ResolvedDAbad
ResolvedVolker_E
Resolvedbmartinezcalvo
Resolved KieranMcCann
OpenNone
DuplicateNone
ResolvedVolker_E
ResolvedDAbad
ResolvedVolker_E
ResolvedDAbad
ResolvedSarai-WMDE
ResolvedCatrope
OpenNone
Resolvedovasileva
ResolvedBUG REPORTVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedSarai-WMDE
ResolvedVolker_E
Resolvedbmartinezcalvo
ResolvedCatrope
ResolvedDAbad
ResolvedVolker_E

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes
Sarai-WMDE renamed this task from Define the visual guidelines of the Codex design system in Figma to Define and document the visual guidelines of the Codex design system in Figma.Nov 18 2021, 3:16 PM
Sarai-WMDE updated the task description. (Show Details)
Sarai-WMDE added a subscriber: bmartinezcalvo.
STH changed the status of subtask T300562: Define Border tokens from Open to In Progress.Apr 26 2022, 12:54 AM
STH changed the task status from Open to In Progress.May 26 2022, 5:03 PM
bmartinezcalvo updated the task description. (Show Details)
bmartinezcalvo updated the task description. (Show Details)
ldelench_wmf set the point value for this task to 5.Oct 24 2022, 3:33 PM
bmartinezcalvo changed the task status from In Progress to Stalled.Oct 24 2022, 4:30 PM

Moving this task to blocked since we need to close first Typography T296998 and Grid T298198

Volker_E renamed this task from Define and document the visual guidelines of the Codex design system in Figma to Define and document the visual guidelines for styles/design tokens of the Codex design system in Figma.Dec 8 2022, 5:22 AM
bmartinezcalvo updated the task description. (Show Details)

As decided in our last DST meeting Grid will not be part of our tokens in code so removed from this task since Grid will be added as Figma styles but not as tokens.

Resolving this task since all the rest acceptance criteria was done.