|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/responsive-ui-design-in-figma-2h-deep-dive/
课程评论：没有评论
课程名称：Figma中响应式UX/UI设计深度讲解（1.5小时）2024更新！ 课程概述：本课程将深入探讨Figma中的自动布局、约束、断点和模式，适合希望掌握Figma响应式设计的用户。课程包含全新的2024更新，帮助学生了解如何在Figma中设置响应式设计。我们将全面讲解自动布局的概念与应用，从简单设置到更高级的变量和模式使用，帮助学员设置组件、设计模式和整页设计，以与代码设置相协调。 课程内容包括： - 自动布局的深度解析：如何设置自动布局框、使用自动布局菜单和高级设置。 - 约束的应用：Figma中的约束及其与网格的结合。 - 断点与模式：介绍CSS断点、Figma中的断点设置以及如何利用模式实现响应式排版。 学员将获得Figma课程材料文件，可以与讲师同步练习或根据详细指导自行回顾。此课程适合具有Figma基础知识的用户，或希望提升技能的高级用户。 通过本课程，将帮助学员掌握响应式设计技能，并将其有效应用于实际项目中。
Deep Dive: Figma Auto Layout, Constraints, Breakpoints & Modes(1.5h)NEW! Full Config 2024 Update Featuring the New Figma UI Design!Auto layout driving you crazy? Scared of what will happen with your design in the browser? Then this class is just right for you! We will learn everything about how to set up responsive designs in Figma.This is going to be a real deep dive into auto layout, constraints, and, most importantly but rarely discussed, how to deal with breakpoints for your UI design, ranging from a simple setup to a more advanced approach with variables and modes.Understanding and combining these tools will help you set up components, design patterns, and entire pages that align with code settings.With the Figma course material file, you can work alongside me or return to exercises with detailed instructions in your own time.This class is right for you if you have basic knowledge of Figma or if you are an advanced Figma user and want to brush up on your skills.Auto Layout deep diveWhat is auto layout?Setting up auto layout framesThe auto layout menuThe auto settingAdvanced auto layout menuResize settingsVertical resizing tipsIgnore auto layoutAuto layout components and variablesSetting min and max valuesAuto layout wrapFixed aspect ratio images (hack)Learn about nesting: parent-child relationshipSuggest auto layoutSome magic with tables: auto layout and AIMore advanced setup (examples)Auto layout pagesAuto layout and CSS flexboxSlot components with auto layoutConstraintsWhat are constraints in Figma?Constraints and gridsA quick intro to grids in FigmaBreakpoints & ModesIntroducing CSS breakpointsBreakpoints in FigmaModes and screen sizes: a quick introBinding variants to modesHide and show with booleansResponsive typography with modesFigma course material file
