دوره آموزشی

دوبله زبان فارسی

بوت کمپ کامل UI/UX با فیگما - طراحی 10 پروژه آماده برای کار

معرفی
سرفصل

✅ سرفصل و جزئیات آموزش

آنچه یاد خواهید گرفت:

نمونه سازی اولیه با فیگما از پایه تا پیشرفته
استفاده از نمونه سازی اولیه در اپلیکیشن واقعی
نمونه سازی اولیه هاور زوم
انواع مختلف نمونه های اولیه
نمونه سازی اولیه آکاردئون
تکنیک های نمونه سازی پیشرفته
نمونه اولیه صفحه کلید تایپینگ بلادرنگ
تریگر On Drag چگونه کار می کند؟

پیش نیازهای دوره

دانشجویان نیازی به دانش قبلی ندارند؛ آنها همه چیز را از این دوره یاد خواهند گرفت.

توضیحات دوره

در این بوت کمپ فیگما، دانشجویان عمیقاً به اصول و تکنیک‌های پیشرفته طراحی اپلیکیشن موبایل خواهند پرداخت. از طریق پروژه‌های عملی، آنها یاد می‌گیرند که طرح‌های UI/UX با کیفیت بالا و نمونه‌های اولیه تعاملی برای اپلیکیشن‌های دنیای واقعی ایجاد کنند. هر پروژه به ایجاد مهارت‌های اصلی در طرح‌بندی، ناوبری، جریان کاربری و عناصر تعاملی با استفاده از ابزارهای طراحی قدرتمند فیگما کمک می‌کند.

انواع نمونه های اولیه که در این دوره خواهید آموخت:

بحث در مورد انواع انیمیشن رابط کاربری
مقصد، تریگر، اکشن و انیمیشن
تنظیمات نمونه اولیه، تست و اشتراک گذاری نمونه های اولیه
تریگر On Drag چگونه عمل می کند؟
تریگر چگونه On Click چگونه عمل می کند؟
تریگر While Hovering چگونه عمل می کند؟
تریگر After Delay چگونه عمل می کند؟
نمونه سازی اولیه Action-Navigate to و Change to
همپوشانی باز
تاگل، چک باکس، Eye off on، رادیو
نمونه سازی اولیه آکاردئون
نمونه سازی اولیه نوار تب
نمونه سازی اولیه تعامل ویدئویی
نمونه سازی اولیه هاور زوم
نمونه سازی اولیه انیمیشن درگ، کاروسل کارت
انیمیشن اسکرول چسبنده
نمونه سازی اولیه اسلایدر محدوده
نمونه سازی اولیه انیمیشن متن
نمونه سازی اولیه افکت های نوتیفیکیشن
افکت کارت متحرک
دکمه سوئیچ و تاگل
متغیر مجموعه و شرطی
حذف نمونه سازی اولیه با استفاده از متغیر مجموعه
مخفی سازی و نمایش با استفاده از بولی
نمونه سازی پیشرفته صفحه نمایش اپلیکیشن
تکنیک های نمونه سازی پیشرفته
نمونه سازی پیشرفته با استفاده از انواع دکمه ها
اسلایدر متحرک
نمونه سازی اولیه صفحه کلید تایپ بلادرنگ

این دوره برای چه کسانی مناسب است؟

کسی که طراح UI/UX با فیگما می باشد و به دنبال ارتقای مهارت های نمونه سازی اولیه خود است.
کسی که می خواهد به نمونه سازی اولیه با فیگما مسلط شود.
کسی که می خواهد در مورد انواع مختلف نمونه های اولیه با مثال های واقعی بیاموزد.

بوت کمپ کامل UI/UX با فیگما - طراحی 10 پروژه آماده برای کار

فصل 1: بررسی دوره

بررسی دوره 03:39

فصل 2: ماژول 1 - مقدمه‌ای بر فیگما و مرور کلی ابزارها

مقدمه‌ای بر فیگما 02:38
ایجاد حساب کاربری فیگما (نسخه رایگان در مقابل نسخه حرفه‌ای) بخش 2 07:29
ابزار فیگما (ابزارهای Move ،Region و Shape) 09:21
ابزار فیگما (ابزار Pen و Vector Network) 07:31
ابزار فیگما (Comment Tool و Presentation) 05:01
ابزار فیگما (ابزار متن و استایل متن) 05:29
تنظیمات فایل و Canvas 03:18

فصل 3: ماژول 2 - طرح بندی ها و راه اندازی Canvas

آشنایی با فریم، گروه‌ها، لایه‌ها 06:42
نامگذاری لایه‌ها و بهترین شیوه‌ها 08:11
استفاده از ابزارهای Guide ،Ruler و Alignment 04:16

فصل 4: ماژول 3 - صفحات و ساختار پروژه

ایجاد و مدیریت چندین صفحه با قرارداد نامگذاری 03:36
راه‌اندازی جریان‌ها و موارد استفاده 04:24
مبانی همکاری برای پروژه‌های چند صفحه‌ای 01:54

فصل 5: ماژول 4 - تایپوگرافی در فیگما

مقدمه‌ای بر تایپوگرافی 04:41
ایجاد عنوان، پاراگراف و سلسله مراتب 07:42
تنظیم و استفاده مجدد از استایل های متن 05:01
تایپوگرافی واکنش‌گرا 02:23
نکات مربوط به دسترسی‌پذیری و خوانایی 07:44

فصل 6: ماژول 5 - تئوری و جلوه‌های رنگ

