دوره آموزشی فیگما: ساخت انیمیشن‌ها و تعاملات

دوره آموزشی فیگما: ساخت انیمیشن‌ها و تعاملات

1 ساعت 11 دقیقهمتوسط2025-01-15

مدرسین

Joseph Labrecque

Joseph Labrecque

University Professor, Adobe Educator, Studio Head

جزئیات دوره

آیا می‌دونستی که فیگما ویژگی‌هایی داره که انتقال انیمیشن‌ها و تعاملات رو به توسعه‌دهندگان برای ادغام توی پروژه‌های کد بومی، راحت‌تر می‌کنه؟ توی این دوره، استاد جوزف لابریک آموزش می‌ده چطور از قدرت حالت Dev Mode فیگما برای به اشتراک گذاشتن جنبه‌های مهم طراحی با تیم توسعه‌ت استفاده کنی. در طول دوره، یاد می‌گیری چطور دارایی‌های مشترک از یک پروژه فیگما رو توی یک پلتفرم توسعه بومی وارد کنی، تعاملات و انیمیشن‌های کاربری که با پروتوتایپ طراحی فیگما هماهنگه، برنامه‌ریزی کنی، و انیمیشن‌ها رو بر اساس اقدامات کاربری راه بندازی. این دوره برای طراحان UX و تعاملات و توسعه‌دهندگانی که با طراحی‌ها و پروتوتایپ‌های فیگما کار می‌کنن، ایده‌آله. در پایان این دوره، آماده خواهی بود تا انیمیشن‌ها و تعاملات یک پروژه طراحی فیگما رو به محیط کد بومی منتقل کنی.

مهارت ها

2D AnimationFigmaInteraction DesignUser ExperienceLearningAnimation and Illustration

سرفصل ها

مقدمه

  • ساخت انیمیشن و تعامل
  • آنچه می‌خواهید بسازید
  • آنچه باید بدانید

آمادگی برای توسعه

  • نمای کلی پروژه Figma
  • به اشتراک گذاری فایل طراحی
  • فعال کردن Dev Mode به عنوان طراح
  • دسترسی به Dev Mode به عنوان یک توسعه دهنده

دسترسی به محتوای طراحی برای وب بومی

  • نمای کلی پروژه وب بومی
  • خواندن CSS از پروژه اشتراکی Figma
  • Export تصاویر از پروژه اشتراکی Figma
  • تکمیل طراحی وب بومی

تبدیل انیمیشن‌ها و تعاملات

  • متحرک سازی تعاملات ناوبری
  • متحرک سازی محتوای صفحه به صورت خودکار
  • متحرک سازی دکمه
  • متحرک کردن دختر آب
  • متحرک سازی برچسب تغذیه
  • متحرک سازی متن اطلاعات

نتیجه گیری

  • مراحل بعدی
۴۰,۰۰۰ تومان