Responsive UX/UI Design in Figma 2h deep dive (2022 Version)

سرفصل های دوره

Deep dive into Figma’s Auto Layout, Constraints and Breakpoints: Responsive setup, testing and design documentation

1. Introduction & Course Material

1. Promo Video

2. About this course

3.1 Download the Figma file to this course here.html

3. Course Material

2. Constraints

1. 01 What are Constraints in Figma

2. 02 Working with Horizontal and Vertical Constraints

3. 03 Constraints and grids

4. 04 Individual grids on component frames

5. A little favour

6. 05 Fix position when scrolling

7. 06 Fun illustrations with constraints

8. 07 Limitations of Constraints

3. Auto Layout

1. 01 What is auto layout

2. 02 Setting up an auto layout frame

3. 03 Where can I apply auto layout

4. 04 The auto layout menu

5. 05 Advanced layout settings

6. 06 Auto layout resizing

7. 07 Building a responsive card with auto layout resize

8. 08 Auto layout components and instances

9. 09 Nesting auto layout frames - Building a navigation

10. 10 Absolute positioning

11. 11 More complex auto layout setups

12. 12 Setting up an entire auto layout page

13. 13 Same height for all children

14. 14 Stacking techniques

15. 15 Limitations of auto layout and their solution

16. 16 Constraints and auto layout comparison

17. 17 Fixed aspect ratio images

4. Breakpoints

1. 01 One design will not work for all sizes Say hi to breakpoints

2. 02 Think of single components adapting, not entire pages!

3. 03 Breakpoints in CSS

4. 04 Which breakpoints should I use

5. 05 Setting up breakpoints in Figma

6. 06 Testing responsive components

7. 07 Documenting responsive components

8. 08 Variant Hack

9. 09 Breakpoints and a grids

10. 10 Do not forget your Typography.

11. 11 Breakpoint Plugin

5. Extra Material Responsive Typography

1. About the extra material

2. Rem and PX

3. Understanding Typescales

4. 02 Scaling System

5. Responsive Design in Typography Intro

6. Responsive approach 1 Single scale approach

7. Responsive approach 2 Ratio

8. Responsive approach Fluid

9. Summary

6. Before you go

1. Thank you!

139,000 تومان

خرید اشتراک افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Udemy-Training