درباره دیزاین

سایر مقالات مربوط به UX آمانج را مطالعه کنید که همگی منابع معتبری دارند.

 

کارگاه طراحی رابط کاربری UI حرفه ای

2021 UI Design Open the gates OTG

 

طراحی رابط کاربری یکی از جذاب‌ترین و پر درآمدترین مشاغل دنیاست. هیچ مرزی برای فعالیت تجاری در این زمینه وجود ندارد و بدون سرمایه اولیه می توان به راحتی از این توانمندی کسب درآمد نمود. شما میتوانید بدون سابقه در طراحی گرافیک یا برنامه نویسی به این رشته وارد شوید و با تلاش و ممارست به موفقیت های چشمگیری دست پیدا کنید. طراحی رابط کاربری یکی از خلاهای کسب و کارهای دیجیتالی امروز است و موقعیت های شغلی زیادی برای این رشته در ایران و سراسر دنیا وجود دارد. در این کارگاه شما با متد های روز دنیا و استانداردهای بین المللی آموزش خواهید دید و میتوانید در هر نقطه از جهان از این توانایی استفاده نمایید.

 

2021 ui design

در این کارگاه ضمن آموزش مراحل و تکنیک های روز طراحی UI به صورت عملی و با نظارت مستقیم مدرس، اصول اولیه طراحی UX یا تجربه کاربری نیز با توجه به پروژه در حال اجرا به هنرجو آموزش داده خواهد شد. شما در پایان کارگاه توانایی طراحی UI استاندارد برای یک وبسایت و همچنین طراحی صفحات داخلی آن را خواهید داشت. می آموزید چطور بریف درستی دریافت کنید، پیش طرح مناسبی پیشنهاد دهید، مودبورد طراحی کنید و اینکه چطور پروژه را از ابتدا تا انتها مدیریت کنید .این کارگاه در 10 جلسه (مجموعا 25 ساعت)، به صورت آنلاین برگزار خواهد شد.

 

در پایان این دوره می توانید به صورت حرفه ای شغل طراحی UI را برای خود انتخاب کنید.

ابزار های مورد نیاز جهت کارگاه

شما جهت شرکت در این کارگاه به این ابزار ها و نرم افزار ها نیاز دارید. به جز لپ تاپ شخصی کلیه ابزار ها و نرم افزار ها در کلاس به صورت رایگان در اختیار شما قرار خواهد گرفت. لپ تاپ های مک حتما به آخرین ورژن MAC OS آپدیت باشند. لپ تاپ های ویندوزی حتما ویندوز 10 و رم 8 گیگابایت داشته باشند.

 

پیش نیاز های کارگاه

برای شرکت در این کارگاه پیش نیازی وجود ندارد و در صورت آشنایی با کامپیوتر و علاقه به این رشته می توانید در دوره شرکت کنید.

 

خطکش طراحی UI

پکیج پستی دوره چیست؟

پیش از شروع کلاس یک پکیج پستی برای شما ارسال می شود. در این پکیج اقلام زیر وجود دارد:

 

خط‌کش مهندسی طراحی UI/UX استیل استاد امیرحسین اسماعیلی

دفترچه طراحی UI اختصاصی کارگاه

یک عدد اتود طراحی

یک عدد ماژیک قلمویی

سر فصل های آموزشی در جلسات کارگاه

جلسه اول Intro

در جلسه اول این کارگاه شما ضمن اینکه با طراحی رابط کاربری آشنا میشوید ، استفاده از دو نرم افزار محبوب و پر استفاده برای این موضوع را می آموزید. برای کاربران ویندوز نرم افزار Adobe XD و برای کاربران مک نرم افزار Sketch آموزش داده می شود. همچنین با قوانین و سیستم Atomic Design آشنا خواهید شد تا بتوانید براساس این سیستم پروژه را به صورت پیش رونده به سرانجام برسانید.

 

طراحی رابط کاربری چیست؟

طراحی رابط کاربری UI چه تفاوتی با طراحی تجربه کاربری UX دارد؟

شناخت برند و اهداف آن در طراحی رابط کاربری

Atomic Design اتمیک دیزاین چیست؟ Atomic Design 2 چه تفاوتی با ورژن یک دارد؟

نمونه کار 1

جلسه دوم UI Fundamental

در این جلسه شما با گریدبندی در طراحی رابط کاربری آشنا خواهید شد و میتوانید برای پروژه خود گریدبندی مناسبی انجام دهید. همچنین با قوانین نظم درونی طراحی رابط کاربری شامل ترازبندی ها ، ابعاد و اندازه ها و همچنین فاصله ها و اهمیت المنت ها آشنا خواهید شد. تشخیص نور و سایه و عمق و پرسپکتیو دیگر مهارت هایی است که در این جلسه خواهید آموخت. از این جلسه تکالیف خانگی آغاز خواهد شد و شما تا پیش از جلسه بعدی فرصت خواهید داشت تا تکالیف خود را برای مدرس ارسال نمایید. از جلسه سوم 15 دقیقه پیش از شروع کلاس تکالیف بررسی میشود و ایرادات احتمالی آن برطرف خواهد شد.

 

