Manuals / Figma / Ch 1

StartBeginner20 min read

1. How to use this Figma path

Figma · 52 pages source format

Figma is the industry default for product UI. This path goes frames → Auto Layout → components → variants → variables → libraries → handoff. Do every exercise in one “Figma Journey” file unless noted.

What you'll learn

  • 2–3 week pace
  • File hygiene habits
  • Keyboard shortcuts worth learning day 1

Pace

2–3 weeks at 1–2 hrs/day. Week 1: layout. Week 2: components + variables. Week 3: libraries + handoff.

Do this now

Duplicate Figma Community “Simple Design System” file as reference — do not merge with your exercises yet.

Clear?

File hygiene

Pages: Cover, WIP, Components, Archive. Name layers. Future teammates will judge you on this.

  • Rename layers (no “Frame 427”)
  • Use pages for separation
  • Publish components only from Components page

Do this now

Create file with those 4 pages. Enable “Outline icons” and “Snap to geometry” in preferences.

Clear?

Checklist