Adobe XD را بیشتر بشناسیم ( کار با Adobe XD به زبان ساده )

مهر, 1398 بدون نظر
1 ستاره2 ستاره3 ستاره4 ستاره5 ستاره (1 رای, میانگین5٫00 از5)
Loading...
IOS, آموزش, اندروید, میم تک 28, نرم افزار, نرم افزار کامپیوتر, نرم افزار موبایل, ویندوز

در شماره های قبل به بررسی ابزارهای Prototyping پرداختیم ، به علت کثرت ابزارها به Adobe XD اشاره نشد . خوب است بدانید که Adobe XD یکی از پراستفاده‌ترین ابزارهای رایگان برای طراحی UI/UX و طراحی نمونه اولیه در دنیای طراحی موبایل است .

در این مقاله به شما کمک می‌کنیم تا با ظرفیت Adobe XD آشنا شوید .

همچنین آغاز کار با آن برای طراحی یک اپلیکیشن اندروید یا ios را بیاموزید .

همه این‌ها بیش از یک ساعت از وقت شما را نخواهد گرفت .

Adobe XD هم برای ویندوز و هم مک‌اواس عرضه شده است .

آغاز کار با Adobe XD :

نسخه رایگان این نرم افزار را می توانید از سایت ادوبی ( تغییر آی پی لازم است ) نصب کنید .

در هنگام نصب نرم افزار می توانیم سطح ، فیلد کاری و نحوه استفاده ( تک کاربره ، گروهی ، … ) از آن را مشخص کنیم .

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

در قسمت میانی اگر بر روی گزینه Begin Tutorial کلیک بکنیم ادوبی به صورت پیش فرض آموزشی را در اختیار ما قرار می دهد .

در قسمت پایین صفحه می توانیم محیط طراحی و ابعادی که مدنظرمان است را انتخاب کرده و طراحی را آغاز کنیم .

adobe xd step 2

محیط کار Adobe XD :

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

در سمت چپ بالا tool bar قرار دارد و در پایین پنل های مختلف شامل  layer ها ، art board ها و … تعبیه شده است .

در سمت راست هم محیطی برای مدیریت پنلی که روی آن کلیک شده است قرار دارد .

با استفاده از ابزار مدیریتی سمت راست می توانیم برای مثال بک گراند کار را تغییر دهیم .

adobe xd step 3

با استفاده از شکل مربع از قسمت tool bar چند مستطیل می کشیم .

برای مستطیل بالا به عنوان هدر یک بک گراند انتخاب می کنیم .

به صورت درگ اند دراپ آن را به محیط کار اضافه می کنیم .

برای اشکال پایین هدر به صورت دلخواه تصویر اضافه می کنیم .

با استفاده از ابزار text متن مورد نظر را نیز تایپ می کنیم .

چون محیط کار فعلی متناسب با ابعاد موبایل است در پایین صفحه چند شکل دیگر به عنوان home bottun و … طراحی می کنیم .

حال وقت آن رسیده است که از امکان تعاملی بودن Adobe XD استفاده کنید !

برای توضیح بیشتر درباره Instagram یک art board جدید از قسمت tool bar اضافه می کنیم .

کاربر باید زمانی که بر روی اینستاگرام کلیک کرد به صفحه ای منتقل شود که توضیحات تکمیلی درباره این اپ مطرح شده است .

برای این کار بر روی افزونه ی Prototype کلیک کرده سپس art board مادر را انتخاب می کنیم و از آن فلشی به سمت art board مورد نظر می کشیم .

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

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

به همین صورت برای سایر art board ها هم می توانیم حالت تعاملی ایجاد کنیم .

با استفاده از گزینه share در بالای صفحه می توانیم نتیجه کار را :

با دوستانی که در ادوبی اکانت دارند به اشتراک بگذاریم .

روند کار را به فیلم تبدیل کنیم .

و یا از گزینه های دیگر استفاده کنیم .

با کمی کنکاش در این نرم افزار و بررسی پلاگین ها و لایه ها و … می توانیم یک پروتوتایپ کاملا حرفه ای برای به تصویر کشیدن ایده های مختلفمان ایجاد کنیم .

مزیت نرم افزار Adobe XD است که به صورت رایگان ارائه می‌شود .

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

برچسب ها
درباره نویسنده

ارسال نظر شما

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Mimtechmagazine