Summary
Keywords
Full Transcript
Managing multiple brands in one design system is about structure and clarity, not duplication. In this video, I walk through how to set up a scalable multi-brand design system in Figma using variables, tokens, and theming strategies that work across different products and teams. You’ll learn: ➡️ The different types of multi-brand design systems ➡️ Where most designers go wrong in their design token setup ➡️ How to handle more complex design systems involving brands with entirely different colors ➡️ Avoid common mistakes that slow down enterprise systems ➡️ How to defend your approach on multi-brand design system implementation This video is for teams managing a portfolio of products or brands who want a clean, scalable system that can grow without becoming chaotic. 👉 Subscribe for more Figma tutorials, design system tips, and full courses 🔗 Links 📣 Support UI Collective: https://uicollective.co/ ❓ Why Join UI Collective Academy? Get access to premium courses, premium downloads, and so much more on the way (I am largely building this solo...trying to make design education available for all, your support goes a long way!) ↪️ Need a design system? (also included in the academy): https://collectivekit.co/ 📽️ Other Videos Build a Design System | Full Course: https://youtu.be/opTANvl9G1g Full Figma Variable & Design System Setup Build: https://youtu.be/L-tpK7Eeuow 🔗 OTHER LINKS 📣 Let us build or fix your design system: https://designsystemlabs.co/ ✉️ kirkland@uicollective.co My LinkedIn (not accurate): https://www.linkedin.com/in/kirk-mcneill-km/ Agenda 0:00 An Introduction 0:53 About Multi-Brand Design Systems 3:25 Branded House Approach Introduction 7:53 Figma Variable Setup Structure Introduction 13:21 Quick Color Scale Build 15:13 Figma Variable Setup 17:03 When Two Brands Share a Same Color Scale 22:33 When a Brand Needs a Unique Color Scale 24:30 Alias Collection & Adding Brands 29:05 Handling Neutral Colors with Multiple Brands 32:55 Alias Collection Continued 34:45 Error Colors in the Wild 35:58 Handling Error Colors within Alias 37:02 Font & Type Tokens 40:29 Mapped Collection Setup Introduction 43:18 Importance of Assigning a Default Color 45:26 Answering a Common Question 47:24 House of Brands Approach Introduction 47:24 Coca Cola Company Example 50:27 Squeezing Brands into the same Figma File 52:25 Swapping Figma Variable Library 54:14 All Collections in One File 56:14 Having a Master Design System 56:59 Master Design System File Setup 58:42 Figma Limitation Ramble 59:54 Holding Variables in a Seperate Collection 1:00:56 Outro
