آموزش Adobe XD: انیمیشن ها
Adobe XD: Animations
در این کلاس، ویژگی انیمیشن خودکار در abode xd را بررسی می‌کنیم تا انیمیشن‌هایی را برای محصول ایمیل جعلی خود ایجاد کنیم: Snail Mail. این کلاس طیف گسترده‌ای از نکات و ترفندهای انیمیشن را پوشش می‌دهد که می‌توانند برای سایر رابط‌های کاربری اعمال شوند. من هر دو فایل "شروع" و "پایان" را برای کلاس گنجانده ام، بنابراین به راحتی می توانید آنها را بگیرید و با سرعت خود یاد بگیرید. نمونه هایی از آنچه را در زیر می آموزید ببینید:
فایل Start را از اینجا دریافت کنید:
فایل تمام شده:
انیمیشن های لغزنده:
تعامل‌های خرد:
متن/انیمیشن‌های ماسک:
فشردن دکمه/وضعیت:
پروژه کلاس یک محصول ایمیلی برای خودتان ایجاد می کند. سعی کنید برخی از نمادها/رنگ ها را تغییر دهید و UI خود را متحرک کنید.
سعی کنید برخی از عناصر اصلی را که در کلاس خود داریم بگنجانید:
- انیمیشن لغزنده
- حالت فشار دادن دکمه
- خرد - تعاملات
درس ها Lessons
-
ورود به سیستم: وضعیت دکمه فشار داده شده Sign in: Pressed Button State
-
دریافت ایمیل جدید: انیمیشن اعلان Receiving New Email: Notification animation
-
صندوق ورودی: تکرار Grid & Scrolling Inbox: Repeat Grid & Scrolling
-
دریافت ایمیل جدید: Micro-Interaction Receiving New Email: Micro-interaction
-
ورود به سیستم: انیمیشن متن Sign in: Text Animation
-
مقدمه: انیمیشن های Adobe XD Intro: Adobe XD Animations
-
نوشتن ایمیل جدید: حالت های پوشش و دکمه Compose New Email: Overlay & Button States
-
ورود به سیستم: انیمیشن های پایه Sign in: Basic Animations
-
Outro Outro
-
ارسال شده: تکرار وضعیت های شبکه و دکمه Sent: Repeat Grid & Button States
-
تنظیمات: لغزنده Settings: Slider
Matt Ward
نمایش نظرات