Duration 2 days – 14 hrs
Overview
This hands-on training program is designed for UX/UI teams seeking to enhance their workflows using Figma’s latest features: Slides, Draw, Make (AI tools), and Sites. Participants will learn how to efficiently prototype, present, illustrate, and publish using these tools. The course also focuses on Figma Dev Mode to streamline design handoff to developers and QA teams, manage iterative changes, and align cross-functional teams on a shared design system.
Objectives
- Utilize Figma Slides for impactful UI presentations.
- Create visual assets using Figma Draw.
- Leverage Figma Make for design ideation and automation using AI.
- Design and publish prototypes using Figma Sites.
- Work efficiently in Figma Dev Mode to support developer and QA collaboration.
- Integrate the new tools into the existing Figma Design System workflow.
- Optimize design-to-development handoff and version tracking.
Audience
- UX/UI Designers
- Product Designers
- Front-End Developers
- QA Analysts
- DesignOps and Design Leads
Prerequisites
- Basic to intermediate Figma experience
- Familiarity with UX/UI design principles
- Understanding of design system components is a plus
Course Content
Day 1 – Enhancing Design Capabilities with New Figma Tools
Introduction to Figma’s New Features
- Overview of Slides, Draw, Make, and Sites
Figma Slides for Presentations
- Creating UI decks and user journeys
- Team review and versioning
Figma Draw for Graphics & Illustration
- Sketching ideas, iconography, and annotations
- Using vector tools and pen improvements
Figma Make (AI-Powered Design Assistance)
- Auto-generating components and layouts
- Using AI for ideation, content, and mockups
Figma Sites: Design-to-Web Publishing
- Building simple internal pages and mock microsites
- Linking design systems with published pages
Day 2 – Dev Mode, Workflow Integration & Handoff
Figma Dev Mode Deep Dive
- Interface overview and toggles
- Inspecting assets, specs, and CSS
Streamlining Design-to-Dev Handoff
- Developer and QA workflows
- Interactive specs and documentation
Managing Changes and Feedback Loops
- Version history and branching
- Commenting and resolving issues
Integrating the New Tools into Team Workflow
- Best practices for cross-functional collaboration
- Use cases in real project scenarios
