Motion design creates movement, excitement and adds life to otherwise static experiences. When it comes to digital environments, it not only creates delight but also serves strategic purposes such as brand expression, accessibility, information and guidance.
Using motion design to animate with purpose and create delightful experiences
Using motion design to animate with purpose and create delightful experiences is a 19-lesson 2 hours 52 minutes self-paced course by Awwwards. Motion design creates movement, excitement and adds life to otherwise static experiences.
Course facts
- Lessons
- 19
- Duration
- 2 hours 52 minutes
- Language
- English
- Instructor
- Awwwards
- Price
- Premium
In this course, you will learn how to integrate motion to your designs with purpose in mind. We will cover topics ranging from micro-interactions to full screen transitions as well as how to prepare, animate and export your animations in After Effects and Lottie.
At this end of this class, you will be able to design with motion in mind and to animate your web models.
Who teaches Using motion design to animate with purpose and create delightful experiences? Awwwards
Awwwards is the long-running design-recognition site that selects and showcases the best web design work published online — and now also operates a paid course platform staffed by the same kind of high-craft front-end developers whose sites win Awwwards Site of the Day awards.
The CourseFlix listing carries four Awwwards courses on the visual / animated end of front-end engineering: Impress everyone with a 3D particle scene with Blender and Three.js, Creating a simple portfolio website with WebGL and Barba.js, Merging WebGL and HTML worlds, and Using motion design to animate with purpose. Material is paid and aimed at designers and developers building portfolio-grade interactive sites.
What lessons are included in Using motion design to animate with purpose and create delightful experiences?
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Introduction Demo | 04:04 | |
| 2 | Why use motion design? | 03:08 | |
| 3 | Types of animations and examples | 03:45 | |
| 4 | Intro | 01:32 | |
| 5 | Focusing attention and guiding the user | 01:54 | |
| 6 | Creating emotion and showcasing personality and brand | 02:54 | |
| 7 | Informing and giving feedback to the user | 03:02 | |
| 8 | Timing, easing and offset | 03:59 | |
| 9 | Finding inspiration | 02:49 | |
| 10 | Chapter conclusion | 01:39 | |
| 11 | Intro | 01:40 | |
| 12 | After Effects - Importing your design files | 10:19 | |
| 13 | After Effects - Workspace and compositions | 13:10 | |
| 14 | After Effects - Animating your design | 45:02 | |
| 15 | After Effects - Creating your own motion design | 50:26 | |
| 16 | After Effects - Exporting your animation | 06:06 | |
| 17 | What is Lottie | 02:35 | |
| 18 | Animating and exporting your animation in Lottie | 12:41 | |
| 19 | Conclusion | 01:32 |
Get instant access to all 18 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionWhat courses are similar to Using motion design to animate with purpose and create delightful experiences?
Updated 3y agoRich Glitch VFX in After Effects
By: Motion Design SchoolUnlock the secrets of glitch art with our comprehensive After Effects tutorial. Discover the cool and stylish world of randomly changing pixels, backed by logic1h 10m
Updated 3y agoMotion Design in After Effects
By: DesignCode (Meng To)After Effects is an amazing instrument to create beautiful animations, and we believe that it is a powerful tool for designers. In this section we will show you2h 59m
Updated 3y agoMAD VFX in After Effects
By: Motion Design SchoolWant to add mad visual effects to your live-action videos? Learn how to work with 3D objects using Element 3D and how to create sci-fi effects to give your.9h 26m
Updated 3y agoAnimated Loops with James Curran
By: Motion Design SchoolAn in depth course covering a wide variety of looping animation techniques in After Effects.4h 44m
Updated 3y agoCreate a Rainy Window Effect Animation in Adobe After Effects
By: Envato Tuts+Welcome to Create a Rainy Window Effect Animation in Adobe After Effects , a course where you will learn how to create a moody animation that you can use for.1h 42m
Updated 3y agoCreate a Promo Video in After Effects
By: DesignCode (Meng To)In this course we will show you how to create a promo video using After Effects.2h 30m
Updated 3y agoUI Animation Essentials
By: Motion Design SchoolA structured online course on interface animation in After Effects and Principle.8h 19m
Updated 3y agoCreate a Cinematic Text Animation in Adobe After Effects
By: Envato Tuts+This is a course for artists and designers who are interested in motion graphics. In this course, Jonathan Lam will show you how to create a modern, atmospheric1h 17m
More courses by Awwwards
UpdatedMerging WebGL and HTML worlds
Learn to blend WebGL and Three.js effects directly into a plain HTML page, step by step, until both layers feel like one design.2h 30m
Updated 3y agoCreating a simple portfolio website with WebGL and Barba.js
Nothing beats smooth user experience. That is the reason we love WebGL, because we can do crazy effects with amazing performance. But if you combine that with s3h 41m
Updated 3y agoImpress everyone with a 3D particle scene with Blender and Three.js
When you work as a developer you know that the budget for outsourcing and finding the perfect content creator for your project may be a long and unpleasant proc2h 11m