درک روانشناسی و انواع رنگ 09:05
ایجاد پالت رنگ و تنظیم استایل ها 08:44
اعمال افکت ها (سایه، تاری و موارد دیگر) 03:22

فصل 7: ماژول 6 - کار با تصویر و تصاویر

ایمپورت کردن تصویر و استفاده از تکنیک‌ها (Crop) 04:37
استفاده از ابزار ماسک و ایمپورت کردن تصاویر 05:43

فصل 8: ماژول 7 - کامپوننت ها و متغیرها

کامپوننت ها، نمونه‌ها و Overrides 05:40
ساخت استیت ها و سیستم طراحی مقیاس‌پذیر با استفاده از متغیرها 07:08

فصل 9: ماژول 8 - طرح‌بندی خودکار و محدودیت‌ها

مقدمه‌ای بر طرح‌بندی خودکار و موارد استفاده 06:13
ایجاد طرح‌بندی‌های انعطاف‌پذیر و واکنش‌گرا با استفاده از آیتم‌های تودرتو 07:21
استفاده از محدودیت‌ها برای طراحی مقیاس‌پذیر 02:10

فصل 10: ماژول 9 - سیستم‌های شبکه‌ای و ستونی

تنظیم طرح‌بندی شبکه‌ای 05:26
استفاده از سیستم‌های فاصله‌گذاری 8pt و 4pt 03:57
سیستم طرح‌بندی شبکه‌ای برای دستگاه‌های مختلف 05:37

فصل 11: ماژول 10 - وایرفریمینگ شبکه (با دقت پایین و بالا)

مقدمه‌ای بر وایرفریم 03:24
تبدیل وایرفریم با low fidelity به وایرفریم با High Fidelity 08:40
استفاده از وایرفریم در ارائه به مشتری 03:11
ابزاری برای گردش‌های کاری سریع‌تر وایرفریم 02:58

فصل 12: ماژول 11 - متغیرها در فیگما

مقدمه‌ای بر متغیرهای فیگما 01:44
استفاده از متغیرهای رنگی، عددی و متنی 07:24
توکن‌ها در سیستم‌های طراحی 09:17

فصل 13: ماژول 12 - راهنمای سیستم و استایل طراحی

راهنمای استایل مقدمه 02:50
سیستم طراحی و الگوهای قابل استفاده مجدد سیستم طراحی در پروژه‌ها 03:31
انتشار و استفاده از کتابخانه‌ها 04:17

فصل 14: ماژول 13 - افزودن ویدیوها و رسانه‌های غنی

تعبیه ویدیو و ایمپورت کردن انیمیشن Lottie 04:22
نکات و بهترین شیوه ها برای افزودن ویدیو و رسانه‌های غنی 03:30

فصل 15: ماژول 14 - اشتراک‌گذاری، خروجی گرفتن و تحویل پروژه به توسعه‌دهنده

اشتراک‌گذاری، اکسپورت گرفتن، تحویل پروژه به همراه تاریخچه نسخه‌ها و توضیحات 10:24

فصل 16: ماژول 15 - پلاگین ها و دارایی های فیگما

یافتن و استفاده از پلاگین های مفید 08:48
دارایی‌های فیگما 02:35

فصل 17: ماژول 16 - الگوهای طراحی رابط کاربری/تجربه کاربری

بهترین شیوه‌ها برای طراحی رابط کاربری 03:28
مثال دنیای واقعی از رابط کاربری خوب 04:57
چگونه از ضد الگوها و Clutters جلوگیری کنیم؟ 05:26

فصل 18: شروع کار با فایل‌های نمونه‌سازی فیگما (منبع)

شروع کار و نحوه تأیید طرح آموزشی، نحوه ایمپورت کردن منابع 09:56

فصل 19: تئوری نمونه سازی اولیه

نمونه اولیه چیست؟ - بخش 1 02:32
چرا نمونه اولیه مهم است؟ - بخش 2 05:10
انواع نمونه های اولیه در طراحی UX/UI - بخش 3 03:18

فصل 20: نمونه سازی اولیه در سطح پایه

بحث در مورد انواع انیمیشن رابط کاربری - بخش 1 07:40
مقصد، تریگر، اکشن و انیمیشن - بخش 2 03:50
تست تنظیمات نمونه اولیه و اشتراک گذاری نمونه های اولیه - بخش 3 04:48
تریگر On Drag چگونه کار می کند؟ - بخش 4 07:05
تریگر On Click چگونه کار می کند؟ - بخش 5 05:50
تریگر While Hovering چگونه کار می کند؟ - بخش 6 03:14
تریگر After Delay چگونه کار می کند؟ - بخش 7 04:14
نمونه اولیه Action-Navigate to و Change to - بخش 8 05:31

فصل 21: نمونه سازی اولیه سطح متوسط

همپوشانی باز 06:59
تاگل، چک باکس، Eye off on، رادیو 06:58
نمونه سازی اولیه آکاردئون 05:01
نمونه سازی اولیه نوار تب 09:40
نمونه سازی اولیه تعامل ویدئویی 03:25
نمونه سازی اولیه هاور زوم 03:22
نمونه سازی اولیه انیمیشن درگ، کاروسل کارت 04:49
انیمیشن اسکرول چسبنده 02:15
نمونه سازی اولیه اسلایدر محدوده 04:39
نمونه سازی اولیه انیمیشن متنی 03:29
نمونه سازی اولیه افکت های نوتیفیکیشن 02:54
افکت کارت متحرک 06:42
دکمه سوئیچ و تاگل 04:11

