CSS: Enhancing Interfaces with Animation

Leverage CSS animations to enhance websites you develop. Examine animation theories, practical uses, and more as you explore the use of movement in UI.

Introduction

• Why animations?
• Using GitHub Codespaces with this course

1. Theory of Animation

• Best practices
• The 12 principles of animation
• The 12 principles used in UI

2. Animation Choreography

• Animation choreography
• Sequencing and easing
• Transformations
• Focal elements

3. UI Animations

• Creating button animations
• Creating menu animations
• Challenge: Create a card animation
• Solution: Create a card animation

Conclusion

• Moving on with animations