تمامی جلسات این دوره با رابط کاربری جدید فیگما (Ui3) مجددا ضبط و منتشر شده است.
سوال اصلی اینه: چرا فیگما؟! به همین سادگی اما مهم
این جلسه در مورد فیگما باهاتون صحبت میکنم
این که چرا فیگما رو برای طراحی رابط کاربری انتخاب میکنیم تو این قسمت جواب داده میشه 👈 این شروع یه داستان جذاب تو دوره ی فیگما پلاسه. مطمئن باش قراره مسیر فوق العاده ای رو با هم طی کنیم 🚀
مقدمه ای برای شروع به کار با این نرم افزار دوست داشتنی
خیلیا فک میکنن فیگما نرم افزاریه که به سختی میشه بهش دسترسی داشت. اما این طور نیست، فیگما انواع راه های ساده رو در اختیار ما میذاره تا بتونیم رایگان ازش استفاده کنیم
بهتون میگم هر بخش از نرم افزار چیه و چیکار میکنه
در این بخش موقع اش شده خیلی عملی با بخش های مختلف فیگما آشناتون کنم
در این بخش کار با فریم هارو به شما آموزش میدم
واقعا دونستن شورتکات های کیبورد فیگما، سراعت رو بالا میبره و به راحتی میشه در فیگما به این شورتکات ها مسلط شد.
ترسیم اشکال هندسی به روش های مختلف رو در این قسمت به شما یاد میدم
ازینجا به بعد همه چیزو در قالب یک پروژه جمع و جور واقعی به شما آموزش میدم
کار با ابزار و تنظیمات Text در فیگما در این قسمت آموزش داده میشه
همیشه مدیریت کردن لایه ها از اهمیت ویژگی ای برخورداره! جلوتر بیشتر این مورد رو درک میکنین
این قسمت به شما یاد میدم طرحتونو به راحتی ترازبندی کنین
تنظیمات مربوط به رنگ Fill و Stroke
کار با استایل ها خیلی رو سرعت شما تاثیر گذاره! این قسمت به شما در موردش میگم
کامپاننت ها میتونن کار رو برای شما مثل استایل ها به شدت راحت و جذاب کنن
صفحات برای مدیریت پروژه خیلی لازم و ضروریه. این قسمت میریم سراغش
بعد از تموم شدن کار وایرفریم، خیلی جذاب میشه اگه طرح هارو با فلش به هم وصل کنیم. به این میگن ترسیم فلوچارت
کامیونیتی فیگما از قشنگترین امکانات فیگماست – دنیای فایلهای طراحی رایگان
آشنایی با تنظیمات Auto layout
این قسمت دانشتون در مورد auto layout کمی عمیق تر میشه
این بخش رو با تکمیل طراحی وایرفریم به پایان میرسونیم تا آماده بخش بعدی بشین
در این بخش موقع اش شده خیلی عملی با بخش های مختلف فیگما آشناتون کنم
این قسمت برای شروع طراحی رابط کاربری آماده میشین
اندازه فریم باید چه عددی باشد؟!
تنظیم Grid Layout و استایل بندی آن
استایل های رنگی رو به شما معرفی میکنم و آموزش میدم چطور ازشون استفاده کنین
اصول ایجاد استایل برای تایپوگرافی به دقت تو این جلسه برای شما تشریح میشه
روش های درج تصویر در فیگما رو بهتون میگم
در این قسمت خیلی موجز در مورد ریسپانسیو صحبت میکنم و شما رو برای یادگیری کامل اون آماده میکنم
تنظیمات Boolean Operation در فیگما در این قسمت مورد بررسی قرار میگیره
حالا که استایل هارو ساختیم نوبت به این میرسه ازشون استفاده کنیم
نوبت به این میرسه برای بخش های مختلف کامپاننت ایجاد کنیم، این قسمت به سراغ نو بار میرم
ایجاد ٰVarient کامپاننت به روش Component Set رو به شما آموزش میدم
طراحی صفحه Calendar به صورت کاملا ریسپانسیو
طراحی صفحات Moods برای کامل شدن بخش یو آی
در این بخش هم به سراغ آخرین صفحات رابط کاربری این پروژه میریم و با هم طراحیش میکنیم
تو این بخش به شما یاد میدم از آپشن هایی که فیگما برای پرزنت کارها داره استفاده کنین
بهتون یاد میدم با بخش های پرزنت و پریویو در فیگما کار کنین
با این آموزش یاد میگیرین طرحی که روی فیگما مشغول طراحیش هستین رو توی گوشیتون به صورت زنده ببینین
خیلی مواقع ما لازم داریم صفحات طولانی طراحی کنیم تو این قسمت بهت میگم چیکار کنی که کارت حرفه ای باشه
اگه برات سواله که چطوری باید کارامونو برای کارفرما و یا تیم دولوپ بفرستیم، این جلسه در موردش صحبت میکنم
حتما برات سواله که تیم دولوپ چه چیزی از فیگما میتونه بدست بیاره تا توی کدنویسی کمکش کنه. باید بگم همه چیز این جلسه بهش میپردازیم
همیشه نیاز میشه از بعضی آبجکت ها در فیگما خروجی بگیریم این قسمت موضوعمون همینه
تو این آموزش بهتون یاد میدم که چطوری میتونین از کامپاننت ها و استایل های یک پروژه توی بقیشون هم استفاده کنین
تو این ویدیو بهتون یاد میدم بقیه چطوری برای فایلاشون تامبنیل میذارن
این بخش بهت در مورد این میگم که چطوری میتونی از امکانات پریمیوم فیگما به صورت رایگان استفاده کنی
تا 2 سال از فیگما رایگان استفاده کن
دونستن یه سری نکات خیلی مهمه تا بتونی بهترین عملکرد و کیفیت رو داشته باشی
شاید برای خیلیا بدیهی باشه اما خیلیای دیگه هنوز معنی دقیق پیکسل و تاثیری که روی کیفیت داره رو نمیدونن این ویدیو برای شماست
تو این قسمت در مورد پوینت صحبت میکنیم. واحدی که کلی کار ما رو راحت میکنه
تو این ویدیو به این میپردازیم که با توجه به مواردی که در مورد پوینت و پیکسل دونستیم چیکار کنیم که همه جا کارمون با کیفیت باشه
تو این بخش به سراغ رنگ ها میریم. خیلی مهمه که رنگ درستی انتخاب و استفاده کنیم
تو این ویدیوی کوتاه با ۵ تا از تئوری های رایج رنگ آشناتون میکنم
این قسمت به سراغ یه سری سایت خفن که میتونیم ازشون رنگ های خودمونو تهیه کنیم میرم
شاید خیلی پر اهمیت بنظر نرسه ولی نام گذاری رنگ ها بشدت دارای اهمیته.
حالا که بهتون گفتم رنگو از کجا بیاریم و چجور نامگذاری کنیم نوبت میرسه به این که چطور ازش استفاده کنیم
خیلی جمو جور بهتون میگم که چطور باید پروتوتایپ ایجاد کنیم
هر وقت صحبت از پروتوتایپ میشه اولین چیزی که باید بدونیم، فلو هست. این قسمت به سراغش میریم
این قسمت به شما میگم که با چه روش هایی میتونیم بخش های مختلف رو به هم متصل کنیم
وقتی یک اینتراکشن ایجاد میکنیم، پنل پروتوتایپ برای ما باز میشه. این قسمت بخش های این پنل رو بررسی میکنم
مباحث حرفه ای و پیشرفته Auto layout و Constraint به پنل دانشجویان اضافه شد.
نوبت این رسیده حرفه ای تر به سراغ آپشن های فیگما بریم و مجدد بررسیشون کنیم
همونطور که قبلا هم به شما در موردش گفتم با این ابزار کارهای زیادی میشه انجام داد حتما بعد از هر جلسه موارد گفته شده رو تمرین کنین
تو این قسمت کمی عمیق تر شما رو با کانسترینت افقی و عمودی آشنا میکنم
به جاهای جالب کانسترینت رسیدیم. اینجا بهتون میگم چطوری میشه با کانسترینت و گرید ها یک تقسیم بندی باحال ایجاد کنین
اینجا جالب میشه که میتونین برای هر فریم یک گرید درست کنین و بهش تنظیمات کانسترینت رو بدین!
آیا میتونیم همه جا از این تکنیک استفاده کنیم؟ این جلسه یکی از محدودیت های اونو میگم
بعضی چیزا تو صفحه باید ثابت باشن مثل هدر و نوبار. این جلسه بهتون میگم چطوری میشه اینکارو کرد
تو این بخش هر چیزی که برای طراحی Responsive بهش نیاز دارین رو به شما آموزش میدم
حالا که با Constraint عمیقا آشنا شدین و دونستین باهاش چه کارهایی میتونیم انجام بدیم، نوبت به یادگیری عمیق Auto layout میرسه
شروع کار با تنظیمات Auto layout.
این قسمت جاهایی که میتونین از این آپشن استفاده کنین رو به شما میگم
به سراغ منوی این آپشن میریم و شما رو با بخش های اون آشنا میکنم
حالا که با منوی این آپشن آشنا شدین، برگردیم و حرفه ای تر بهتون بگم توی این منو چخبرمونه!
ریسایز رو قبلا بهتون گفتم حالا نوبت به این رسیده تخصصی تر باهاش کار کنیم
بهتون یاد میدم که با اوتولیاوت یک کارت ریسپانسیو طراحی کنین
تو این آموزش چند قدم جلوتر میریم و یک کارت با چند ستون رو به صورت ریسپانسیو طراحی میکنیم
قبلا به شما گفتم که در کامپاننت ها هم میتونیم از این آپشن استفاده کنیم. بریم سراغش
جادوی Auto layout رو تو این جلسه بهتون آموزش میدم. با دقت همراهم باشین
همونطور که بهتون گفتم ما میتونیم فریم های تو در تو داشته باشیم. این جلسه بهتون میگم چطوری میشه برای همشون Auto layout رو اعمال کنیم
یکی از آپشن های فیگما اینه که میتونیم یک آبجکت رو از قلب Auto layout خارج کنیم و هر جا که دوست داشتیم قرارش بدیم. این جلسه در همین مورد صحبت میکنم
تو این جلسه چنتا کارت خفن و ریسپانسیو رو با هم طراحی میکنیم
نوبت به طراحی یک صفحه کامل و ریسپانسیو رسیده همراهم باشین
تو این جلسه در مورد محدودیت های Auto layout صحبت میکنم
مباحث حرفه ای و پیشرفته BreakPoint ها،Local Variable ها، Component ها و دیزاین سیستم اختصاصی کاکتوس به پنل دانشجویان اضافه شد.
بریک پوینت ها نقاطی هستند که در آن ها تغییرات ریسپانسیو صورت میگیره
چرا باید برای اندازه های مختلف صفحه نمایش طراحی کنیم
گاهی یه جابه جایی ساده میتونه همه چیزو حل کنه!
نحوه نوشتن کد سی اس اس بریک پوینت ها
بررسی اندازه های استاندارد برای بریک پوینت ها
شروع به کار با بریک پوینت ها
آموزش نحوه تست ریسپانسیو از کامپاننت ها
انتقال اصول طراحی به تیم های طراحی و توسعه از طریق مستندنویسی
تکنیکی ساده برای رفع محدودیتهای بریک پوینت در فیگما
طراحی لی اوت های متنوع برای انواع صفحه نمایش
تایپوگرافی رو در بریک پوینت ها فراموش نکن
معرفی پلاگین بریک پوینت
لوکال وریبل ها از امکانات جذاب فیگما برای مدیریت پروژه های طراحی رابط کاربریست.
آشنایی اولیه با لوکال وریبل ها
آموزش ساخت لوکال وریبل در فیگما
مدل های مختلف لوکال وریبل ها
آموزش عملی ساخت لوکال وریبل ها
طراحی صفحات بوسیله لوکال وریبل ها
استفاده حرفهای از لوکال وریبل ها
در این بخش با تنظیمات کامپاننتها بیشتر آشنا خواهید شد. این بخش پیش نیاز ورود به بخش دیزاین سیستم است.
مدلهای مختلف از یک کامپاننت – Component variants
انواع پراپرتیها در مدیریت کامپاننت
پراپرتیهای نست شده درون یک کامپاننت
در این بخش با تمام دانشی که در طول دوره به دست آورده اید،شروع به طراحی یک دیزاین سیستم اختصاصی میکنیم.
معرفی و بررسی دیزاین سیستم های معروف
شروع به کار در طراحی دیزاین سیستم
ساخت استایل های رنگی
ساخت حالتهای رنگی
انتقال استایل های رنگی به لوکال وریبل
ساخت استایل تایپوگرافی
استایلهای ترکیببندی
استایل المانهای بیشتر
بخشی از دیزاین سیستم برای نمایش اطلاعات به صورت سریع
طراحی انواع مدل های دکمه در طراحی رابط کاربری
طراحی نمایش چنتایی دکمه ها در کنار یکدیگر
کامپاننت مربوط به کارت ها در دیزاین سیستم
طراحی کانستراکتیو المنت برای نمایش اطلاعات اطلاعات به صورت لیستی
چند نکته مهم که در ادامه باید در نظر گرفته شود
طراحی چیپ ها برای استفاده بعنوان تگ و… در طراحی رابط کاربری
دکمه های دوگانه که در دیزاین بخش های مختلف بسیار کاربردی است
طراحی فیلد های ورودی داده در دیزاین سیستم
طراحی چک باکس در دیزاین سیستم
طراحی دکمه رادیو در دیزاین سیستم
آپدیت تو راهه! مباحثی که در آپدیت بعدی به دوره اضافه خواهند شد: بررسی تجربه کاربری (Ux) به صورت تخصصی | کیس استادی و پیشبرد یک پروژه واقعی و حرفه ای
در این بخش به شما میگم که نرم افزار رو از کجا دانلود کنین، چطور نصب کنین که بشه داخلش فارسی نوشت و …
دراین بخش شما رو با دوره ایلاستریتور جامع آشنا میکنم
در این ویدیو شیوه نصب نرم افزار رو با هم بررسی میکنیم
به سراغ بخش های داخلی نرم افزار ایلاستریتور میریم
قبل از اینکه بخوایم بریم به سراغ ابزارها، شمارو در یک بخش کوتاه با ابزارها آشنا میکنم
در این بخش شما با تمامی ابزارهایی که در منوی تولبار ایلاستریتور وجود داره به صورت عملی آشنا میشین
اولین آموزش ما با آموزش نحوه جابه جایی در ایلاستریتور آغاز میشه.
بهتون در مورد کار با ابزارهای رسم برداری آموزش میدم
در این قیمت به سراغ ابزار براش میریم و کاربردشو به صورت عملی به شما آموزش میدم
نوشتن در ایلاستریتور دارای آپشن های مختلفیه که در این بخش به سراغشون میریم
دونستن این نکته که از کجا میشه فونت تهیه و نصب کردن در این ویدیو به شما آموزش داده میشه
در این جلسه کلی نکته خفن در خصوص ابزارهای ترنسفورم رو به شما آموزش میدم
در این ویدیو کار با ابزارهای برش رو آموزش میبینین
این ابزار به شما امکان انجام کارهای باحالی رو میده، در این قسمت در موردش صحبت میکنیم
یکی از خذاب ترین مدل های رنگ آمیزی رو در این قسمت با هم یاد میگیریم
نیاز به انتقال رنگ یا تنظیمات از یک آبجکت به آبجکت دیگه داری؟ این جلسه در موردش صحبت میکنیم
در این جلسه در مورد ابزارهای مودیفای صحبت میکنیم
این جلسه یاد میگیری به تصویرت نسبت های پرسپکتیو جالبی بدی
این جلسه یکی از ابزارهای ناب ایلاستریتور رو با هم بررسی میکنیم
این ویدیو در خصوص ابزار آرتبوردها صحبت میکنیم
یاد میگیری چطور از ابزار زوم میشه استفاده کرد
کار با ابزار پوپت رو آموزش میدم بهتون تا باهاش فرم های مختلف به وکتور بدین
با این ابزار کار رنگ آمیزی شما به شدت آسون میشه
در این ویدیو کار با ابزار پرسپکتیو رو بهتون آموزش میدم
در این ویدیو یاد میگیرین از ابزار های رسم نمودار استفاده کنین
در این ویدیو یاد میگیرین با ابزار سیمبل کار کنین
در این ویدیو یاد میگیرین با ابزار اسلایس کار کنین
در این بخش تمامی پنجره هایی که در ایلاستریتور وجود داره رو با هم بررسی میکنیم و به شما کاربردشون رو میگم
تمامی تنظیماتی که برای کار با متن بهش نیاز دارین در این قسمت به شما آموزش داده میشه
در این ویدیو آموزش میبینین که چطوری باید لایه هارو مدیریت کنین
تمامی پنجره های مربوط به رنگ ها در این بخش آموزش داده میشه
کار و مدیریت لینک هایی که در فایل ایلاستریتور استفاده میکنین در این ویدیو بررسی میشه
به سراغ یکی از اصلی ترین پنجره های ایلاستریتور میریم و کار باهاش رو به شما آموزش میدم
در این قسمت به شما کار با پنجره لایه هارو میگم
بهتون آموزش میدم از image trace برای تبدیل تصاویر پیکسلی به برداری استفاده کنین
در این بخش پایانی دوره مقدماتی به سراغ منوهای نرم فزار ایلاستریتور میریم
به بررسی بخش های مختلف منوی فایل در این قسمت میپردازیم
به بررسی بخش های مختلف منوی ادیت در این قسمت میپردازیم
به بررسی بخش های مختلف منوی آبجکت در این قسمت میپردازیم
به بررسی بخش های مختلف منوی تایپ که تمامی تنظیمات مربوط به نوشتن در اون هست در این قسمت میپردازیم
به بررسی بخش های مختلف منوی سلکت که مربوط به انتخاب و تنظیمات اون هست در این قسمت میپردازیم
در این جلسه تمامی افکت هایی که در نرمافزار ایلاستریتور در اختیار ما قرار گرفته رو بررسی میکنیم
در این بخش به سراغ منوی ویو میریم و به شما آپشن هایی که این منو داره رو معرفی میکنم
در این بخش با کلی تکنیک خفن و درجه یک از ایلاستریتور رو آموزش میدم
آموزش اجرای تکنیک لو پولی
آموزش تکنیک اجرای پرسپکتیو
آموزش تکنیک اجرای ایزومتریک
آموزش تکنیک اجرای لینوکات
آموزش تکنیک اجرای گلس مورفیسم
آموزش انتخاب رنگ حرفه ای
آموزش کار با ابزار مش به صورت حرفه ای
آموزش تکنیک پیکسل آرت در ایلاستریتور
آموزش تکنیک نئون در ایلاستریتور
آموزش تکنیک اجرای رترو در ایلاستریتور
آموزش تکنیک اجرای سایه رئال در ایلاستریتور
در این بخش به شما یاد میدم برای سوشال مدیا خصوصا اینستاگرام طراحی کنین
در این متن نکات اولیه طراحی اینستاگرامی برای شما آورده شده است
اصول اولیه طراحی یک پروفایل خوب اینستاگرامی
به شما در این آموزش طراحی یک پست اینستاگرامی را آموزش میدهم
در این بخش به سراغ طراحی یک پروفایل اینستاگرامی میرویم
طراحی اولین سبک از طراحی های اینستاگرامی
طراحی اولین سبک از طراحی های اینستاگرامی
در این بخش به شما در مورد یبک های طراحی لوگو میگم
در این ویدیو خیلی جمو جور به شما میگم در طراحی لوگو به چه اصولی باید عمل بشه
این آموزش در مورد دو مدل ابتدایی در طراحی نشان صحبت میکنیم
طراحی لوگو برند بیدلی
طراحی لوگو برند همساز
طراحی لوگو برند پل مدیریت
طراحی لوگو برند بولتکس
طراحی لوگو برند شمیم علم
در این ویدیو به شما نکاتی در خصوص ارائه لوگو یاد میدم
در این بخش تجربیات خودم رو در خصوص ورود به بازار کار فریلنسری بهتون میگم
آموزش نحوه فعالیت در لینکدین linkedin
در این قسمت با شما در مورد ورود به دنیای طراحی رابط کاربری مواردی رو میگم
تا حالا با اسپات پلیر کار نکردی؟ این ویدیو رو ببین.
آموزش وارد کردن کلید لایسنس و مشاهده جلسات
در این ویدیو به شما توضیح میدهم چگونه از وبسایت قلموم دوره خریداری کرده و از طریق اسپات پلیر به محتوای آن دسترسی پیدا کنید.
سلام 👋!
لطفا شماره موبایل خود را وارد کنید
ورود شما به معنای پذیرش شرایط قلموم و قوانین حریمخصوصی است