فصل 22: نمونه سازی اولیه سطح پیشرفته

مجموعه متغیر و شرطی 09:24
حذف نمونه سازی اولیه با استفاده از مجموعه متغیر 04:21
مخفی سازی و نمایش با استفاده از بولی 05:45
نمونه سازی اولیه پیشرفته صفحه نمایش اپلیکیشن 03:47
تکنیک های نمونه سازی اولیه پیشرفته 04:58
نمونه اولیه پیشرفته با استفاده از انواع دکمه ها 08:07
اسلایدر متحرک 05:52
نمونه سازی اولیه صفحه کلید تایپینگ بلادرنگ 06:53
نمونه سازی اولیه منوی کشویی تعاملی 09:08
نمونه سازی اولیه منوی کشویی تعاملی 04:36

فصل 23: پروژه رابط کاربری/تجربه کاربری وب اپلیکیشن اسپاتیفای - بخش 1

پروژه رابط کاربری/تجربه کاربری کلون وب اپلیکیشن اسپاتیفای - لایو دمو 02:56
بررسی پروژه رابط کاربری/تجربه کاربری کلون وب اپلیکیشن اسپاتیفای 05:54
ایجاد فایل طراحی جدید 03:06
ایجاد قالب رنگی 07:30
افزودن رنگ به style guide 03:32
ایجاد لیست استایل تایپوگرافی 10:01
افزودن تایپوگرافی به استایل 06:08
ایجاد لوگوی برند 06:18
اضافه کردن آیکون‌ها 09:29
ایجاد نوار ناوبری با low fidelity برای صفحه فرود 09:38
نوار ناوبری کامل low fidelity در صفحه فرود 06:22
ایجاد نوار پنل سمت چپ در صفحه فرود با low fidelity 08:15
نوار پنل سمت چپ کامل از صفحه فرود با low fidelity 07:07
ایجاد کارت های کوچک آهنگ صفحه فرود با low fidelity 10:38
ایجاد کارت‌های آرتیست آهنگ در صفحه فرود low fidelity 07:27
تکمیل بخش های کارت صفحه فرود با low fidelity 04:04
ایجاد فوتر صفحه فرود با low fidelity 08:02
تکمیل low fidelity landing screen 09:45
ایجاد low fidelity صفحه ورود 08:50
تکمیل low fidelity صفحه ورود 07:23
ایجاد low fidelity صفحه خانه 07:56
ایجاد low fidelity صفحه جزئیات آهنگ 06:24
ادامه low fidelity صفحه جزئیات آهنگ 10:58
ایجاد play پنل low fidelity صفحه جزئیات آهنگ 10:24
تکمیل low fidelity صفحه جزئیات آهنگ 07:09
ایجاد بنر low fidelity song صفحه پلی‌لیست 10:44
تکمیل بنر بخش low fidelity song صفحه پلی‌لیست 07:06
ایجاد پلی‌لیست بخش low fidelity song صفحه پلی‌لیست 10:50
تکمیل پلی‌لیست بخش low fidelity song صفحه پلی‌لیست 10:49
ایجاد low fidelity صفحه خروج - بخش 28 09:08
ایجاد کارت کوچک صفحه فرود High Fidelity 10:33
ایجاد کاروسل - 1 High Fidelity صفحه فرود 10:14
ادامه کاروسل - 1 High Fidelity صفحه فرود 08:13
تکمیل کاروسل - 1 High Fidelity صفحه فرود 08:01
انجام تغییرات جزئی - بخش 33 10:02
ایجاد کاروسل - 2 High Fidelity صفحه فرود 07:16
تکمیل کاروسل - 2 High Fidelity صفحه فرود 06:50
ایجاد کاروسل - 3 High Fidelity صفحه فرود 09:57
ایجاد کاروسل - 4 High Fidelity صفحه فرود 07:15
ایجاد کاروسل - 5 High Fidelity صفحه فرود 06:26
ایجاد کاروسل - 6 و تکمیل High Fidelity صفحه فرود 08:36
ایجاد High Fidelity صفحه ورود 02:17
ایجاد High Fidelity صفحه اصلی و انجام تغییرات جزئی 05:06
ایجاد کاروسل - 6 و 7 High Fidelity صفحه جزئیات آهنگ 11:38
ایجاد کاروسل - 8,9 High Fidelity صفحه دسکریپشن آهنگ 08:26
44. تکمیل High Fidelity صفحه جزئیات آهنگ 05:31
ایجاد کاروسل - 10 High Fidelity صفحه پلی‌لیست آهنگ 08:45
تکمیل High Fidelity صفحه پلی‌لیست آهنگ 09:11
افزودن نمونه کار به صفحات وایرفریم high fidelity 08:55
تکمیل ایجاد نمونه کار 06:35
سازماندهی کامپوننت های طراحی و تکمیل پروژه 03:56

فصل 24: رابط کاربری/تجربه کاربری اپلیکیشن موبایل سفارش غذا: پروژه - 2

