بررسی عمیق طراحی واکنشگرا در Figma: آموزش Figma Auto Layout ،Constraints ،Breakpoints و Modes (2024)
✅ سرفصل و جزئیات آموزش
بررسی عمیق: آموزش Figma Auto Layout ،Constraints ،Breakpoints و Modes (2024)
Auto Layout شما را دیوانه کرده است؟ نگران آنچه برای طراحی شما در مرورگر رخ خواهد داد هستید؟ پس این کلاس دقیقاً مناسب شماست! ما همه چیز را در مورد چگونگی راهاندازی طراحیهای واکنشگرا در Figma یاد خواهیم گرفت.
این یک بررسی واقعاً عمیق در مورد Auto Layout ،Constraints، و مهمتر از همه اما به ندرت مورد بحث، چگونگی برخورد با breakpoints برای طراحی رابط کاربری شما خواهد بود که از یک راه اندازی ساده تا یک رویکرد پیشرفتهتر با متغیرها و حالتها را در بر میگیرد.
درک و ترکیب این ابزارها به شما کمک میکند تا کامپوننتها، الگوهای طراحی و صفحات کامل را مطابق با تنظیمات کدنویسی راهاندازی کنید.
با فایل مطالب دوره Figma، میتوانید همراه با مدرس کار کنید یا در زمان خودتان با دستورالعملهای دقیق به تمرینها بازگردید.
این کلاس برای شما مناسب است اگر دانش اولیه از Figma دارید یا اگر یک کاربر پیشرفته Figma هستید و میخواهید مهارتهای خود را تقویت کنید.
بررسی عمیق Auto Layout
- Auto Layout چیست؟
- راهاندازی فریمهای Auto Layout
- منوی Auto Layout
- تنظیم خودکار
- منوی پیشرفته Auto Layout
- تنظیمات تغییر اندازه
- نکات تغییر اندازه عمودی
- نادیده گرفتن Auto Layout
- کامپوننتها و متغیرهای Auto Layout
- تنظیم مقادیر حداقل و حداکثر
- بستهبندی Auto Layout
- تصاویر با نسبت ابعاد ثابت (راهحل جایگزین)
- یادگیری در مورد تودرتویی: رابطه والد-فرزندی
- پیشنهاد Auto Layout
- کمی جادو با جداول: Auto Layout و هوش مصنوعی
- تنظیمات پیشرفتهتر (مثالها)
- صفحات Auto Layout
- Auto Layout و CSS Flexbox
- کامپوننتهای اسلات با Auto Layout
Constraints
- محدودیتها در Figma چیستند؟
- محدودیتها و شبکهها (Grids)
- معرفی سریع شبکهها در Figma
Breakpoints & Modes
- معرفی breakpoints CSS
- breakpoints در Figma
- حالتها و اندازههای صفحه: معرفی سریع
- اتصال متغیرها به حالتها
- مخفی و نمایش با مقادیر بولی
- تایپوگرافی واکنشگرا با حالتها
بررسی عمیق طراحی واکنشگرا در Figma: آموزش Figma Auto Layout ،Constraints ،Breakpoints و Modes (2024)
-
مقدمه 0:02:11
-
نسخه رابط کاربری و مطالب آموزشی 0:01:44
-
AUTO LAYOUT: 01 Auto Layout چیست؟ 0:01:06
-
بروزرسانی: بهروزرسانی شبکه Auto Layout 0:02:35
-
AUTO LAYOUT: 02 راهاندازی فریمهای Auto Layout 0:04:02
-
AUTO LAYOUT: 03 منوی Auto Layout 0:03:43
-
AUTO LAYOUT: 04 تنظیم خودکار 0:01:45
-
AUTO LAYOUT: 05 منوی پیشرفته Auto Layout 0:02:00
-
AUTO LAYOUT: 06 تنظیمات تغییر اندازه 0:05:26
-
AUTO LAYOUT: 07 نکات تغییر اندازه عمودی 0:01:55
-
AUTO LAYOUT: 08 نادیده گرفتن Auto Layout 0:01:48
-
AUTO LAYOUT: 09 کامپوننتها و متغیرهای Auto Layout 0:01:50
-
AUTO LAYOUT: 10 تنظیم مقادیر حداقل و حداکثر 0:01:54
-
AUTO LAYOUT: 11 چیدمان خودکار و بستهبندی (Wrap) 0:02:28
-
12 تصاویر با نسبت ابعاد ثابت 0:00:37
-
AUTO LAYOUT: 13 یادگیری تودرتویی و رابطه والد-فرزندی 0:03:13
-
AUTO LAYOUT: 14 پیشنهاد Auto Layout 0:03:49
-
AUTO LAYOUT: 15 کمی جادو با جداول 0:02:43
-
AUTO LAYOUT: 16 مثالهای تنظیمات پیشرفتهتر 0:10:49
-
AUTO LAYOUT: 17 صفحات Auto Layout 0:07:45
-
AUTO LAYOUT: 18 Auto Layout و CSS Flexbox 0:03:08
-
AUTO LAYOUT: 19 کامپوننتهای اسلات با Auto Layout 0:01:57
-
CONSTRAINTS: 01 محدودیتها در Figma چیستند؟ 0:02:15
-
CONSTRAINTS: 02 محدودیتها و شبکهها 0:03:02
-
CONSTRAINTS: 03 معرفی سریع شبکهها در Figma 0:04:03
-
BREAKPOINTS: 01 معرفی Breakpoints CSS 0:02:04
-
BREAKPOINTS: CONSTRAINTS:02 و Breakpoints در Figma 0:05:16
-
BREAKPOINTS: 03 حالتها و اندازههای صفحه: معرفی سریع 0:05:43
-
BREAKPOINTS: 04 اتصال متغیرها به حالتها 0:03:42
-
BREAKPOINTS: 05 مخفی و نمایش با مقادیر بولی 0:03:11
-
BREAKPOINTS: 06 تایپوگرافی واکنشگرا با حالتها 0:04:48
-
چند مورد رایگان برای خداحافظی 0:01:23
مشخصات آموزش
بررسی عمیق طراحی واکنشگرا در Figma: آموزش Figma Auto Layout ،Constraints ،Breakpoints و Modes (2024)
- تاریخ به روز رسانی: 1404/12/10
- سطح دوره:مقدماتی
- تعداد درس:32
- مدت زمان :1:43:55
- حجم :302.0MB
- زبان:دوبله زبان فارسی
- دوره آموزشی:AI Academy
آموزش های مرتبط
- زمان: 03:02:02
- تعداد درس: 14
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 58:00
- تعداد درس: 12
-
سطح دوره:
-
زبان: دوبله فارسی
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 11:25:13
- تعداد درس: 94
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 06:58:57
- تعداد درس: 60
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 02:27:39
- تعداد درس: 24
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 08:11:21
- تعداد درس: 28
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 09:44:25
- تعداد درس: 67
-
سطح دوره:
-
زبان: دوبله فارسی
- زمان: 04:52:43
- تعداد درس: 38
-
سطح دوره:
-
زبان: دوبله فارسی