آموزش UI/UX و طراحی وب با استفاده از Adobe XD 2018 - طراحی تجربه کاربری

UI/UX & Web Design using Adobe XD 2018 - User Experience Design

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

*نکته مهم:  سلام به همه. اخیراً من روی نسخه به روز شده این دوره کار کرده ام تا برخی از نسخه های جدیدتر Adobe XD را پوشش دهم. اگر مایلید دوره جدید را ببینید، آن را بررسی کنید!

------------------------------------------- ---------------------------------------

نمای کلی

سلام، نام من دن است، من یک مربی دارای گواهینامه Adobe هستم. ما با هم می خواهیم نحوه استفاده از Adobe XD را یاد بگیریم. ما از این ابزار طراحی UX و UI برای ایجاد یک تجربه کاربری ساده با رابط کاربری زیبا استفاده خواهیم کرد.

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

هدف این دوره برای افرادی است که در طراحی تجربه کاربری جدید هستند. ما درست از ابتدا شروع می کنیم و قدم به قدم راه خود را طی می کنیم.

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

ما نمونه اولیه طراحی وب سایت و طراحی برنامه تلفن همراه را می سازیم، صفحات را به هم متصل می کنیم و همچنین تعامل کامل را برای آزمایش کاربر اضافه می کنیم. من تمام ترفندهای مخفی داخل Adobe XD را با شما به اشتراک می‌گذارم که به شما کمک می‌کند تا کارهای تکراری را سرعت بخشید و ما تمام راه را برای صادرات فایل‌های صحیح و ایجاد مشخصات طراحی شما کار خواهیم کرد.

پروژه‌ای وجود دارد که می‌توانید در طول این کلاس تکمیل کنید که به توسعه مهارت‌های شما کمک می‌کند و چیزی برای نمونه کارها به شما می‌دهد.

اکنون زمان آن است که خود را ارتقا دهید و Adobe XD را یاد بگیرید.

الزامات چیست؟

  • به یک کپی از Adobe XD 2018 یا بالاتر نیاز دارید. یک نسخه آزمایشی رایگان از Adobe قابل دانلود است.
  • هیچ تجربه طراحی قبلی لازم نیست.
  • هیچ مهارت قبلی Adobe XD مورد نیاز نیست.

از این دوره چه چیزی می‌خواهم بگیرم؟

  • 42 سخنرانی با محتوای منظم و گام به گام.
  • طراحی وب سایت برنامه های تلفن همراه را بیاموزید.
  • با رنگ فونت ها کار کنید.
  • طرح های خود را با تعاملات نمونه اولیه کنید.
  • تست بر روی تلفن همراه.
  • طرح‌های خود را برای نظرات ارسال کنید.
  • صادرات دارایی های آماده تولید.
  • اولین شخصیت مختصر UX خود را ایجاد کنید.
  • وایرفریم های سریع ایجاد کنید.
  • نحوه استفاده از کیت های UI از پیش ساخته شده.
  • میانبرهای حرفه ای ترفندهای گردش کار را بیاموزید.
  • فایل های تمام شده را دریافت خواهید کرد تا هرگز عقب نمانید
  • فایل های تمرینی قابل دانلود
  • پشتیبانی انجمن از طرف من و بقیه خدمه BYOL
  • همه تکنیک‌های استفاده شده توسط متخصصان UX

مخاطب هدف چیست؟

  • این دوره برای مبتدیان است.
  • برای افرادی که تازه وارد دنیای طراحی تجربه کاربری شده اند.
  • هیچ تجربه قبلی Adobe XD لازم نیست.
  • برای هر کسی که نیاز دارد "طراحی UX" را به مجموعه خود اضافه کند.

سلام به افراد دوست داشتنی Skillshare.

بیایید یادگیری خود را عملی کنیم. ما با مشتری زیر کار خواهیم کرد تا رابط وب سایت قدیمی آنها را دوباره طراحی کنیم. دارایی‌هایی هستند که می‌توانید از آنها استفاده کنید که در فایل‌های تمرین، در پوشه‌ای به نام «کلاس پروژه» هستند. فایل های تمرین را دانلود کنید. هنگامی که طرح خود را ایجاد کردید، اجازه استفاده از برند را در نمونه کار خود دارید. برای اطلاعات بیشتر در مورد پروژه، ویدیوی "پروژه کلاس 40" را از دوره آموزشی مرور کنید.

مشتری:

لپ تاپ خود را بیاورید - آموزش ویدیویی آنلاین.

توضیحات

طراحی جدیدی برای صفحه ویدیویی رو به رو دانش آموز خود ایجاد کنید. در اینجا نمونه ای از صفحه ای است که آنها می خواهند دوباره تصور کنند:

یک پوشه "کلاس پروژه" با دارایی های لوگو وجود دارد که می توانید از آن استفاده کنید. می توانید از متن عنوان دوره در صفحه مثال بالا استفاده کنید. هیچ محدودیتی برای تصاویر، رنگ ها و فونت ها وجود ندارد.

- گزینه B: شما می توانید همان پروژه را با ایده/کسب و کار/مشتری خود اجرا کنید.