پروژه رابط کاربری/تجربه کاربری اپلیکیشن موبایل سفارش غذا - لایو دمو 01:27
ایجاد راهنمای استایل رنگ 09:48
ایجاد راهنمای استایل تایپوگرافی 07:34
تمام تنظیمات ممکن آیکون 07:16
طراحی دکمه و انواع آن 08:45
طراحی برتر نوار ناوبری 07:04
طراحی نوار تب پایین 07:03
طراحی فیلد ورودی 07:05
طراحی کارت ویژه 09:10
طراحی کارت دسته بندی ها 03:06
طراحی کارت محبوب برای صفحه اصلی 04:31
PR - پروژه طراحی اسپلش اسکرین روابط عمومی 07:13
PR - پروژه طراحی صفحه ورود 06:22
PR - پروژه طراحی صفحه ثبت نام 02:45
PR - پروژه طراحی صفحه اصلی 05:13
PR - پروژه طراحی صفحه اصلی 07:24
PR - تنظیمات قاب مشترک برای پروژه سیستم طراحی 03:56
PR - سفارش طراحی صفحه نمایش 07:49
PR - پروژه طراحی صفحه نمایش مورد علاقه 04:19
PR - همه چیز درباره پروژه نمونه‌سازی 07:59

فصل 25: رابط کاربری/تجربه کاربری اپلیکیشن Uber Ride Sharing: پروژه - 3

پروژه رابط کاربری/تجربه کاربری اپلیکیشن Uber Ride Sharing: لایو دمو 03:16
انتخاب رنگ‌ها 1 08:33
انتخاب رنگ‌ها 2 09:43
تعریف متغیرها 09:54
ایجاد تایپوگرافی 1 09:16
ایجاد تایپوگرافی 2 06:57
Iconography 10:21
درک اصول اولیه طرح‌بندی خودکار 10:03
ایجاد اولین کامپوننت 09:56
تکمیل تمام دکمه‌ها 07:34
اتمام راهنمای استایل 05:25
صفحه آنبوردینگ طراحی Low-Fidelity 10:11
صفحه ورود به سیستم طراحی با Low Fidelity 10:03
انتخاب و پرداخت سواری با طراحی Low Fidility 09:41
جستجوی سواری با طراحی Low Fidelity و یافتن سواری 08:53
جزئیات و رتبه‌بندی سواری با Low Fidelity 10:02
طراحی با Low Fidelity پیوستن به یک سواری و سواری قبلی 10:03
طراحی با Low Fidelity - طراحی پایانی 03:53
ایجاد اسلایدر صفحه آنبوردینگ با High Fidelity 10:08
تکمیل اسلایدر صفحه آنبوردینگ با High Fidelity 10:14
صفحه ورود و ثبت نام در سیستم با High Fidelity 10:08
کامپوننت نوار ناوبری High Fidelity 09:04
تکمیل صفحه اصلی با High Fidelity 08:18
صفحه انتخاب سواری High Fidelity 10:12
صفحه پرداخت High Fidelity 09:29
High Fidelity Loader 11:11
جزئیات سواری و تایید سواری High Fidelity 10:08
امتیاز به سواری و جزئیات سواری High Fidelity 09:47
پیوستن به سواری و سفر قبلی High Fidelity 08:55
اطلاعات سفر پیشین High Fidelity 09:02
طرح و نمونه اولیه نهایی 09:51
نمونه اولیه نهایی High Fidelity 07:26
طراحی صفحه ثبت نام و صفحه اصلی Low Fidelity 08:58

فصل 26: رابط کاربری/تجربه کاربری اپلیکیشن تجارت الکترونیک کفش Sop: پروژه - 4

پروژه رابط کاربری/تجربه کاربری اپلیکیشن تجارت الکترونیک فروشگاه کفش Sop: لایو دمو 06:47
پروژه راه اندازی Figma 02:50
ایجاد راهنمای استایل رنگ 05:52
ایجاد راهنمای استایل تایپوگرافی 07:41
ایجاد صفحه اصلی Splash Screen (وایرفریم Low Fidelity) 08:20
ایجاد جزئیات محصول، سبد خرید، صفحه خرید (وایرفریم Low Fidelity) 08:20
طراحی اسپلش اسکرین 06:21
طراحی نوار جستجو (صفحه اصلی) 08:08
طراحی بخش دسته‌بندی (صفحه اصلی) 07:15
طراحی بخش سبد خرید (صفحه اصلی) 05:54
طراحی نوار ناوبری پایین (صفحه اصلی) 06:35
طراحی بخش تصویر (صفحه جزئیات محصول) 06:52
طراحی بخش جزئیات محصول (صفحه جزئیات محصول) 07:59
طراحی صفحه سبد خرید 07:26
طراحی صفحه نمایش موفقیت آمیز ثبت سفارش 07:05
ایجاد کامپوننت‌های تصاویر و آیکون‌ها (سیستم طراحی) 05:49
ایجاد کامپوننت‌های دکمه (سیستم طراحی) 06:32
ایجاد کامپوننت‌های بخش دسته‌بندی (سیستم طراحی) 05:06
ایجاد کامپوننت‌های نوار ناوبری پایین (سیستم طراحی) 05:58
ایجاد کامپوننت‌های کارت‌های بخش با اندازه انتخابی (سیستم طراحی) 09:38
ایجاد کامپوننت‌های لیست سبد خرید (سیستم طراحی) 04:28
نمونه‌سازی اولیه صفحه اصلی اسپلش اسکرین 07:31
جزئیات محصول نمونه‌سازی صفحه نمایش - 1 04:48
جزئیات محصول نمونه‌سازی صفحه نمایش - 2 08:53
نمونه‌سازی کامپوننت‌های کارت 07:17
نمونه‌سازی صفحه سبد خرید 09:07
نمونه‌سازی نهایی 02:23

فصل 27: رابط کاربری/تجربه کاربری اپلیکیشن چت: پروژه 5

