|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/figma-beginner/
课程评论：没有评论
课程名称：NEW Figma 2024：从初学者到专业人士的入门课程 课程概述： 本课程是对Figma的全面介绍，适合从完全初学者到高级用户，课程时长为4小时，并包含课程项目。课程内容涵盖Figma 2024最新的用户界面设计，帮助学员掌握UI设计所需的一切知识。 首先，学员将学习如何注册Figma账号，并熟悉其文件结构。接下来，课程会讲解Figma的基本功能，包括框架设置、图形和文本添加、颜色和网格配置，从而创建出高质量的UI设计。一旦掌握了基础知识，课程将深入探讨更高级的主题，如创建可靠的UI设计和使用组件来复用元素。 学员将学习如何建立样式和变量以确保设计的一致性，使用自动布局创建响应式设计，并进行基本的原型制作，以使设计更具生动性。课程中将提供逐步练习和实用技巧，帮助学员在4小时内熟练掌握Figma，特别适合初学者或从其他设计软件转行的人士。 课程内容涵盖： - Figma的基础知识与文件浏览器 - 创建设计文件和使用快捷键 - 添加形状、颜色和文本 - 组件的使用与管理 - 变量与样式的建立 - 响应式设计与自动布局 - 基础原型制作与分享设计文件 项目作业包括创建线框图、设计组件、测试应用在不同手机尺寸上的表现，以及将设计转化为可点击的原型，方便与其他设计师和开发人员共享。 本课程由moonlearning制作，旨在帮助学员在短时间内掌握Figma的使用，提升UI设计能力。
Getting Started with Figma (4h) + Course ProjectA beginner's to pro course in UI design with FigmaNEW! Full Config 2024 Update Featuring the New Figma UI Design!This course is a comprehensive introduction to Figma from absolute beginner to advanced features. Short and focused, providing you with all you need to know to tackle any design.We'll start from scratch by setting up your Figma account and familiarising ourselves with its file structure. Then, we'll dive into the fundamentals of Figma, such as setting up frames and nesting them, adding shapes, text, colours, and grids creating solid UI designs. Once you're comfortable with the basics, we dive into more advanced subjects like creating solid UI designs and working with components for reusable elements.You'll learn how to establish styles and variables for consistency, create responsive designs with auto layout, and add basic prototyping to bring your designs to life-always keeping collaboration with development in mind.With step-by-step exercises and valuable tips and tricks, you'll become proficient in Figma in under 4 hours. It's perfect for beginners or those transitioning from other design software.SetupWhat Is Figma? Who does the coding?Figma in the Browser vs. Figma AppThe Figma file browser - Figma's homeCreating design files in FigmaFigma BasicsAdding frames to our fileA few handy shortcutsDesign file overviewAdding shapes and colourSize menu - manipulating shapes and framesAlign, tidy up, and measureAdding and working with textNesting frames - The Figma superpowerFrames vs GroupsDesigning with nested framesRe-usable grids with stylesFigma Community and PluginsAdding imagesDrawing in FigmaScaling in FigmaCourse Project: Creating a wireframe and first designIntroducing ComponentsRe-use elements with components and instancesOverriding instancesWhat to override and what not toReverting components and overridesNest componentsComponent sets with variantsMove components to their own pageKeeping components organisedAdvanced component features introduction.Course Project: Turning our design into componentsVariables and StylesIntroduction to variablesWorking with colour variablesOrganising with variable collections and groupsSize and spacing variablesAnd what about styles?Typography and stylesDocumenting variables and stylesCourse Project: Adding colour variables and text stylesResponsive DesignWhat is auto layout?Adding auto layoutAuto layout components and variablesResize settingsAuto or space betweenNesting auto layout with systemAbsolute positioningAuto layout pagesConstraints in FigmaConstraints and gridsCourse Project: Testing our app on different phone sizesBasic PrototypingPrototyping in FigmaSetting scroll behaviourConnecting screensDropdown menu with overlaysAnimation typesInteractive componentsFigma Mirror - Preview on your deviceCourse Project: Turning our app into a clickable prototypeSharing with other designers and developersSharing and inviting othersSetting up a thumbnailShared team libraries in FigmaSetting up a shared team libraryConnecting to a shared team libraryUpdating shared team librariesSharing design, components, styles, and variablesDev mode: Sharing with developmentThis is a course idea and production by moonlearning
