Skip to courses
✦ Learn & Grow
Technology & Digital Skills

Responsive Design, Constraints, Auto Layout, and Design Systems

Responsive Design, Constraints, Auto Layout, and Design Systems is a course in UX/UI Design with Figma: From First Sketch to Polished Prototype. 10 lessons covering Understanding Constraints for Responsive Design; Auto Layout Deep Dive—Padding, Spacing, and Direction; Building Responsive Cards and Lists with Auto Layout.

10 published lessons · Online learning · Part of Learn & Grow

View the curriculum here. Sign in to access lessons under your learning plan.

What this course covers

  1. Understanding Constraints for Responsive Design · 15 min
  2. Auto Layout Deep Dive—Padding, Spacing, and Direction · 15 min
  3. Building Responsive Cards and Lists with Auto Layout · 15 min
  4. Advanced Auto Layout—Resizing, Wrapping, and Nesting · 15 min
  5. Designing for Multiple Screen Sizes—A Mobile-First Workflow · 15 min
  6. Component Properties—Variants, Instance Swaps, and Text Overrides · 15 min
  7. Organising Styles and Assets for a Scalable Design System · 15 min
  8. Building a Mini Design System—Colour, Type, and Components · 15 min
  9. Documenting Your Design System for Teams · 15 min
  10. From Design to Handoff—Exporting Assets and Inspecting Code · 15 min

Continue your learning path

This course belongs to UX/UI Design with Figma: From First Sketch to Polished Prototype. Explore the full academy to see the other courses in this learning path.

How to get started

  1. Create your Learn & Grow account or sign in.
  2. Review the available access plans and choose the academy you need.
  3. Work through the lessons and activities in your learning dashboard.

Contact support if you need help choosing the right learning path.

Scroll to Top