این برای چه کسی است؟

خلاقیت ها - این محصول توسط افراد خلاق استفاده می شود، یعنی طراحان وب گرافیکی که می خواهند مهارت های فعلی خود را ارتقا دهند.

لیست ویژگی (الزامات محصول)

  • پخش کننده ویدیو
    • سایت باید ویدئو محور باشد. مشاهده و حرکت به ویدیوی بعدی باید اولویت اصلی طراحی باشد.
  • پیمایش
    • صفحه اصلی، دوره ها، منابع، تماس، سوالات متداول، ورود، ثبت نام
  • عنوان دوره
  • عنوان ویدیو
  • نظرات
  • رونویسی های ویدئویی
  • نوار جستجو
  • دانلود فایل‌های مربوط به دوره «دانلود فایل‌های تمرین».

الهام بخش رقبا

  • Lynda.com
  • Teamtreehouse.com
  • Pluralsight.com

محصولات تحویلی

  • Wireframes برای تایید مشتری.
    • فایل های JPG در بخش نظرات آپلود شدند.
  • نمونه اولیه با وفاداری بالا.
    • فایل های JPG در بخش نظرات آپلود شدند.
  • نمونه سازی سیم
    • هنگامی که در حالت نمونه اولیه هستید، تمام عناصر پروژه خود را انتخاب کنید و یک اسکرین شات بگیرید تا تمام سیم های آبی نشان داده شود. بنابراین می توانیم جریان کاربر شما را ببینیم.
  • پیوندها
    • پیوندهای اشتراک گذاری برای هر دو پروژه XD با وفاداری بالا وایرفریم ایجاد کنید.
  • رفتار
    • طرح ها را در نمونه کارها Behance خود آپلود کنید تا مهارت های جدید خود را نشان دهید.

هزینه

  • شما 0 دلار بودجه دارید :) 

سرفصل ها و درس ها

درس ها Lessons

  • ProtoTyping و افزودن تعامل به Adobe XD ProtoTyping & adding interactivity to Adobe XD

  • از فونت های ایمن وب یا فونت های خاص iOS یا Andriod در Adobe XD استفاده کنید Use Web safe fonts or iOS or Andriod specific fonts in Adobe XD

  • وایرفریم (با وفاداری کم) در Adobe XD Wireframing (low fidelity) in Adobe XD

  • خلاصه و شخصیت برای پروژه زندگی واقعی ما The brief & persona for our real life project

  • نحوه ساخت و استفاده از نمادها در Adobe XD How to make & use symbols in Adobe XD

  • آموزش ساخت ماکت گوشی موبایل با Adobe XD و Photoshop How to make a mobile phone mockup with Adobe XD & Photoshop

  • کار با رنگ های داخل Adobe XD CC Working with colors inside Adobe XD CC

  • نحوه ایجاد یک گرادیان و تاری در Adobe XD How to make a gradient & blur in Adobe XD

  • چرا به یک شبکه ۱۲ ستونی در Adobe XD نیاز دارید؟ Why do you need a 12 column grid in Adobe XD

  • یک نسخه APP از پروژه Adobe XD UX خود بسازید Make an APP version of your Adobe XD UX project

  • نحوه صادرات تصاویر و کد از Adobe XD برای توسعه دهندگان How to export images & code from Adobe XD for developers

  • استفاده از شبکه تکرار در Adobe XD Using the repeat grid in Adobe XD

  • ویژگی‌ها و به‌روزرسانی‌های جدید Adobe XD CC 2022! Adobe XD CC 2022 New Features & Updates!

  • نحوه ایجاد فرم ها، چک باکس ها و دکمه ها در Adobe XD How to create forms, checkboxes & buttons in Adobe XD

  • فیلم تولیدی افزودن فیلدها و دکمه‌های متنی در Adobe XD Production Video Adding text fields & buttons in Adobe XD

  • ایجاد دکمه های واقعی در Adobe XD با ویژگی های چسباندن Creating realistic buttons in Adobe XD with paste properties

  • نحوه استفاده از Character Styles در Adobe XD How to use Character Styles in Adobe XD

  • شروع کار با پروژه Adobe XD Getting started with your Adobe XD project

  • مزایا و معایب کار با تصاویر در داخل Adobe XD The pros & cons for working with images inside Adobe XD

  • ویژگی های پنهان برای Adobe XD Repeat Grid Hidden features for Adobe XD Repeat Grid

  • پروژه کلاس برای Adobe XD Class Project for Adobe XD

  • صفحه نمایش و داشبورد ثبت نام ویدیوی تولید Production Video Sign up screen & Dashboard

  • پاداش: به روز رسانی نرم افزار BONUS: Software Updates

  • نحوه استفاده از برنامه XD در آیفون و اندروید How to use the XD App on iPhone & Android

  • چگونه در Adobe XD ماسک کنیم How to mask in Adobe XD

  • اشتراک گذاری Wireframes برای نظرات در Adobe XD Sharing Wireframes for comments in Adobe XD

  • نتیجه گیری برای دوره آموزشی Adobe XD Conclusion for Adobe XD training course

  • مقدمه ای بر Adobe XD Introduction to Adobe XD

  • یک ترفند نمونه اولیه دیگر و عمق میدان جعلی برای ماکت One more Prototype trick & faking depth of field for mockup

  • کار با تایپ در وایرفریم های XD Working with type in your XD wireframes

  • تمسخر یک برنامه در Adobe XD Mocking up an App in Adobe XD

  • تابلوهای خلقی و منابع برای طراحی رابط کاربری سلام وفاداری در Adobe UX Mood Boards & resources for Hi fidelity UI design in Adobe UX

  • کار با Illustrator، Photoshop و InDesign در Adobe XD Working with Illustrator, Photoshop & InDesign in Adobe XD

  • 31b چگونه یک مدل پاپ آپ در Adobe XD با پس زمینه تار بسازیم 31b How to make a popup model in Adobe XD with a blurred background

  • نحوه ایجاد یک شبکه 12 ستونی در Adobe XD 2018 How to create a 12 Column Grid in Adobe XD 2018

  • چگونه آیکون های سفارشی خود را در Adobe XD رسم کنید How to draw your own custom icons in Adobe XD

  • رابط کاربری UI در مقابل UX در مقابل تجربه کاربری چیست What is UI vs UX User Interface vs User Experience

  • ایجاد داشبورد کارت 12 ستونی با استفاده از ابزار تکرار گرید در Adobe XD Creating 12 column card dashboard using the repeat grid tool in Adobe XD

  • نمادهای رایگان برای پروژه های Adobe XD و UX UI شما Free icons for your Adobe XD & UX UI projects

  • کار با کیت های رابط کاربری موجود در Adobe XD Working with existing UI kits in Adobe XD

  • تولید ویدئو دیدگاه های دانشجویی Production video student views

  • میانبرها و برگه تقلب برای Adobe XD Shortcuts & Cheat Sheet for Adobe XD

  • تست کاربر UX در Adobe XD UX User Testing in Adobe XD

  • نمونه سازی پیشرفته با استفاده از دکمه ها و منوهای کشویی در Adobe XD Advanced prototyping using buttons & dropdown menus in Adobe XD

