This UI Animation Motion Design Course for Website teach you to be master motion design for the web with this comprehensive tutorial. Learn to utilize video, CSS, JavaScript, GSAP, SVG, Lottie, and more to create visually stunning and user-engaging websites.
- Foundations of Motion Design
- Introduction and key concepts
- Video in Web Design
- Adding videos to web pages
- Exercise: Product feature with video
- Exercise: Hero section with video background
- Optimizing video for web performance
- CSS Transitions
- Introduction to CSS transitions
- Exercise: Website header
- Exercise: Simple dropdown menu
- Exercise: Image gallery
- Exercise: Cool accordion
- CSS Animations
- Introduction to CSS animations
- Exercise: Simple loading screen
- CSS animations vs. CSS transitions
- Exploring loading animations
- Exercise: Site preloader
- Exercise: SVG text loader
- Exercise: Button with animated loading dots
- Animating Graphics
- Animating illustrations and icons
- Exercise: Animated Lottie icon
- Exercise: Animated menu icon
- Exercise: Animated illustration
- Exercise: Animated avatars
- Creating accent animations
- Exercise: Animated logo
- Exercise: Typewriter effect
- Interactive Animations
- Playing around with interactive animations
- Exercise: Mouse follow effect
- Exercise: Scroll-triggered animation
- Depth and Dimension
- Adding depth and dimension with parallax
- Exercise: Parallax animation
- Motion and Responsive Design
- Conclusion
