In Part 2 of the Figma UI UX Design Essentials series, you’ll take your design skills to the next level by learning how to build clean, flexible layouts and reusable components. With Dan Scott as your instructor, you’ll move beyond the basics and explore powerful features like Auto Layout, Constraints, and Component Variants—tools essential for designing responsive, scalable UI.



Figma UI UX Design Essentials Pt.2: Layout & Components
This course is part of Beginner: Figma UI / UX Design Essentials Specialization

Instructor: Skillshare
Access provided by L'Oréal
Skills you'll gain
Details to know

Add to your LinkedIn profile
5 assignments
July 2025
See how employees at top companies are mastering in-demand skills

Build your subject-matter expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate

There are 5 modules in this course
Discover how to build flexible, adaptive UI layouts using Figma’s Auto Layout and constraints. This module introduces tools and techniques for designing interfaces that respond smoothly to screen size changes. You’ll create expanding buttons, combine nested frames, and apply auto-height text—ultimately crafting responsive components that behave predictably across devices.
What's included
7 videos2 readings1 assignment1 discussion prompt
In this module, you'll add visual flair and polish to your UI designs. Learn how to apply shadows, blurs, and neumorphic styling to elevate the depth and realism of your mockups. Through guided examples, you’ll explore how layered effects can help create a more immersive and visually engaging interface, and complete a small project to practice applying these effects consistently.
What's included
4 videos1 assignment1 discussion prompt
Master the building blocks of scalable design systems. This module focuses on creating reusable components, understanding the relationship between main and instance components, and organizing your design system using consistent naming conventions. You’ll also learn best practices for maintaining component libraries across projects and setting up a clean, version-safe workflow.
What's included
7 videos1 assignment1 discussion prompt
Take your design system skills further by creating component variants that support interactive states and form elements. You'll explore both single- and multi-dimensional variants and apply them in real interface components like buttons and forms. By the end of this module, you’ll be able to design flexible, scalable elements ready for real-world application.
What's included
6 videos1 assignment1 discussion prompt
Bring your designs to life with interactive prototypes. This final module teaches you how to build realistic user experiences using Figma’s prototyping tools. You'll work with Flows, overlays, modals, tooltips, and slide-in menus, combining everything you've learned to complete a polished, navigable prototype suitable for user testing or presentation.
What's included
6 videos1 assignment1 peer review1 discussion prompt
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor

Offered by
Why people choose Coursera for their career