رابط کاربری/تجربه کاربری اپلیکیشن چت: پروژه - لایو دمو 04:43
درک مبانی 09:39
درک رنگ‌ها 1 09:15
درک رنگ‌ها 2 09:16
درک رنگ‌ها 3 09:59
درک رنگ‌ها 4 09:08
اعلان متغیرها 1 09:03
اعلان متغیرها 2 07:11
درک تایپوگرافی 1 09:44
درک تایپوگرافی 2 08:36
Iconography 10:32
ایجاد نوار ناوبری پایین و تست آن 09:41
ایجاد نوار ناوبری پایین و تست آن 09:50
نمونه‌سازی اولیه و ایجاد دکمه‌ها 09:12
ایجاد کامپوننت‌های چت 08:45
تست کامپوننت‌ها 05:54
Mental Models 09:52
درک جریان کاربری اپلیکیشن 09:59
ایجاد طراحی Low Fi برای اپلیکیشن 1 09:35
ایجاد طراحی Low Fi برای اپلیکیشن 2 10:09
ایجاد طراحی Low Fi برای اپلیکیشن 3 09:27
ایجاد طراحی Low Fi برای اپلیکیشن 4 10:19
ایجاد طراحی Low Fi برای اپلیکیشن 5 10:01
ایجاد طراحی Low Fi برای اپلیکیشن 6 04:44
ایجاد اسلایدر برای صفحه آنبوردینگ 08:55
تکمیل صفحه آنبوردینگ 11:16
صفحه ورودی اعداد 09:35
ادامه صفحات ورود و ثبت نام 09:21
تکمیل صفحات ورود به سیستم و ثبت نام 10:03
طراحی صفحه اصلی 1 09:35
طراحی صفحه اصلی 2 13:54
طراحی صفحه اصلی 3 10:03
طراحی صفحه اصلی تکمیل شده 4 10:21
نمونه‌سازی نوار ناوبری پایین 04:42
طراحی گزینه چت‌های جدید 10:38
ایجاد صفحه پیام‌ها 1 10:46
ایجاد صفحه پیام‌ها 2 09:25
ایجاد صفحه پیام‌ها 3 10:39
صفحه پیام‌ تکمیل‌شده 09:06
مشاهده صفحه پروفایل دیگران 1 09:55
مشاهده صفحه پروفایل دیگران 2 07:20
مشاهده صفحه پروفایل دیگران 10:12
ایجاد صفحه ویرایش جزئیات پروفایل کاربر 09:40
صفحه پیام‌های گروهی 09:16
طراحی صفحه داستان‌ها 09:30

فصل 28: پروژه رابط کاربری/تجربه کاربری اپلیکیشن پخش موسیقی 6

پروژه رابط کاربری/تجربه کاربری اپلیکیشن پخش موسیقی - لایو دمو 03:02
درک مبانی 05:38
تعیین اندازه فونت 12:25
تست فونت‌ها 06:43
ایجاد استایل های فونت 09:38
درک رنگ‌ها 10:45
انتخاب رنگ برای اپلیکیشن 10:57
اعلان رنگ در استایل‌ها 09:05
Iconography 06:59
تکمیل راهنمای استایل 07:15
ایجاد صفحه اصلی برنامه با Low Fidelity 10:47
رقابت صفحه اصلی با Low Fidelity 07:14
تکمیل پخش کننده موسیقی با Low Fidelity 06:25
ایجاد کامپوننت نوار ناوبری پایین 10:40
ایجاد کامپوننت‌های دیگر 11:49
طراحی صفحه اصلی 11:57
طراحی بخش اخیراً پخش شده در صفحه اصلی 10:34
تنظیم نوار ناوبری در صفحه اصلی 09:48
طراحی پخش کننده موسیقی 09:32
طراحی Seek-bar و Player در رابط کاربری 08:38
نمونه‌سازی رابط کاربری 09:55
نمونه‌سازی اولیه صفحه پخش موسیقی 02:15

فصل 29: پروژه رابط کاربری/تجربه کاربری وب اپلیکیشن تجارت الکترونیک 7

