Design system MVP - Githubissues

wellcomecollection / wellcomecollection.org

🪟 Wellcome Collection's website and services that support it

https://wellcomecollection.org

MIT License

37 stars 5 forks source link

Design system MVP #10917

Closed davidpmccormick closed 5 days ago

davidpmccormick commented 1 month ago

[x] Create repo
[x] Sync Tokens Studio tokens from Wellcome Figma with repo
[x] Set up style dictionary actions(? maybe not even necessarily MVP)
[x] Create npm module
[x] Import/use module somewhere

davidpmccormick commented 1 month ago

There's now a repo and an npm package with a very bare-bones set of tokens exported as a JS Object.

And a branch that imports the design system module and uses it to generate spacing values on wellcomecollection.org

Possible work flow

Designer creates styles in Figma
Designer saves styles in Tokens Studio
Designer pushes to GitHub repo through Token Studio ui
Developer pulls from GitHub repo
Developer runs build script in repo and increments package version number
Developer publishes package on npm
Developer tags commit with package version number and pushes back to GitHub
Developer(or bot?) communicates new package available for import with details about the changes

Next steps

Include different transforms for different products (e.g. ones that need css instead of a JS object for styles)
Include TypeScript for design system