Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views :
Oh Snap!

It looks like you're using an adblocker. Adblockers make us sad. We use ads to keep our content happy and free. If you like what we are doing please consider supporting us by whitelisting our website. You can report badly-behaved ads by clicking/tapping the nearby 'Advertisement' X text.

Motion Design with Figma Animations, Motion Graphics, UXUI (2025-4) by Andrei, Yihua

Motion Design with Figma Animations, Motion Graphics, UXUI (2025-4) by Andrei, Yihua

/

Author:Andrei, Yihua

Duration:14 hours

Actual Duration:10h 11m

Release date:2026, October

Publisher:ZeroToMastery

Skill level:Beginner

Language:English

Exercise files:Yes

Software:Figma

Course URL:https://zerotomastery.io/courses/learn-motion-design/

Learn to add real motion and interaction in Figma and finish with 5 portfolio-ready projects.

Static mockups don’t get you hired anymore. This course shows you how to use Figma to design interfaces that move, respond, and feel real, using Smart Animate, transitions, and motion graphics across 5 hands-on projects.

🎯 What you’ll learn

  • Use Figma like a pro for UI design, UX design, web design, and mobile app design
  • Apply motion design principles, timing, easing, and best practices to real interfaces
  • Build animated prototypes with Smart Animate in Figma
  • Create micro-interactions, transitions, parallax effects, and button animations
  • Add motion graphics and animations to client-ready projects
  • Structure UX/UI case studies and build a professional design portfolio
  • Follow a practical design process from brief to polished prototype

✅ Requirements

  • Skills: Basic computer skills, no prior motion experience needed – familiarity with Figma basics helps
  • Tools: Free Figma account, modern web browser
  • Hardware: Any modern laptop or desktop that can run Figma in browser

📝 Description

This isn’t theory-first motion stuff. You learn by building. Every concept is tied to a screen you’re actually designing, wiring up, and playing with in Figma.

You’ll start with the essentials – layout, components, and prototyping setup – then get straight into movement. How long should a transition be? When do you use Smart Animate vs. a simple dissolve? How do you make a button or card feel snappy without being annoying? You’ll test it, tweak the easing, and see the difference right away.

Then it gets fun: micro-interactions, page transitions, parallax scrolling, loading states, and full app flows. The course walks you through 5 complete projects, so you’re not just watching – you’re shipping animated prototypes you can click through and show to clients or hiring managers.

By the end you also get a portfolio system provided for you to customize. So instead of ending with random exercises, you leave with proof you can do UX/UI plus motion – which is exactly what makes a portfolio stand out right now.

🧑‍🎓 Who this course is for

  • UI/UX designers who want to add motion to their work without learning After Effects
  • Web and mobile designers stuck with static mockups and wanting interactive prototypes
  • Beginners in design who want a project-based way into Figma and motion design
  • Freelancers and job-seekers who need animated work samples for their portfolio

🧑‍🏫 About the Author

Daniel Schifano is a product designer working in the industry and instructor for this course. He focuses on practical Figma workflows, prototyping, and interaction design used in real product teams.

His teaching style is straight to the point: short lessons, real briefs, and lots of building. Instead of lecturing on theory, he shows how motion decisions affect usability, feedback, and client presentation – the stuff you actually need on the job.

🏁 Final Result

  • 5 completed animated Figma projects including mobile and web prototypes with transitions and micro-interactions
  • A customizable design portfolio ready to fill with your work and share with clients or employers
Curriculum

📋 Course content

  1. Module 1:  Getting Set Up in Figma
    • How This Course Works
    • Figma Setup, Files, and Project Structure
    • UI Basics: Frames, Auto Layout, Components, and Styles
  2. Module 2:  Motion Design Fundamentals
    • What Motion Is Actually For in UX/UI
    • Timing, Easing, Duration, and Choreography
    • Prototyping Basics: Flows, Triggers, and Actions
  3. Module 3:  Smart Animate in Practice
    • How Smart Animate Works
    • Transitions Between Screens and States
    • Delays, Springs, and Custom Easing
  4. Module 4:  Micro-interactions and Real Projects
    • Buttons, Toggles, Tabs, and Menus
    • Scroll Effects, Parallax, and Sticky Elements
    • Project 1-3: Mobile App Flows and Web Interactions
  5. Module 5:  Portfolio Projects and Handoff
    • Project 4-5: Full Animated Prototypes
    • Polish, Presentation, and Client Handoff
    • Building Your Customizable Design Portfolio
Watch online or Download for Free
Motion Design with Figma Animations, Motion Graphics, UXUI (2025-4) by Andrei, Yihua
NAME
SIZEDURATION
6. Motion Design Principles
26.3 MB14m
16. Where To Go From Here
1.2 MB1m

Download all Videos (161)
1.2 GB10h 11m


Download all

Join us on
  Channel    and      Group

Leave a Comment

Your email address will not be published. Required fields are marked *