نمایش نظرات

آموزش UI/UX و طراحی وب با استفاده از Adobe XD 2018 - طراحی تجربه کاربری
جزییات دوره
6h 8m
44
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
12,914
4 از 5
ندارد
دارد
دارد
Daniel Scott
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Daniel Scott Daniel Scott

مربی معتبر Adobe

من معلم طراح دیجیتال در BYOL International هستم. به اشتراک گذاشتن چیزی است که من هستم، و تدریس جایی است که در بهترین حالتم هستم، زیرا من در هر دو طرف این معادله بوده ام، و دریافت آموزش های مفید راه معنادار من برای عضویت در جامعه خلاق است.

من مدت زیادی را صرف تماشای یادگیری و آموزش دیگران کرده ام تا نحوه کارم با شما را اصلاح کنم تا کارآمد، مفید و مهمتر از همه به یاد ماندنی باشم. من می خواهم آنچه را که به شما نشان داده ام به آینده ای روشن منتقل کنید.

من یک همسر (یک دختر دوست داشتنی ایرلندی) و بچه دارم. من در بسیاری از مکان‌ها زندگی و کار کرده‌ام (همانطور که کیوی‌ها تمایل دارند) - اما بیشتر 14 سال خلق و تدریس من یک موضوع مهم داشته است: همراهی دیگران برای سوار شدن در حالی که همه ما سعی می‌کنیم دنیا را با داستان‌هایمان تغییر دهیم. ، کار عشق و هنر ما.

من یک مربی معتبر Adobe (ACI) در ایرلند هستم. من همچنین یک متخصص Adobe Certified (ACE) هستم و دوره آموزشی Adobe Certified Associate (ACA) را گذرانده ام. و من فقط Adobe کار نمی کنم. به یاد داشته باشید، رسانه یک اصطلاح بسیار گسترده است - دیجیتال مرزها را شکست، بنابراین همه ما دائماً در حال یادگیری هستیم.

من بیش از 14 سال است که تدریس می کنم. من از یک طراح رسانه و تولید کننده محتوا آمده ام - بنابراین می دانم که شما در حال حاضر دقیقا در کجا هستید. من اونجا بودم. من عاشق این چیزها هستم چاپ، نشر دیجیتال، وب و ویدئو. من می توانم ببینم که چگونه همه چیز به هم وصل می شود. و من می‌توانم ببینم چگونه می‌توانیم آن اتصالات را به اشتراک بگذاریم.

من لپ تاپ Bring Your Own را در نیوزیلند آنلاین ساختم. من یک تیم عالی دارم که با من کار می کند تا BYOL را در راس آموزش Adobe و رسانه های دیجیتال نگه دارم. من کسب و کار را درک می کنم، من یکی از آن ها را دارم - بنابراین می دانم که چقدر مهم است که آن را به درستی انجام دهم و کاری کنم که برای شما کار کند.

دنیل والتر اسکات