وب سایت تخصصی شرکت فرین
دسته بندی دوره ها

The User Experience of Motion (for Non-Designers)

سرفصل های دوره

Learn the language of motion, and how it can enhance and transform digital user experiences with visceral, meaningful visual responses and actions with expert Tom Green. Tom shows you how principles like speed, velocity, and acceleration are applied to UX design using Figma and After Effects—but this course isn’t focused on using these applications. Rather, it’s aimed at increasing your awareness of how things move and how that movement is presented in UX design. Learn about the characteristics of motion and our responses to it, how time and motion interact, and how to define motion paths and velocity curves to precisely move objects in the digital realm. Plus, discover ways to create dimensionality and the feeling of depth and 3D space in 2D views, and learn about obscuration and the parallax effect.


01 - Introduction
  • 01 - Have you ever watched how things move
  • 02 - What you should know

  • 02 - 1. Explaining Motion
  • 01 - Watching how things move
  • 02 - How things move Speed
  • 03 - How things move Distance
  • 04 - How things move Time
  • 05 - How things move Velocity
  • 06 - How things move Acceleration
  • 07 - Motion in Figma
  • 08 - Motion in After Effects

  • 03 - 2. Easing Comes to Life
  • 01 - Time and motion
  • 02 - Ease in (acceleration and time)
  • 03 - Ease out (deceleration and time)
  • 04 - Easing in After Effects
  • 05 - Using After Effects eases

  • 04 - 3. Motion Paths
  • 01 - Nothing moves in a straight line
  • 02 - Faking it in Figma
  • 03 - Motion paths in After Effects

  • 05 - 4. Dimensionality
  • 01 - The effect of distance and motion
  • 02 - Dimensionality in Figma, part 1
  • 03 - Dimensionality in Figma, part 2
  • 04 - The Floating Action button in Figma
  • 05 - The z-axis in After Effects
  • 06 - Using the After Effects z-axis

  • 06 - 5. Obscuration
  • 01 - What is obscuration
  • 02 - Applying blurs in Figma
  • 03 - Applying blurs in After Effects
  • 04 - Apply motion blurs in After Effects

  • 07 - 6. Parallax
  • 01 - What is parallax
  • 02 - Create a parallax effect in Figma
  • 03 - Create a parallax effect in After Effects

  • 08 - Conclusion
  • 01 - Next steps
  • 139,000 تومان
    بیش از یک محصول به صورت دانلودی میخواهید؟ محصول را به سبد خرید اضافه کنید.
    خرید دانلودی فوری

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

    ایمیل شما:
    تولید کننده:
    مدرس:
    شناسه: 39244
    حجم: 301 مگابایت
    مدت زمان: 113 دقیقه
    تاریخ انتشار: 9 مرداد 1403
    دسته بندی محصول
    طراحی سایت و خدمات سئو

    139,000 تومان
    افزودن به سبد خرید