Internship
Student login
← Full Stack Mobile App Development learning path
Full Stack Mobile App Development · Module 2 of 10

UI design for mobile

Design usable, attractive mobile screens.

📖 Key ideas

  1. Follow Material Design (Android) and Human Interface Guidelines (iOS).
  2. Touch targets at least ~48dp.
  3. Clear navigation: bottom tabs, stack screens, drawers.
  4. Design for different screen sizes and dark mode.
  5. Prototype in Figma before coding.
💡 Real-life example: Mobile UI is designing a pocket-sized shop: everything must be easy to reach with one thumb.
Material DesignGoogle's design system
HIGApple Human Interface Guidelines
Touch targetTappable area size
FigmaDesign/prototyping tool