آموزش ساخت سیستم طراحی در Figma از ابتدا - UI UX Master Class

درس ها Lessons

• چه خبر بعدی What's Next

• سیستم اجزای دکمه و نمادها 02 Button Components and Icons System 02

• مقدمه ای بر سیستم طراحی، مزایا و خروجی های سیستم طراحی Intro To Design System, Benefits And Outputs Of Design System

• آنچه در این کلاس سیستم طراحی خواهید آموخت What you will learn in this Design System Class

• Figma Auto Layout and Variants 01 Figma Auto Layout and Variants 01

• نوار ناوبری پاسخگو در Figma با استفاده از طرح بندی خودکار Responsive Navbar in Figma using Auto Layouts

• سیستم اجزای دکمه و نمادها 01 Button Components and Icons System 01

• قالب بندی در سیستم طراحی شما Theming in your Design System

• سیستم تایپوگرافی - مقیاس ها و سبک ها 01 Typography System - Scales and Styles 01

• اجزای بزرگتر 01 Bigger Components 01

• بیانیه هدف در سیستم های طراحی Purpose Statement in Design Systems

• مقیاس ها و سبک های رنگ در سیستم طراحی 01 Color Scales and Styles in Design System 01

• سیستم تایپوگرافی - مقیاس ها و سبک ها Typography System - Scales and Styles

• انتساب دکمه ها و اتم ها Buttons and atoms assignment

• سیستم رنگ و نحوه نامگذاری صحیح آن Color System and how to name it properly

• ایجاد کامپوننت های نوع ترکیبی Creating type combo components

• نحوه عملکرد سلسله مراتب اجزا در سیستم های طراحی How Hierarchy of Components works in Design Systems

• ایجاد Spacing System 01 Creating Spacing System 01

• مقیاس ها و سبک های رنگ در سیستم طراحی 02 Color Scales and Styles in Design System 02

• پروژه کلاس - سیستم طراحی با استفاده از Figma Class Project - Design System using Figma

• سیستم تایپوگرافی - مقیاس ها و سبک ها 02 Typography System - Scales and Styles 02

• پنجره مودال جعبه پاسخگو در Figma Responsive box modal window in Figma

• تخصیص سیستم رنگ Color System Assignment

• تصاویر آیکون ها و سیستم شبکه Icons illutrations and Grid System

• تایپوگرافی برای شما سیستم طراحی Typography for you Design System

• استفاده از سیستم آیکون در فیلدهای ورودی 01 Using Icon System in Input Fields 01

• چگونه موجودی UI را حسابرسی کنیم؟ How To Audit UI Inventory?

• استفاده از سیستم آیکون در فیلدهای ورودی 02 Using Icon System in Input Fields 02

• سیستم فاصله گذاری را تعریف کنید Define Spacing System

• اجزای سیستم طراحی چیست؟ What Are Components Of Design System

• سیستم شبکه و سیستم چیدمان Grid System and Layout System

• نشانه‌ها، ارزش‌های نقش در سیستم طراحی Tokens, Roles Values in Design System

• ایجاد Spacing System 02 Creating Spacing System 02

• اصول طراحی و نحوه دستیابی به آنها Design Principles And How To Come Up With Them

• Figma Auto Layouts and Variants 02 Figma Auto Layouts and Variants 02

• طرح‌بندی خودکار تغییر اندازه درست انجام شد Auto layout Resizing done right

• اجزای بزرگتر 02 Bigger Components 02

• 7 مرحله برای ساختن سیستم طراحی شما 7 Steps To Building Your Design System

• سیستم شبکه و چیدمان Grid System and Layout

• پیوندها و مستندات در Figma - پیوند دادن صفحات و فریم ها Links and documentation in Figma - Linking pages and frames

• اصول طراحی و بیانیه هدف Design Principles and Purpose Statement