Module 10 · 25 min
Frames, auto layout, and components
Figma works in the browser, so the team can share one file. Frames hold screens. Auto layout keeps spacing tidy as content changes. Components keep buttons and inputs consistent.
Why Figma fits this work
- Cloud file — no heavy install required.
- Real-time collaboration — more than one person in the same file.
- Design and prototype in one place.
- Reusable components, variants, and styles.
- Auto layout for responsive structure.
- Dev handoff — inspect, CSS hints, and export.
Build with structure
Start with frames for phone or desktop. Use auto layout so lists and buttons resize with content. Make a component for any piece you will reuse twice.