در این قسمت از آموزش طراحی UI/UX با Adobe Xd قصد دارم با استفاده از ویژگی جدید که به ایکس دی در سال 2021 به آن اضافه شده آیکان ها را متحرک کنیم و در واقع میکرو اینتراکشن های مختلفی را برای عناصری که با استفاده از قابلیت Border یا Stroke طراحی شده اند، ایجاد کنیم.
در واقع شما با استفاده از این ویژگی جدید می توانید آیکان های مختلف SVG که با روش Line یا Stroke طراحی شده اند را هم متحرک کنید و یا اینکه خودتان در ادوبی ایکس دی همانطور که در فیلم هم مشاهده می کنید با ابزار Pen شکل مورد نظر خود را طراحی و آن را متحرک کنید.
شما می توانید از این قابلیت برای عناصری که با روش Fill هم طراحی شده اند میکرو اینتراکشن طراحی کنید اما فقط برای قسمت Border آن قابل استفاده است.
در آموزش متحرک کردن آیکان ها در Adobe XD چه چیزهایی یاد می گیریم؟
در واقع شما می توانید با استفاده از این قابلیت جدید هر چیزی که قابلیت دادن حاشیه / stroke یا boarder را داشته باشد متحرک کنید، در نتیجه در این فیلم به موارد زیر می پردازیم
- طراحی یک UI نمونه برای تست این قابلیت جدید
- تنظیم Border عناصر طراحی شده
- تنظیم Prototype های مختلف برای انیمیت یا متحرک کردن Border ها
- تست Prototype
- و…
آموزش متحرک کردن آیکان ها در طراحی UI/UX با Adobe XD
قسمت های دیگر آموزش Adobe Xd را در کجا ببینیم؟
شما می توانید تمام قسمت های آموزش Adobe Xd را در بخش آموزش Adobe Xd وبلاگ و یا اینکه در لیست پخش آن در یوتیوب ببینید.
همچنین در آخر همین پست تعدادی از لینک های مرتبط آموزش ادوبی ایکس دی نیز قرار داده شده است.
[newsletter-pack newsletter=’8661′]
طراحی رابط کاربری ( UI/UX ) را از صفر از کجا یاد بگیرم؟
لینک آموزش ها و مقالات فارسی دیگر طراحی رابط کاربری ( UI/UX ) در وبلاگ من:
آموزش طراحی UI/UX با Figma از صفر در 30 دقیقه با مثال کاربردی
آموزش جامع Figma – کار با ابزارها و محیط فیگما 2021 – قسمت اول
آموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم
10 ترفند فوق العاده کاربردی فیگما 2021 – قسمت اول
آموزش طراحی یک عنصر با بینهایت حالت با Variants در Figma
5 پلاگین فوق العاده کاربردی Figma 2021 – قسمت اول
5 پلاگین فوق العاده کاربردی Figma 2021 – قسمت دوم
آموزش جامع طراحی Adobe Xd – محیط ظاهری و آرتبورد ها – قسمت اول
آموزش طراحی شکل های مختلف و تنظیمات آنها در Adobe Xd – قسمت دوم
آموزش ابزار متن و فارسی نویسی در Adobe Xd – قسمت سوم
آموزش کار با تصاویر و ماسک کردن در Adobe Xd – قسمت چهارم
آموزش طراحی آیکان با Pathfinder در Adobe Xd – قسمت پنجم
آموزش Adobe XD – معرفی 5 پلاگین فوق العاده کاربردی – قسمت دوم
معرفی 5 پلاگین فوق العاده کاربردی برای Adobe Xd- قسمت اول
آموزش Adobe Xd - یک دکمه برای همه جا در طراحی رابط کاربری
10 افزونه فوق العاده کاربردی برای طراحان رابط کاربری
آموزش UI/UX : طراحی رابط کاربری را از صفر چطور و از کجا یاد بگیریم؟
آموزش UI/UX : وایرفریم چیه و چطور آن را طراحی کنیم؟
چطور طرح رابط کاربری را در اختیار برنامه نویس و کارفرما قرار دهیم؟
لندینگ پیج چیست و چطور باید رابط کاربری UI/UX آن را طراحی کرد؟