پروژه رابط کاربری/تجربه کاربری وب اپلیکیشن تجارت الکترونیک - لایو دمو 08:32
مقدمه‌ای بر استایل متن 08:12
نهایی کردن استایل متن 06:39
استایل رنگی 04:28
لوگو با low fidelity 06:15
نوار ناوبری بالا و فیلد جستجو با low fidelity 07:35
نوار دسته‌بندی با low fidelity 06:09
مقدمه‌ای بر تصویر بنر Low Fidelity 05:38
تکمیل بخش بنر Low Fidelity 05:29
بخش دسته‌بندی با Low Fidelity 04:37
نوار عنوان بخش با Low Fidelity 04:15
کارت بزرگ با Low Fidelity 09:01
اتمام کارت بزرگ با Low Fidelity 06:41
بخش برندهای ترند Low Fidelity 07:07
بخش آیتم‌های محبوب Low Fidelity 04:23
کارت کوچک با low fidelity 08:17
معرفی بخش پیشنهادات ویژه low fidelity 08:55
اتمام بخش پیشنهادهای ویژه low fidelity 07:24
مقدمه‌ای بر بخش فوتر Low Fidelity 08:12
تکمیل بخش فوتر low fidelity 05:42
مقدمه‌ای بر توضیحات محصول low fidelity 04:42
ادامه توضیحات محصول low fidelity 05:58
فاین تیونینگ بخش توضیحات محصول با low fidelity 07:24
تنظیم آیکون توضیحات محصول با low fidelity 07:24
بخش توضیحات محصول نهایی low fidelity 05:35
بخش محصولات مرتبط Low Fidility 06:49
بخش نوار ناوبری صفحه خرید Low Fidility 07:20
بخش همه موارد Low Fidility 09:11
مقدمه‌ای بر بخش خلاصه سفارش Low Fidility 05:57
تکمیل بخش کارت خلاصه سفارش Low Fidility 04:34
تکمیل بخش صفحه خرید Low Fidility 09:28
ایجاد High Fidelity Ware-frame 00:52
مقدمه ای بر نوار ناوبری و بنر High Fidelity 07:27
تکمیل بخش بنر High Fidelity 04:15
بخش دسته بندی High Fidelity 04:57
انیمیشن بخش دسته‌بندی High Fidelity 06:26
تکمیل انیمیشن بخش رده‌بندی High Fidelity 03:22
بخش پیشنهادات ویژه High Fidelity 05:19
تکمیل بخش پیشنهادات ویژه High Fidelity 08:08
مقدمه‌ای بر کاروسل کارت‌های بزرگ با High Fidelity 05:26
ادامه‌ی کاروسل کارت‌های بزرگ با High Fidility 08:29
تکمیل کاروسل کارت‌های بزرگ با High Fidility 02:34
برندهای ترند High Fidelity - بخش 42 05:52
بخش موارد محبوب High Fidelity 08:07
پیشنهادات ویژه و بخش فوتر High Fidelity 03:16
آشنایی با فوتر 09:02
تکمیل بخش فوتر High Fidelity 10:12
بخش توضیحات محصول High Fidelity 08:50
بخش کاروسل محصولات مرتبط High Fidelity 09:45
انیمیشن سیستم پرداخت 08:50
انیمیشن سیستم پرداخت 08:59
کاروسل بخش توصیه شده High Fidelity 05:33
انیمیشن فوتر و ترنزیشن صفحه High Fidelity 10:46

فصل 30: پروژه رابط کاربری/تجربه کاربری اپلیکیشن وب کلون نتفلیکس - 8

پروژه رابط کاربری/تجربه کاربری اپلیکیشن وب کلون نتفلیکس - لایو دمو 02:21
پروژه رابط کاربری/تجربه کاربری اپلیکیشن وب کلون نتفلیکس - بررسی 06:29
ایجاد فایل طراحی 02:26
ایجاد راهنمای استایل رنگ 06:37
ایجاد تایپوگرافی 03:55
تکمیل تایپوگرافی 09:43
افزودن استایل به تایپوگرافی 05:21
آیکون‌ها 10:35
ایجاد نوار ناوبری صفحه فرود با Low Fidelity Ware-frame 06:50
ایجاد متن بدنه و دکمه‌های صفحه فرود با Low Fidelity Ware-frame 10:31
تکمیل صفحه فرود Low Fidelity 08:30
مقدمه‌ای بر صفحه قیمت‌گذاری طرح Low Fidelity - بخش 10 05:04
ایجاد کارت طرح Low Fidelity 07:57
تکمیل کارت طرح Low Fidelity 05:17
تکمیل کارت های طرح Low Fidelity 05:49
ایجاد فوتر Low Fidelity 05:56
تکمیل صفحه خرید پاورقی و طرح Low Fidelity 08:08
ایجاد صفحه پروفایل با Low Fidelity 10:02
ایجاد نوار ناوبری صفحه اصلی با Low Fidelity 08:44
تکمیل نوار ناوبری صفحه اصلی با Low Fidelity 02:04
تکمیل بخش بنر با Low Fidelity 08:11
ایجاد بخش مشاهده بعدی در صفحه اصلی Low Fidity 03:45
ایجاد بخش ادامه تماشا در صفحه اصلی Low Fidility 08:39
ایجاد بخش فیلم‌های ترند در صفحه اصلی Low Fidility 09:08
ایجاد بخش فیلم‌های اکشن و هالیوودی با Low Fidity Ware-frame 03:03
بخش فیلم‌های بازی، آسیایی و خانوادگی از صفحه Low Fidelity Ware-frame 04:39
ایجاد فوتر صفحه اصلی با Low Fidelity 06:00
ایجاد منوی کشویی در صفحه اصلی Low Fidelity Ware-frame 09:31
ایجاد منوی کشویی در صفحه اصلی با Low Fidelity 03:14
ایجاد فریم و بنر صفحه جزئیات صفحه اصلی Low Fidility 09:28
افزودن دکمه‌ها در صفحه جزئیات Low Fidelity Ware-frame 07:43
افزودن توضیحات مربوط به سری‌ها در Low Fidelity WareFrame در توضیحات 06:53
ادامه افزودن توضیحات در صفحه توضیحات Low Fidelity 07:07
ایجاد کارت برای اپیزودها در صفحه جزئیات Low Fidelity 06:41
تکمیل بخش اپیزود از صفحه جزئیات Low Fidelity Ware-frame 07:50
ایجاد صفحه مکث ویدیو اسکرین پاز Low Fidelity 06:42
ادامه صفحه پاز Low Fidelity 05:24
تکمیل صفحه پاز ویدئو Low Fidelity 08:04
تکمیل صفحه نمایش پخش ویدیو Low Fidelity Ware-frame 06:34
ایجاد صفحه فرود High Fidelity 05:43
تکمیل صفحه فرود High Fidelity 03:00
تکمیل صفحه طرح خرید High Fidelity 07:36
تکمیل صفحه پروفایل High Fidelity Ware-frame 01:58
ایجاد بنر در صفحه اصلی با High Fidelity 07:46
ایجاد کاروسل شماره 1 صفحه اصلی با High Fidelity - بخش 1 06:18
ایجاد کاروسل شماره 1 صفحه اصلی با High Fidelity - بخش 2 10:40
تکمیل کاروسل شماره 1 صفحه اصلی با High Fidelity 03:31
ایجاد کاروسل شماره 2 08:49
تکمیل کاروسل شماره 2 10:59
ایجاد کاروسل شماره 3 09:59
تکمیل کاروسل شماره 3 09:04
ایجاد کاروسل شماره 4 08:52
ایجاد کاروسل شماره 5 09:15
تکمیل کاروسل شماره 5 05:45
تکمیل کاروسل شماره 6 و 7 05:40
ایجاد کاروسل شماره 8 07:53
تکمیل کاروسل شماره 8 07:01
تکمیل صفحه اصلی High Fidelity 04:07
افزودن Modal Frame خروج از سیستم در صفحه اصلی 03:36
ایجاد صفحه جزئیات با High Fidelity 05:04
تکمیل صفحه جزئیات با High Fidelity 09:16
تکمیل هر سه صفحه نمایش ویدیویی 07:59
ایجاد نمونه کار 12:31

