- Course
Motion Design with CSS
CSS animation is crucial to developing interactive designs and interfaces, and this course teaches one of the most performant ways to animate: CSS.
- Course
Motion Design with CSS
CSS animation is crucial to developing interactive designs and interfaces, and this course teaches one of the most performant ways to animate: CSS.
Get started today
Access this course and other top-rated tech content with one of our business plans.
Try this course for free
Access this course and other top-rated tech content with one of our individual plans.
This course is included in the libraries shown below:
- Core Tech
What you'll learn
Web browsers can display stunning CSS animations and transitions. This course, Motion Design with CSS, shows how you can use CSS animations and transitions to enhance your web applications with powerful, information-rich motion and color. CSS is one of the most performant ways to animate today, and this course gives developers the future-facing tools they need to do just that. You’ll begin by animating a rolling ball, and learn how to use the browser’s developer tools to help debug. Next, you’ll explore how animation can add decoration and draw attention to various parts of a design. Finally, you’ll explore how to make complex animations using event listeners, and will discover how to track the performance of your animations. By the end of this course, you’ll have mastered the tools you need to set your ideas in motion on the web.
Motion Design with CSS
-
Introduction | 4m 49s
-
CSS Transitions | 7m 41s
-
Exercise 1: Rolling a Ball | 4m 19s
-
Transitioning Multiple Properties | 4m 13s
-
Demonstration: Changing the Ball’s Color | 3m 23s
-
Duration | 13m 2s
-
Browser Developer Tools | 4m 8s
-
Timing Functions | 9m 40s
-
Exercise 2: Applying Physics to the Ball | 4m 41s
-
CSS Transitions Summary | 5m 37s