Alexunder Hess - Motion UI Design · Gold
- How to Start in Motion Design
- Fundamentals of Motion UI
- The practice of Motion UI
- What to animate, How and Why
- Mistakes people make
- UI Animation handoff
- How to Work with Developers
- Bonus PDF
- Lifetime Access
- Your personal account and progress
- Homework
- Professional prototypes with Principle
- How to Create the Apple-style landing page
What's inside
-------------
Module 1: Fundamentals
----------------------
- Welcome to the masterclass (1:53)
- Where to start in Motion Design (3:35)
- What is Motion Design (6:04)
- What is Motion UI Design...& Triggers (10:28)
- Transitions. Which one to choose (9:50)
- The main purpose of Motion UI Design (6:47)
- Tools for Motion UI Design. Which one is the best? (8:42)
- Why Motion Design is so complicated? Now you know that it's not. (2:13)
- The first fundamental principle of Motion UI Design (3:49)
- The second fundamental principle of Motion UI Design...and how companies like Apple and Google do it? (26:46)
- What's next (5:01)
Your result after Module 1
You know what Motion UI design is; what it consists of and what tools to use; how companies like Google, Apple create animations for their landing pages; you know how to analyze UI animations and prototypes of other designers so you will be able to create any website or mobile app.
Module 2: Practice
------------------
- Intro to the Practice section (0:41)
- The most used attribute in Motion Design (41:53)
- How to work with scroll (13:04)
- What you should know about Masks in Motion UI Design (14:21)
- The least used attribute in Motion UI Design (8:15)
- How to reveal these elements? (5:29)
- What's the difference between size and scale (20:21)
- Why you should know how to animate border radii (4:43)
- If you are a UX/UI design you have to animate it (6:38)
- Let's make it pop. How and where to animate effects (6:32)
- BONUS: How to Animate Isometric Elements (9:27)
Your result after Module 2
You know what attributes to animate and how to do it; you know how to work with scroll (most designers don't understand the secret behind it); you know the difference between SIze and Scale in animations; you know how to animate different effects in Figma; you know how to create Isometric animations; you know how to create powerful animations using masks.
Module 3: Motion UI with Principle
----------------------------------
- Introduction to the Principle module (0:33)
- What is Principle and why it's so powerful (15:02)
- Principle. 5 main sections of the tool (33:56)
- How to prepare a project and import it to Principle (25:49)
- How to create an Apple-style landing page with Principle (105:49)
- How to create a mobile app prototype (79:09)
- How to export your animation from Principle(22:33)
Your result after Module 3
You know how to create powerful animations and prototypes with Principle; you know how to prepare your design for this tool; you know how to animate landing page prototypes like Apple and Google; you know how to create mindblowing UI animations for mobile apps; you know how to export your works to your website, Dribbble or any other platform.
Module 4: Export & Developers
-----------------------------
How to export and share your animations and prototypes (14:32)
How to explain your animations to developers (Specifications) (10:22)
Your result after Module 4
You know how to export your animations and prototypes to your portfolio, website, Dribbble, Behance or any other website; you know how to explain your animations to developers so they will be implemented the right way.
