Figma

8 topics

• The Basics Most Designers Skip
• Frames vs Groups: The Real Difference
• Layer Hierarchy That Matters
• Selection and Keyboard Shortcuts for Speed
• Constraints Before Auto Layout
• The Properties Panel: Features We Ignore
• Multiple Files vs One Big File
• Performance: Why Files Slow Down and How to Avoid It

8 topics

• Auto Layout as a Mindset, Not a Feature
• When to Use, When to Avoid
• Padding, Spacing, Alignment as Design Language
• Nested Auto Layout
• Wrap Behavior
• Min and Max Width and Height
• Auto Layout vs Absolute Positioning
• The 80/20 of Auto Layout

8 topics

• Component vs Instance vs Variant
• Component Thinking: What Deserves to Be a Component
• Variants Systems
• Boolean Properties
• Instance Swap
• Component Overrides That Matter
• Component Composition
• Maintaining a Component Library

8 topics

• Variables as Design System Foundation
• Color Variables
• Number Variables
• String Variables
• Boolean Variables
• Modes: Dark Mode, RTL, Multi-Brand
• Variable Scoping
• Variables vs Styles: When What

8 topics

• Styles vs Variables: The Difference
• Color Styles
• Text Styles
• Effect Styles
• Grid Styles
• Building a Token System From Figma
• Token Naming Conventions
• Exporting Tokens for Development

8 topics

• Build a responsive landing page using only Auto Layout (no manual sizing)
• Create a component with 5 variants and 8 boolean properties
• Build a design system foundation (colors, type, spacing) using variables
• Recreate a real app screen with proper Auto Layout structure
• Build a prototype with interactive components and variables
• Audit a Figma file: is the structure right? Auto Layout proper?
• Build a component library for a small project (10 components minimum)
• Set up Dev Mode for a real screen ready for handoff

8 topics

• How Linear Designs in Figma
• The Stripe Component Library on Figma Community
• How Material Design 3 Is Organized in Figma
• The Apple Design Resources Figma File
• How Agencies Structure Client Files
• The Vercel Design System in Figma
• The Notion Design Library
• Inside Figma's Own Figma File

6 topics

• Live Figma audits with community
• Component design walkthroughs
• Auto Layout debugging sessions
• Variables workshop
• Prototyping demos
• Plugin recommendations and demos

8 topics

• Prototyping Levels: Simple, Interactive, Advanced
• Smart Animate
• Interactive Components
• Variables in Prototyping
• Conditional Logic
• After Delay and Triggers
• Prototyping for Usability Testing
• When to Use Figma, When to Use Another Tool

8 topics

• Dev Mode Is Not Preview Mode
• Setting Up Dev Mode Properly
• Annotations
• Measurements
• Code Export Options
• Tokens and Variables in Dev Mode
• Communicating With Developers via Figma
• The Handoff Workflow

8 topics

• Real-Time Collaboration vs Async
• Comments and Conversations
• Branching
• Merging Branches
• Library Publishing
• Working With Locked Files
• Team Library Management
• Permission Systems

8 topics

• Plugin Ecosystem Overview
• Plugins Every Designer Should Have
• AI Plugins
• Productivity Plugins
• Design System Plugins
• Animation Plugins
• Custom Plugin Development (Overview)
• Widgets vs Plugins

8 topics

• Design System in Figma as a System
• Library Architecture
• Foundation Tokens
• Component Library Structure
• Documentation in Figma
• Version Control
• Adoption Metrics
• Maintaining the System Over Time

8 topics

• FigJam vs Figma: When What
• Discovery Workshops
• Wireframing in FigJam
• User Flow Mapping
• Brainstorming Sessions
• Client Collaboration
• Templates for FigJam
• FigJam in the Research Phase

8 topics

• Figma Make: What It Is and How It Works
• AI Features in Figma
• Make.com Integration
• The Future of Figma and AI
• Image Generation From Figma
• Code Generation
• Auto-Complete Features
• When to Use AI Features, When Not To