Figma Tutorial Variants

>> YOUR LINK HERE: ___ http://youtube.com/watch?v=y29Xwt9dET0

Figma is free to use. Sign up here: https://bit.ly/3msp0OV • Variants reduce the complexity of your design system, makes it easier to find components, and maps your design components more closely to code. In this video we'll teach you how to create and use variants and component sets. • Learn how to use interactive components here: https://bit.ly/3mhWRx4 • Learn more on our Help Center: • Prepare for Variants: https://bit.ly/35IIIPV • Create and Use Variants: https://bit.ly/35FVxdH • Read the variants blog post: https://www.figma.com/blog/bridging-d... • Watch the Config Europe keynote highlights: • Config Europe 2020 - Keynote Highligh... • #Figma #FigmaTutorial #Variants #Components • Timestamps: • 0:00 Introduction • 0:30 Define component sets, variants, properties, and values • 0:58 Multi-dimension component sets, and map to code • 1:47 Combine components as variants • 2:05 Publish component sets to a library • 2:19 Using and configuring variants • 2:41 Step-by-step demo (checkbox component set from scratch) • 3:22 Adding variants to a single Component • 3:46 Naming syntax (property=value) • 5:05 Rename values • 5:29 Non-unique combination errors and how to fix it • 5:40 Rename properties • 6:23 Using and configuring variants from Assets panel • 7:14 Add new variants to a component set • 7:56 Boolean values, binary toggle switch • 8:40 Adding another property / dimension • 10:37 Instance swapping and component sets • 11:03 Publish component sets to a library • 12:08 The slash naming convention to create variants quickly • 12:58 Use the slash naming convention at a large scale • 14:01 Outro • Fluffy by Smith The Mister https://smiththemister.bandcamp.com • Smith The Mister https://bit.ly/Smith-The-Mister-YT • Free Download / Stream: https://bit.ly/stm-fluffy • Music promoted by Audio Library • Fluffy – Smith The Mister (No Copyrig...

#############################

New on site