Figma Training
A hands-on day in Figma for people who need to work in the tool properly, not just open it. You will build a small interface from scratch and leave with reusable components, a working prototype, and files a developer can actually pick up. No prior Figma experience is assumed.
Getting Productive in Figma
The Figma Workspace
Files, pages, frames, and layers. Keyboard shortcuts and habits that save hours later.
Layout and Constraints
Grids, alignment, and constraints so screens hold up when they are resized.
Auto Layout
The single biggest time saver in Figma. Padding, spacing, direction, and nesting, applied to real components.
Styles for Colour and Type
Set up text and colour styles once, then change them everywhere in a click.
Components and Design Systems
Components and Instances
Build once, reuse everywhere. What overrides do, and why instances detach when you least expect it.
Variants and Properties
Collapse a dozen button states into one component with clean, readable properties.
Variables
Modes for light and dark, spacing tokens, and swapping themes without redrawing anything.
Shared Libraries
Publish a library, consume it in another file, and handle updates without breaking your team's work.
Prototyping and Handoff
Interactive Prototyping
Links, overlays, and smart animate. Building a flow that behaves closely enough to test with a real person.
Conditional Logic and Variables in Prototypes
Move past static click-throughs: counters, toggles, and state that persists across screens.
Developer Handoff
Dev Mode, inspecting specs, annotations, and exporting assets so engineering is not left guessing.
Working with Others
Comments, branching, version history, and file structure that survives more than one contributor.
Learning Outcomes
By the end of the day, participants will be able to:
Navigate Figma confidently and work at speed with shortcuts and sensible file structure
Build responsive layouts using Auto Layout, grids, and constraints
Create reusable components with variants and properties
Use styles and variables to manage colour, type, spacing, and theming
Publish and consume a shared library across files
Build an interactive prototype, including basic conditional logic
Prepare files for developer handoff using Dev Mode
Collaborate in a shared file without overwriting other people's work
Fee: RM2800 per pax
Minimum enrolment: 1 participant
Duration: 1 Day (8 Hours)
Level: Beginner to Intermediate (no prior Figma experience required)
Tools: Figma (free account is sufficient)
Delivery: In-house, live online, or hybrid
HRD Corp Claimable
Certificate included