آموزش Adobe Xd – مقدماتی

قبل از شروع آموزش Adobe Xd بهتر است مروری داشته باشیم بر تجربه و رابط کاربری:

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

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

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

معرفی نرم افزار Adobe Xd

نرم افزار Adobe Xd یک ابزار طراحی رابط و تجربه کاربری مبتنی بر بردار برای اپلیکیشن های موبایل و وب است که توسط کمپانی ادوبی توسعه داده شده است. این ابزار برای ویندوز و مکینتاش در دسترس است. البته نسخه هایی هم برای آی او اس و اندروید برای نمیاش زنده پروژه ارائه شده است. این نرم افزار قبلا با عنوان project comet شروع به فعالیت کرد که در سال ۲۰۱۶ ابتدا برای سیستم عامل مکینتاش و سپس برای ویندوز ۱۰ با عنوان Adobe Experience Design به صورت بتا عرضه شد.

تفاوت ادوبی Adobe Xd نسبت به Adobe Photoshp:

شاید سوالی که برای کاربران بوجود می آید این است که مگر Adobe Xd چه امکانات و ویژگی هایی دارد که باید نرم افزار معروف فتوشاپ را رها کرده و به سراغ این نرم افزار که تازه وارد عرصه طراحی رابط و تجربه کاربری شده برویم. اجازه دهید اشاراتی به تفاوت این دو نرم افزار شرکت ادوبی داشته باشیم:

شبکه تکرار یا Repeat grid: امکان تکرار عناصر(لایه یا گروه) در adobe xd بسیار ساده است و می توان به راحتی لیست و یا گالری تصویر ایجاد و آن را ویرایش کرد اما در فتوشاپ این کار کمی وقت گیر و سنگین است.

انیمیشن: ادوبی فتوشاپ امکان انیمیشن را به صورت خیلی محدود به کاربر میدهد اما adobe xd می تواند انیمیشن های جذابی که در موبایل و وب استفاده می شود را به طرح بدهد و طرح را زنده تر، پویاتر و جذاب تر نمایش دهد.

پروتوتایپ یا نمونه سازی: امکانی جذاب برای تعامل مشتری با پروژه طراحی شده که کاربر را قادر میسازد تا با کلیک روی منوها و عناصر مختلف به صفحه مد نظر برود و شبیه یک نرم افزار و سایت واقعی آن را تست کند

تعامل با سایر ابزارها: adobe xd میتواند فایل های ایلاستریتور، فتوشاپ، اسکچ و افترافکتز را باز کند بعلاوه می تواند به سایر نرم افزارهای مرتبط مثل مایکروسافت تیم، جیرا و زپلین متصل شود. در ضمن امکان انتقال پروژه از مکینتاش به ویندوز هم به راحتی امکان پذیر است.

طراحی و تعامل صوتی: طراحی و تعامل با پروژه Adobe Xd می تواند به صورت صوتی باشد که به جای کلیک کاربر با فرمان صوتی به بخش های مختلف پروژه حرکت کند

کامپوننت: یکی از بخش های جالب Adobe Xd بخش کامپوننت است که قبلا با عنوان سمبل شناخته می شد به این ترتیب می توانید عنصر خود را ایجاد و در تمام بخش پروژه یا پروژه های خود استفاده و آن را سفارشی کنید و کامپوننت استفاده شده در تمام پروژه را یکباره ویرایش کنید.

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

پلاگین ها: با توجه به اینکه هر توسعه دهنده می تواند برای Adobe Xd پلاگین بنویسد. ایکس دی دامنه وسیعی از پلاگین های مختلف و کاربردی را دارد که از طراحی گرفته تا انیمیشن و نمونه سازی را شامل می شود.

اشتراک و بازخورد: کاربران Adobe Xd این امکان را دارند که پروژه خود را به اشتراک بگذارند و از کاربران و یا تیم خود بازخورد بگیرند

ویرایش همزمان: برای کاربران Adobe Xd که روی یک فایل میخواهند کار کنند این امکان فراهم است که همزمان طراحی کنند و همه افراد به صورت زنده تغییران سایر افراد هم داشته باشند.

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

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

آنچه در دوره آموزش adobe xd خواهید آموخت:

در این دوره تمام مباحث مرتبط با طراحی در Adobe Xd را فراخواهید گرفت، کار با تمام ابزارها و تنظیمات، تکنیک های مختلف طراحی، رسم نمودار منحنی و دایره ای و در طی دوره چند پروژه کوچک طراحی را هم با هم طراحی خواهیم کرد. می توانید سر فصل های دوره را مشاهده کنید.

گام بعدی یادگیری آموزش adobe xd:

پس از این دوره شما قادر خواهید بود که به صورت کامل طراحی کنید و حتی طرح را هم به مشتری نشان دهید اما هنوز لازم است تا برای مشتری یا کاربر در طرح و بین صفحات تعامل برقرار شود و کاربر بتواند با کلیک بین صفحات پروژه جابجا شود و علاوه بر این انیمیشن هم جزء مهمی از پروژه است که زیبایی پروژه چند برابر می کند.