📝 Project LESSON 13 OF 26

Project 1 — Mobile App UI in Figma

⏱️ ~60 min
📝 Project

Your First Complete UI

Design a complete mobile app UI from scratch — onboarding, home, profile, and settings screens.

📝 Project 1 Checklist — Mobile App UI in Figma
Combines Lessons 7–12: components, Auto Layout, and a design system.
  • Onboarding (2–3 screens introducing the app)
  • Home / dashboard screen
  • Profile screen
  • Settings screen
  • Use Figma Auto Layout for at least the nav bar and any card lists
  • Build at least 2 reusable components with variants (e.g. a button with default/hover/disabled states)
  • Apply a consistent 8px spacing system across all screens
  • Use one text style set and one color style set from a shared library
Stretch goal: Link the screens together with basic prototyping so a reviewer can click through onboarding to home.
🗒 Cheat Sheet 📝 Worksheet