4 animation skills so your site stops looking static

What this is

A free, step-by-step template from Taha's reels — the exact tools, prompts and links, laid out so you can follow along and ship. Comment the keyword on the reel and it also lands in your DMs.

Hey! 👋 Here's what I promised you:

Claude builds you a whole site, but nothing moves — no motion, no animation, nothing premium. These 4 skills fix that:

1. Design Motion Principles — gives your components good timing and easing so they feel right. Two modes: build with purposeful motion, or audit the animations you already have.

🔗GitHubhttps://github.com/kylezantos/design-motion-principles

npx skills add kylezantos/design-motion-principles

2. Genjutsu — creative-coding skills for motion and 3D (GSAP, Motion, Three.js, CSS…), so your site doesn't look like a normal page. Anti-AI-slop.

🔗GitHubhttps://github.com/AThevon/genjutsu 🔗Sitehttps://genjutsu.athevon.dev

/plugin marketplace add AThevon/genjutsu
/plugin install genjutsu

3. Animate Skill — a Claude Code skill for Next.js/React animations based on Emil Kowalski's course, so your animations look professional.

🔗GitHubhttps://github.com/delphi-ai/animate-skill

npx skills add https://github.com/delphi-ai/animate-skill --skill animate

4. Auteur — directs your website like a film, and ships an anti-slop linter that stops a bad design before you launch.

🔗GitHubhttps://github.com/agiwhitelist/auteur 🔗Sitehttps://agiwhitelist.github.io/auteur/

npx skills add agiwhitelist/auteur

Install them, then just ask Claude to "add motion" to a page — timing, easing and 3D, like the big sites. 😉

Want more? Go further in the Atlas Room Skool class

This page gives you the tools. The Skool class takes you step by step — full courses and guides to build and sell your own AI app or SaaS, in Darija, with a new lesson every week.

Join the Skool class →

New to vibe coding? See what you'll learn →

🖥️AGENTBOX

DEVTEAM👨‍💻