Grids آشنایی با گریدبندی

Spacing فاصله ها

Sizing ابعاد

Alignment ترازبندی

Light & Shadow نور و سایه

تجزیه و تحلیل زیبایی شناختی پروژه

جلسه سوم طراحی وایرفریم WireFrame Design

تهیه وایرفریم یا پیش‌طرح نقشه راه یک طراح رابط کاربری حرفه‌ای است. استفاده از وایرفریم میتواند علاوه بر راحتی تجزیه و تحلیل و شناسایی بخش های مختلف رابط کاربری پروژه، میتواند به شما در هم اندیشی با کارفرما جهت رفع ایرادات احتمالی پیش از شروع فرآیند طراحی کمک کند. در این جلسه می آموزید که چگونه یک وایرفریم دستی بکشید، متد طراحی وایرفریم چابک را تجربه میکنید و همچنین میتوانید با استفاده از نرم افزار وایر فریم های Hi-Fi و Lo-Fi تهیه نمایید. همچنین با مودبورد، اهمیت استفاده و مدل های طراحی آن آشنا خواهید شد.

 

طراحی وایرفریم دستی

طراحی وایرفریم چابک

طراحی Lo-Fi

طراحی Hi-fi

طراحی مودبورد

آموزش طراحی ui

جلسه چهارم رنگ ها Colors

جلسه چهارم این کارگاه یکی از جذاب ترین بخش های این مجموعه خواهد بود. در این جلسه همه چیز را در مورد رنگ ها می آموزید و میتوانید با شناخت کاملی از رنگ ها و هارمونی ها، کالیته های رنگی جذاب و خیره کننده ای را بیافرینید. با تئوری رنگ ها و اهمیت استفاده صحیح از آنها آشنا خواهید شد. می آموزید چطور اولویت بندی کنید، غلظت و شفافیت رنگ ها را استاندارد سازی نمایید و Gradient های جذاب و دوست داشتی بسازید. همچنین در بخشی از این جلسه متدهای بازی با رنگ خاکستری که مهمترین رنگ در طراحی رابط کاربری است می شناسید تا در پروژه های واقعی از این متد ها استفاده نمایید.

 

تئوری رنگ ها

تفاوت RGB و HSB

متدهای استفاده از HSB

طراحی پالت رنگ استاندارد

انتخاب رنگ اصلی

وزن دهی به رنگ ها

Adjustment

بازی با خاکستری مهمترین رنگ

غلظت و شفافیت در رنگ ها

Gradients

متد های انتخاب رنگ

نمونه 2

جلسه پنجم تایپوگرافی Typography

کار با فونت ها همیشه جذاب است. این ایده غلط که سایت های فارسی زیبا نمیشوند را فراموش کنید. اگر با فونت ها و تایپوگرافی های فارسی آشنا باشید و متد های آن را فرا بگیرید ، متوجه خواهید شد که قلم های فارسی قابلیت های نهفته زیادی دارند. یکی از مهمترین بخش های این جلسه مربوط به استفاده صحیح از وزن ها و اندازه ها در طراحی رابط کاربری خواهد بود و به شما کمک میکند تا اولویت ها را با این تکنیکهای ساده برای کاربر نهایی مشخص نمایید.

 

انتخاب فونت مناسب

اصطلاحات تایپوگرافی

اندازه فونت در بخش های مختلف

افکت های فونت

جلسه ششم 1 Interface Molecules

Lists & Tables طراحی لیست ها و جدول ها

Images تصاویر و عکس ها

Icon Design طراحی آیکون

Vector Editing ادیت وکتور

Shapes طراحی اشکال

Cards طراحی کارت ها

Tycons طراحی تایکون ها

طراحی ui موبایل

 جلسه هفتم 2 Interface Molecules

Carousel طراحی انواع کروسل ها

Sliders طراحی اسلاید

Logo استانداردهای لوگو

Menu طراحی منو ها

Buttons طراحی دکمه ها

Form Controls طراحی فرم ها

جلسه هشتم Interface Organism 1

Header

Tycon Line

Text Area

نمونه 3

جلسه نهم Interface Organism 2

Land Line

Card Line

Carousels

Footer

جلسه دهم Branding & Presentation

خروجی پروژه Project Export

آشنایی با فرمت های تصویری SVG , PNG , JPG , Webp

تکنیک های برندینگ در طراحی رابط کاربری Branding Tips

نمونه 5

ویدیوهای تکمیلی

آموزش استفاده از نرم افزار Adobe XD

آموزش استفاده از نرم افزار Sketch