Скачать с ютуб Building an automated multi-brand token workflow - Behind the System в хорошем качестве

Building an automated multi-brand token workflow - Behind the System

Recording of the first Figma Tokens livestream on the 25th of August 2022. Behind the Systems: Building an automated multi-brand token workflow by Chris Kerr & Nicole Duncan. 🚀 Subscribe to our channel: https://www.youtube.com/@TokensStudio... 💡 Install on Figma: https://www.figma.com/community/plugi...) 💬 Join our Slack: https://tokens.studio/slack 📄 Docs at: https://docs.tokens.studio/ ℹ️ More information on https://www.tokens.studio Contents 00:00 - Welcome 02:11 - Intro 03:55 - How we started our journey 05:28 - Challenges 07:42 - Next step 09:05 - Figma setup 10:35 - In the (Figma) file 23:32 - A look at our Theme library - The tokens, how we use Figma Tokens and our workflow from Figma to Github 29:30 - How we made icons an integrated part of our tokenised solution 37:00 - Our core components and how we apply non-local styling in the library 47:43 - In the code 49:42 - Transforming Figma Tokens JSON into working CSS 51:48 - Our Icon component and how we turned the icon tokens into rendered icons using Font Awesome 55:41 - Q&A 56:26 - How do you deprecate old tokens? What happens in the design files that referentiate old tokens? How do you manage coexistence of deprecated tokens with current tokens in a system? 58:48 - Very pro setup. How do you onboard / teach other designers? To use or create tokens / components themselves? Do you document how to set something like this up? 01:01:51 - Do you support dark/light color schemes in your system? And if so, how? 01:03:23 - How long did it take you to set this up and how did you convince stakeholders to get budget for it? 01:06:34 - So all styles are in 1 library here. How would you do this if your Brand 1 and Brand 2 each have their own published libraries of styles? How would you link token styles to external libraries? 01:09:10 - Does the design team use the Figma Tokens plug in their workflow? To switch brands 01:11:33 - In the component tokens why do you reference 'color' before 'button' instead of the other way around? 01:14:25 - With a text style being used for fonts, how do you handle unique icons that are not handled by the font? 01:16:52 - Do the seed colours fall into their associated colour ramp? 1:18:14 - Ending