How to Make Responsive Web Design in Figma | Step-by-Step Figma Tutorial

Опубликовано: 20 Март 2024
на канале: UX World
913
38

In this video, I will show you how to make a responsive web design in Figma using Auto Layout Wrap and Constraints. I am using the Shopify responsive web design for this tutorial.
#figmaresponsivedesign #figmatutorial #responsivewebdesign

Get the Figma source file:
https://cutt.ly/1w9y8NU1

Happy Learning and don't forget to like, share the video, and subscribe to the UX World channel.

→ Learn UX design with a discount from Industry experts: https://cutt.ly/8wtCOztx
→ Become a UX expert by doing UI/UX specialization from Coursera: https://cutt.ly/EwUqPe13
-------------------------------------------------------------------------------------------------------------------

Watch other popular videos:
Tree Menu Animation in Figma:    • Interactive Tree Menu Animation in Fi...  
UI Design Trends 2024:    • UI Design Trends 2024  
Daily UI Design Challenge:    • Daily UI Design Challenge | Day 01  |...  
Horizontal and Vertical Scrolling in Figma:    • Horizontal and Vertical Scrolling in ...  
Food Ordering Mobile App Design:    • Food App Design in Figma | Figma Tuto...  
E-Commerce Mobile App Design in Figma:    • E-Commerce Mobile App Design in Figma...  
------------------------------------------------------------------------------------------------------------------

Chapters:

[0:00] Preview of responsive design
[0:17] Overview of Shopify design image
[1:50] Making responsive header
[1:35] Making responsive page content
[10:58] Design for Tablet
[15:02 ] Design for Mobile
------------------------------------------------------------------------------------------------------------------

Resources:
Image by rawpixel.com on Freepik
------------------------------------------------------------------------------------------------------------------

Queries:
How to create responsive websites in Figma
Step-by-step Figma tutorial for responsive design
Beginner’s guide to responsive web design in Figma
Responsive web design techniques using Figma
Figma tutorial for designing responsive websites
How to design a responsive website layout in Figma
Creating responsive web pages with Figma
Figma responsive design tutorial for beginners
Mastering responsive web design with Figma
Figma guide for building responsive websites
Responsive Web Design
Figma Web Design
Figma Responsive Design
Figma Website Tutorial
Figma Design Tips
Responsive Design Tutorial
UI/UX Design
Web Design in Figma
Figma Layout Design
Figma Tips and Tricks