Figma - Introduction|System Source

Learn to use Figma's comprehensive prototyping tools to make design ideas real. Build or import your designs into this vector application and apply interactivity to demonstrate your clickable project. This one-day Figma course introduces you to concepts to help you take advantage of auto-layout, masking, components, variables, design libraries, and more. This is the perfect Figma course with certificate for beginners and those with experience using Figma but who have never received formal training.

Understanding the Figma workspace
How to work with frames
Using layers
Working with Figma tools
Creating and styling objects om Figma
Understanding auto layout and groups
Working with images
Creating reusable components
Understanding design tokens
Using libraries
Exporting and sharing prototypes

Viewing outline for:

Getting to know Figma
Introduction to the workspace
Understanding atomic design
Working with structure and hierarchy
Understanding frames
Using frames vs auto frames
Frame properties
Building frames to scroll
Adjusting a frame’s bounds
Changing the fill style
Understanding layers in Figma
Grouping and ungrouping
Selecting and moving layers
Viewing, locking, and unlocking layers
Introduction to the tools: Building a simple project
Understanding text containers
Applying auto layout
Adding images
Creating components
Creating links
Create fixed objects in a prototype
Using rulers, grids, and guides
Using Rulers and guides
Smart guide tips and tricks
Using, editing, and saving layout grids
Creating shapes and other objects
Creating custom shapes using boolean features
Transforming and positioning
Creating custom corners
Fills and strokes
Changing the blending mode
Changing multiple colors in selections
Saving colors as styles, variables
Applying stroke properties
Copying and pasting object properties
Applying effects
Blurs and Shadows
Applying multiple effects
Saving styles
Frames vs auto-layout vs groups
Understanding the difference
What drives the selection
Controlling position in responsive frames
Working with images
Editing an image
Cropping and masking
Eliminating selected parts of an image
Placing multiple images quickly
Creating reusable components
Working with text and image overrides
Organizing components
Nesting components
Batch renaming components and other layers
Using design tokens
Creating design tokens
Naming design tokens
Organizing design tokens
Using libraries as design assets
Using renaming features
Saving a library
Editing a library
Sharing a library with your team
Saving & exporting your prototype
Exporting assets
Export Settings
Sharing your prototype
Using plug-ins
Locating and using helpful plug-ins
The course topics serve as an outline. Instructors may adjust content based on the specific needs of each class, such as to answer your Figma questions.

No previous experience with Figma is required before enrolling in this introductory Figma training. This Figma class is perfect for beginners and for those who use Figma but have no formal training. You must have the Figma software to attend this class. Virtual labs are not provided You can purchase the software or obtain a trial version from the Figma website.

Figma - Introduction

Course Overview

Scheduled Classes

What You'll Learn

Outline

Getting to know Figma

Understanding frames

Understanding layers in Figma

Introduction to the tools: Building a simple project

Using Rulers and guides

Creating shapes and other objects

Fills and strokes

Applying effects

Frames vs auto-layout vs groups

Working with images

Creating reusable components

Using design tokens

Using libraries as design assets

Saving & exporting your prototype

Sharing your prototype