دوره آموزشی طراحی رابط کاربری UI

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

دوم اینکه در کنار مباحث عملی ، آموزشی های علمی و مبانی تئوری نیز به شما آموزش داده خواهد شد تا هم از نظر توانایی عملی بتوانید پروژه های آینده خود را تامین کنید و هم از نظر علمی بتوانید تحلیل های صحیحی را انجام دهید .

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

 

اطلاعات دوره:

نرم افزار آموزشی تعداد جلسات زمان هر جلسه هزینه دوره برای هر نفر به صورت خصوصی مکان برگزاری
آموزش طراحی UI با کمک نرم افزار Adobe Photoshop 7 جلسه 1 ساعت 1.300.000 تومان تهران ، دانشگاه تربیت مدرس
آموزش طراحی UI با کمک نرم افزار Adobe XD 5 جلسه 1 ساعت 900.000 تومان

 

مباحث اولیه

  • معرفی انواع سبک های گرافیکی طراحی وب اعم از فانتزی ، فلت ، سکیومورفیزم ، بلار و …
  • نحوه ی انتخاب سبک گرافیکی برای طراحی یک وب سایت
  • مقایسه و معرفی المنت های سبک های مختلف و بررسی ویژگی های منحصر به فرد آنها
  • مقایسه و معرفی رنگ های قابل استفاده در سبک های مختلف گرافیکی
  • معرفی نرم افزار های مورد استفاده در طراحی گرفیک وب
  • معرفیUser Experience و کاربر آن در طراحی UI صفحات وب
  • معرفی فریم ورک Bootstrap و امکانات آن در طراحی و کدنویسی
  • معرفی مختصر Material-UI یکی از فرم وورک های مربوط به طراحی UI
  • قواعد طراحی بر اساس فرم وورک بوت استرپ
  • معرفی ساختار Bootstrap Grid System جهت طراحی منطبق با بوت استرپ
  • قواعد طراحی ریسپانسیو برای رزولوشن های مختلف در دستگاه های مختلف مانند موبایل ، تبلت و …

 

سرفصل های دوره آموزش طراحی UI با نرم افزار Adobe Photoshop

سرفصل های دوره آموزش طراحی UI با نرم افزار Adobe XD

مباحث اولیه در نرم افزار فتوشاپ

  • تنظیمات نرم افزار فتوشاپ و شخصی سازی آن
  • مفهوم سند و ایجاد صحیح یک سند گرافیگی
  • نحوه ی استاندارد چیدمان عناصر و بخش ها در یک قالب وب سایت
  • معرفی انواع واحدهای اندازه گیری و انتخاب صحیح واحد اندازه گیری
  • مفهوم رزلوشن و انتخاب رزلوشن صحیح

 

ابزار ها در فتوشاپ

  • مفهوم Mode ها و کانال های رنگی مانند RGB , CMYK , Grayscale و …
  • مفهوم Ruler و Snap و Guideline ، تنظیم و استفاده ی صحیح از آن ها
  • مفهوم Layer و استفاده از Layer ها در فایل پروژه
  • مفهوم Transform و انواع آن و روش استفاده از آنها
  • مفهوم Rectangular Marquee Tool و نحوه استفاده از آن
  • مفهوم Polygonal Lasso Tool و نحوه استفاده از آن
  • مفهوم Magic Wand Tool و نحوه استفاده از آن
  • مفهوم Crop Tool و نحوه استفاده از آن
  • مفهوم Eyedropper Tool و نحوه استفاده از آن
  • مفهوم Brush Tool و History Brush Tool و نحوه استفاده از آن
  • مفهوم Clone Stamp Tool و نحوه استفاده از آن
  • مفهوم Eraser Tool و نحوه استفاده از آن
  • مفهوم Gradiant Tool و نحوه استفاده از آن
  • مفهوم Blur Tool و نحوه استفاده از آن
  • مفهوم Direct Selection Tool و نحوه استفاده از آن
  • مفهوم Shape Tool و نحوه استفاده از آن
  • مفهوم Hand Tool و نحوه استفاده از آن
  • مفهوم Zoom Tool و نحوه استفاده از آن
  • مفهوم Trim و نحوه استفاده از آن
  • مفهوم Canvas Size و نحوه استفاده از آن

 

رنگ ها در طراحی گرافیک وب

  • روانشناسی رنگ و انتخاب صحیح رشته رنگ
  • روش های انتخاب رنگ
  • رنگ در طراحی وب و امکانات پنجره های انتخاب رنگ
  • معرفی نرم افزارها و سایت های جانبی برای انتخاب و ست کردن رنگ ها
  • انواع رنگ های جامد (Solid) ، شیب رنگ (Gradient) و نحوه ی ایجاد و استفاده از آنها
  • مفهوم Level و Hue و نحوه استفاده از آن ها

 

تصویر در طراحی وب

  • نحوه ی صحیح ذخیره سازی و بهینه سازی تصاویر برای استفاده در وب
  • انواع پسوندهای ذخیره سازی تصویر برای استفاده در وب
  • معرفی تصاویر SVG ) آینده تصاویر وب (
  • نحوه صحیح استفاده از تصاویر ، پترن ها و رنگ ها بعنوان پس زمینه ی قالب گرافیکی وب سایت
  • مفهوم شفاف بودن (Transparent) و استفاده از تصاویر شفاف در طراحی

 

برش دهی قالب گرافیکی وب سایت

  • مفهوم برش دهی و ضرورت برش بندی قالب گرافیکی
  • ابزارهای موجود در بخش برش دهی تصاویر
  • ذخیره سازی برش ها

 

متن در طراحی قالب گرافیکی

  • استفاده صحیح از فونت های مناسب
  • سایز مناسب و استاندارد متون در قالب گرافیکی و وب
  • روانشناسی رنگ و انتخاب صحیح رنگ برای متون
  • جلوه های ویژه و افکت های مناسب برای متون
  • ارائه فونت های استاندارد و مکمل به هنرجویان

 

آموزش استفاده از ابزار های خاص

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

 

به زودی تکمیل میگردد