search

Impactworkers / iw-complaint-manager

Impactworkers Complaint Manager
1 stars 0 forks source link

Set up design tokens/styles prior to UI development #61

Open rnair-tw opened 6 months ago

rnair-tw commented 6 months ago

User Story

As a UI/UX designer, I want to set up design tokens and styles in Storybook before UI development begins So that the user interface is consistent and adheres to our design guidelines.

Definition of Done

  1. Definition of design tokens for colors, typography, spacing, and other style properties: https://www.figma.com/design/Wq8K2KVwa6nckwUhoa462S/Design-Tokens-V1.0?node-id=0-1&t=0YsWH91WeVZU1jxy-0
  2. Documentation in Storybook of design tokens for developers.
  3. Integration of design tokens into the development workflow (DEVs)
  4. Integrate MUI's theming to setup colors, fonts, responsive breakpoints, etc (DEVs)
  5. Establishment of a style guide in Storybook that includes components and their usage.

Acceptance Criteria

Given I am a developer When I start designing the UI Then I should see predefined design tokens in Storybook

Given I am a developer When there are changes or updates to the design tokens Then these changes should be communicated, documented, and reflected in the style guide and codebase

Tech Notes

https://storybook.js.org/addons/@storybook/addon-designs/

rowsnr commented 5 months ago

setting up time with Karhan to test sometime this week