Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Multi-Brand Design System and Figma Variable Setup | Full Tutorial
Play lesson

Design Systems - Multi-Brand Design System and Figma Variable Setup | Full Tutorial

5.0 (2)
28 learners

What you'll learn

This course includes

  • 28.5 hours of video
  • Certificate of completion
  • Access on mobile and TV

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

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere