Design Tokens with Figma Variables
4.6 (19)
10 Days
·Cohort-based Course
Learn how to work with Figma’s powerful variables for design systems.
Design Tokens with Figma Variables
4.6 (19)
10 Days
·Cohort-based Course
Learn how to work with Figma’s powerful variables for design systems.
Graduates at
Course overview
Set design foundations to improve your workflows
Variables aren’t just for developers anymore! Now, from the comfort of our design workspace, we can unlock the power of more adaptive and flexible design. Boost your designs by adding support for light, dark, and high contrast color modes. Improve usability by supporting multiple densities.
Take your designs to a whole new level with fewer headaches and more precision. Why should developers get to have all the power (and fun)?
The course is designed to fit your busy schedule. We meet for 8 hours total—4 sessions of 2 hours each.
Mondays and Wednesdays
July 22, 24, 29 & 31
9:30am – 11:30pm Pacific
12:30pm – 2:30pm Eastern
6:30pm – 8:30pm CET
Who is this course for
01
Junior designers who want to get ahead of the curve and stand out from the crowd
02
Seasoned designers who are looking to up their game and support new capabilities in their products
03
Senior designers looking to take their learnings back to their teams
What you’ll get out of this course
Use color variables like a pro
Build color palettes that differentiate between primitive color values, semantic colors, and component-specific colors.
Use numbers to define spacing and sizing systems
Stop pixel-pushing and start using a system that translates more immediately to the implementation of your designs.
Integrate variables into a system of typography styles
Make your typography styles more powerful using variables to support responsive design.
Communicate better with developers
Your developers already think in terms of variables and conditional logic. Now you can too without leaving the comfort of Figma!
This course includes
4 interactive live sessions
Lifetime access to course materials
11 in-depth lessons
Direct access to instructor
1 projects to apply learning
Guided feedback & reflection
Private community of peers
Course certificate upon completion
Maven Satisfaction Guarantee
This course is backed by Maven’s guarantee. You can receive a full refund within 14 days after the course ends, provided you meet the completion criteria in our refund policy.
Design Tokens with Figma Variables
Course syllabus
Week 1
Jul
22
Session 1
Jul
24
Session 2
Course Intro
Color modes
Density modes
Week 2
Jul
29
Session 3
Jul
31
Session 4
Typography styles
Design Tokens for Design Systems
Project
Wrap up
4.6 (19 ratings)
What students are saying
What you’ll learn
Nevan shows what you’ll be learning and working on in class.
What people are saying
Héctor Rebollo
Johanna Grimberg
Lina Forero
Sabrina Arcella
Meet your instructor
Nevan Scott
Head of Education at Button School
Nevan has been teaching designers and developers for over a decade, and still loves every minute of it! He’s led programs at General Assembly and Ironhack, and coached designers and developers at every stage of their careers. He’s built design systems for the Swiss Red Cross, Northeastern University, Rustic Pathways, and Buzzfeed.
Be the first to know about upcoming cohorts
Design Tokens with Figma Variables
Course schedule
8 hours over 4 sessions
Live Classes
4 Sessions
We’ll meet live on Zoom for lessons, demos, and small group practice sessions in breakout rooms.
Take-Home Exercises
2 hours
You’ll have exercises to practice with between sessions to enrich your learning and bring more insight to class discussions.
Design Tokens: A Visual Primer
This brief visual guide will walk you through the most essential design tokens and naming conventions for any design system. A great companion to keep at your side as you work through organizing and naming variables in Figma!
Get this free resource
Learning is better with cohorts
Active hands-on learning
This course builds on live workshops and hands-on projects
Interactive and project-based
You’ll be interacting with other learners through breakout rooms and project teams
Learn with a cohort of peers
Join a community of like-minded people who want to learn and grow alongside you
Frequently Asked Questions
Stay in the loop
Sign up to be the first to know about course updates.
Be the first to know about upcoming cohorts