فصل 31: پروژه شبیه‌سازی رابط کاربری/تجربه کاربری اپلیکیشن موبایل Airbnb - 9

پروژه شبیه‌سازی رابط کاربری/تجربه کاربری اپلیکیشن موبایل Airbnb - لایو دمو 05:42
ایجاد یک فایل طراحی جدید 02:43
افزودن استایل رنگ 07:35
افزودن استایل تایپوگرافی 09:00
تکمیل استایل تایپوگرافی 05:32
افزودن آیکون‌ها در سیستم طراحی 09:24
ادامه افزودن آیکون‌ها در سیستم طراحی 08:04
ایجاد صفحه لندینگ Low Fidelity 05:41
ایجاد صفحه لاگین Low Fidelity 09:26
ادامه صفحه لاگین Low Fidelity 06:26
تکمیل صفحه لاگین Low Fidelity 06:29
ایجاد بخش بنر Low Fidelity در صفحه اصلی 09:45
ایجاد کارت در صفحه اصلی Low Fidelity 08:25
تکمیل کارت Low Fidelity در صفحه اصلی 05:26
ادامه صفحه اصلی Low Fidelity 09:46
تکمیل صفحه اصلی Low Fidelity 08:19
ایجاد بخش بنر صفحه جزئیات Low Fidelity 03:54
ادامه صفحه جزئیات Low Fidelity 09:48
افزودن جزئیات اضافی در صفحه اصلی Low Fidelity 07:54
افزودن بخش امکانات به صفحه جزئیات Low Fidelity 10:21
افزودن بخش نقشه در صفحه جزئیات Low Fidelity 09:10
ایجاد بخش Review در صفحه جزئیات Low Fidelity 08:20
تکمیل بخش Review در صفحه جزئیات Low Fidelity 05:57
ایجاد کارت جزئیات هاست صفحه جزئیات با Low Fidelity 08:40
تکمیل بخش جزئیات Host صفحه جزئیات با Low Fidelity 07:51
افزودن جزئیات ویژگی های اضافی در صفحه جزئیات با Low Fidelity 09:05
تکمیل صفحه جزئیات با Low Fidelity 09:21
ایجاد صفحه نقشه Low Fidelity 04:00
ایجاد کارت جزئیات محصول صفحه فرآیند رزرو low fidelity 07:07
ایجاد کارت review در صفحه فرآیند رزرو low fidelity 08:01
تکمیل صفحه فرآیند رزرو low fidelity 09:12
ایجاد صفحه فرآیند رزرو low fidelity - بخش 2 05:09
ایجاد فیلدهای ورودی در صفحه فرآیند رزرو low fidelity 08:36
تکمیل صفحه فرآیند رزرو low fidelity - بخش 3 09:49
ایجاد صفحه فرآیند رزرو low fidelity - بخش 3 (کارت Input) 08:41
تکمیل صفحه فرآیند رزرو low fidelity (کارت Input) 08:25
ایجاد صفحه فرآیند رزرو low fidelity - بخش 4 09:02
صفحه فرآیند رزرو low fidelity - بخش 4 - ادامه 09:00
تکمیل صفحه فرآیند رزرو low fidelity - بخش 4 04:46
ایجاد صفحه تایید رزرو low fidelity 09:05
ایجاد صفحه پروفایل low fidelity 08:08
تکمیل صفحه پروفایل low fidelity 08:50
تکمیل low fidelity ware-frame 09:10
ایجاد صفحه لاگین و صفحه فرود با High Fidelity 04:39
ایجاد بخش بنر صفحه اصلی High Fidelity 06:30
ایجاد کاروسل 1 صفحه اصلی High Fidelity 06:21
ایجاد کاروسل 2 صفحه اصلی High Fidelity 05:50
ایجاد کاروسل 3 صفحه اصلی High Fidelity 10:09
ایجاد کاروسل 4 و 5 صفحه اصلی High Fidelity 09:10
ایجاد کاروسل 6 صفحه اصلی High Fidelity 08:52
ایجاد کاروسل 7 صفحه اصلی High Fidelity 00:01
ایجاد کاروسل 8 صفحه اصلی High Fidelity 00:21
ایجاد کاروسل 9 صفحه اصلی High Fidelity 00:03
ایجاد صفحه جزئیات High Fidelity 01:02
تکمیل کاروسل review و صفحه جزئیات high fidelity 06:53
ایجاد صفحه نقشه High Fidelity 04:30
تکمیل صفحات high fidelity ware-frame 07:31
افزودن صفحات اضافی برای انتقال نمونه اولیه 05:26
ویژگی نمونه اولیه به صفحه فرود، صفحه ورود و صفحه اصلی 08:37
افزودن ویژگی نمونه اولیه انتقالی از صفحه اصلی به صفحه نقشه 09:05
افزودن ویژگی نمونه اولیه انتقالی به تمام صفحه 07:16
تکمیل نمونه اولیه 03:22
تنظیم سیستم طراحی 03:38

