Animation Basics
Make things move! Learn to build bouncing balls, spinning coins, glowing buttons, and game sprites you can drop straight into your own games and websites.
What You'll Learn
Description
L'animation, c'est ce qui rend les jeux et les sites vivants. Un bouton qui brille au survol, une pièce qui tourne, une balle qui rebondit, un personnage qui glisse sur l'écran : tout ça, c'est de l'animation, et tu peux en construire chaque morceau toi-même.
Dans ce tutoriel, ton avatar de Vibe Coding Academy te guide à travers du vrai code à copier-coller. Tu commenceras par de simples effets au survol, tu passeras au niveau supérieur avec des animations en boucle @keyframes, puis tu contrôleras le mouvement image par image avec JavaScript — la même astuce qu'utilisent les vrais jeux. Chaque extrait est à toi pour le coller, l'exécuter et le bidouiller.
À la fin, tu auras des boutons animés, une balle qui rebondit, une pièce qui tourne et un sprite que tu peux déplacer avec les touches fléchées — sans oublier les prompts d'IA pour en générer d'autres quand tu veux.
What's Inside
4 hands-on chapters • about 1.5 hours of fun.
- 1Introduction — ce qu'est vraiment l'animation + ton premier effet au survol
- 2Faire bouger les choses — @keyframes, une balle qui rebondit et une pièce qui tourne
- 3Effets cool et timing — transform, easing et une pulsation lumineuse
- 4Anime ton propre projet — un sprite de jeu en JavaScript que tu contrôles