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 project to apply learnings
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—Jul 28
Week dates are set to instructor's time zoneEvents
- Jul
22
Session 1
Session 1
Mon, Jul 22, 4:30 PM - 6:30 PM UTC
- Jul
24
Session 2
Session 2
Wed, Jul 24, 4:30 PM - 6:30 PM UTC
Modules
- Course IntroCourse Intro1 Lesson
- Color modesColor modes2 Lessons
- Density modesDensity modes2 Lessons
Week 2
Jul 29—Jul 31
Week dates are set to instructor's time zoneEvents
- Jul
29
Session 3
Session 3
Mon, Jul 29, 4:30 PM - 6:30 PM UTC
- Jul
31
Session 4
Session 4
Wed, Jul 31, 4:30 PM - 6:30 PM UTC
Modules
- Typography stylesTypography styles2 Lessons
- Design Tokens for Design SystemsDesign Tokens for Design Systems2 Lessons
- ProjectProject1 Project
- Wrap upWrap up2 Lessons
4.6
(16 ratings)
What students are saying
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.
Join an upcoming cohort
Design Tokens with Figma Variables
Cohort 6
$249
Dates
Application Deadline
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
What happens if I can’t make a live session?
I work full-time, what is the expected time commitment?
What’s the refund policy?
Stay in the loop
Sign up to be the first to know about course updates.
Join an upcoming cohort
Design Tokens with Figma Variables
Cohort 6
$249
Dates
Application Deadline