Speed up your design process when creating your style guides for eLearning or instructional design projects. Download the free Figma keyboard shortcuts job aid: https://www.devlinpeck.com/forms/figm...

Visual design is difficult for a lot of instructional designers, but it's so much easier when you create a style guide.

As Sabrina Gonzales says, "designing visuals without a style guide is like playing a board game without any rules."

The style guide gives us the rules and guidelines so that we can make visual design decisions quickly and easily.

It takes a bit of upfront work, but it can save you so much time (and so many headaches) in the long run.

In this video, Sabrina shows you how to create style guides in Figma for instructional design projects so that you can calm the chaos of design and provide stakeholders with exactly what they need.

Check out the full Figma tutorial playlist here:    • Figma Tutorials for Instructional Des...  

Looking for graphics to include on your style guide? Head over to https://www.freepik.com and watch the "Where to Find Graphics for eLearning" here:    • Where to Find Graphics for eLearning ...  

Download fonts for free from Google Fonts: https://fonts.google.com/

Try this contrast checker from WebAIM: https://webaim.org/resources/contrast...

Using the affiliate links below will help support me and the content on this channel:

**Best AI Tools for Instructional Designers**
Synthesia: https://www.synthesia.io/?via=devlin
WellSaid Labs: https://www.wellsaidlabs.com/?via=devlin
Descript: https://www.descript.com/?lmref=jJTSTA
Jasper: https://jasper.ai/?fpr=devlin44

**Best Laptops for Instructional Designers**
Dell XPS 13: https://amz.run/6l1w
16inch MacBook Pro: https://amz.run/6l1y
Gigabyte Aero 17: https://amz.run/6l26

**Best Books for Instructional Designers**
The NonDesigner’s Design Book: https://amzn.to/3kP0reO
Map It: https://amzn.to/3f137mR
eLearning and the Science of Instruction: https://amzn.to/3kNuBiF
Design For How People Learn: https://amzn.to/3CLtrNM
Michael Allen’s Guide to eLearning: https://amzn.to/31ZUbJB

0:00 Intro
1:46 Why Figma for Style Guides?
3:16 Style Guides in the ID Process
4:05 The Mood Board
4:48 Style Guide Elements
7:03 Colors
10:16 Typography
17:35 Buttons
23:39 Optional Elements
28:09 Wrap Up