فصل 32: پروژه رابط کاربری/تجربه کاربری اپلیکیشن موبایل رزرو پرواز فیگما - 10

پروژه رابط کاربری/تجربه کاربری اپلیکیشن موبایل رزرو پرواز فیگما - لایو دمو 03:54
راهنمای پروژه رابط کاربری/تجربه کاربری اپلیکیشن موبایل رزرو پرواز فیگما 05:15
ایجاد فایل طراحی جدید و تنظیمات صفحه 02:19
ایجاد راهنمای استایل رنگی 07:22
ایجاد راهنمای استایل تایپوگرافی 08:12
تکمیل راهنمای استایل تایپوگرافی 10:27
کالکشن های آیکون 09:17
ایجاد صفحات انیمیشن low fidelity 08:55
ایجاد صفحه لندینگ low fidelity 04:59
ایجاد صفحه ورود low fidelity 10:18
تکمیل صفحه ورود low fidelity 10:00
ایجاد بخش بنر low fidelity wire-frame 09:58
ایجاد بخش جدید در صفحه اصلی low fidelity 10:24
ایجاد بخش featured صفحه اصلی low fidelity 09:06
ایجاد کارت بزرگ برای صفحه اصلی low fidelity 10:05
تکمیل صفحه اصلی low fidelity 08:46
ایجاد صفحه جزئیات رزرو پرواز 09:50
ایجاد نوار انتخاب زمان در صفحه جزئیات رزرو پرواز low fidelity 09:59
کارت بخش جزئیات سفر در صفحه جزئیات رزرو پرواز low fidelity - بخش 1 10:03
کارت بخش جزئیات سفر در صفحه جزئیات رزرو پرواز low fidelity - بخش 2 10:49
کارت بخش های جزئیات سفر در صفحه جزئیات رزرو پرواز low fidelity - بخش 2 09:32
تکمیل صفحه جزئیات رزرو پرواز low fidelity 06:57
ایجاد صفحه تأیید رزرو low fidelity 09:06
ادامه صفحه تأیید رزرو 10:19
ادامه صفحه تأیید رزرو سفر 07:01
تکمیل صفحه تأیید رزرو 04:26
ایجاد بخش جزئیات شخصی صفحه پروفایل low fidelity 10:53
ادامه ساخت صفحه پروفایل 07:26
افزودن گزینه‌های ویژگی در صفحه پروفایل low fidelity 10:14
تکمیل صفحه پروفایل low fidelity 04:16
بخش ایجاد کارت جایزه در صفحه جایزه low fidelity 06:45
تکمیل بخش کارت جایزه در صفحه جایزه low fidelity 04:31
ایجاد کارت ووچر برای صفحه جایزه low fidelity 09:39
تکمیل صفحه جایزه low fidelity 05:50
ایجاد صفحه مقاصد low fidelity 06:43
ایجاد کارت سفرهای مقصد در صفحه مقصد low fidelity 10:35
تکمیل صفحه مقصد low fidelity 06:38
ایجاد انیمیشن و صفحه فرود high fidelity 06:31
ایجاد صفحه ورود با high fidelity 03:54
ایجاد صفحه اصلی high fidelity 08:22
تکمیل صفحه اصلی high fidelity 10:31
افزودن انیمیشن‌ها در صفحه اصلی high fidelity 04:48
اسکرول افقی در صفحه اصلی high fidelity 06:32
ایجاد صفحه جزئیات رزرو پرواز high fidelity 08:24
افکت های هاور روی اسلات‌های تاریخ و زمان در صفحه جزئیات رزرو پرواز 09:51
کارت محاسبه هزینه سفر در صفحه جزئیات رزرو پرواز 07:58
افزودن منطق شرطی به تعداد مسافرین در جزئیات رزرو 09:01
افزودن مقدار محاسبه شده هزینه بر اساس تعداد کل مسافرین 04:00
افزودن شرایط به رادیو دکمه‌ها در صفحه جزئیات رزرو پرواز 11:48
تکمیل صفحه جزئیات رزرو پرواز high fidelity 08:30
ایجاد صفحه تأیید رزرو high fidelity 05:11
ایجاد صفحه پروفایل high fidelity 04:47
تغییر کارت تخفیف در صفحه جایزه با high fidelity 09:54
تکمیل صفحه جایزه high fidelity 10:14
ایجاد صفحه مقصد high fidelity 09:58
ادامه صفحه مقصد high fidelity 10:59
تکمیل کارت‌های مقصد high fidelity 04:22
ایجاد کارت‌های مقاصد پرطرفدار high fidelity 10:08
ایجاد کارت‌های مقاصد پر بازدید high fidelity 09:49
تکمیل کارت‌های مکان‌های تاریخی high fidelity 08:52
بخش سازماندهی فایل‌ها 07:06
افزودن نمونه کار به صفحات high fidelity 06:12
تکمیل افزودن نمونه کار به صفحات high fidelity 10:32