Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add kyh/vibedgames --skill animationgit clone --depth 1 https://github.com/kyh/vibedgamesWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/kyh/vibedgames/animation)<a href="https://agentmods.dev/skills/kyh/vibedgames/animation"><img src="https://agentmods.dev/badge/skills/kyh/vibedgames/animation.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00150 | $0.01795 |
| Opus 5 | $0.00075 | $0.00898 |
| Sonnet 5 | $0.00030 | $0.00359 |
| Haiku 4.5 | $0.00015 | $0.00179 |
Grade A, and why
animation scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 7d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 124 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Animation craft
Timing and spacing ARE the animation: per-frame durations carry more weight than frame counts. With 4–8 frame budgets, every frame is a key pose — if it doesn't read from keys alone, more inbetweens won't save it. Fewer, stronger frames beat smooth; even inbetweening reads as mush.
Timing & spacing
- Logic at 60fps, sprites at 8–12fps. 12 is the pixel-art sweet spot; 18+ reads rushed, ≤6 reads idle. Never tie hitboxes to render framerate.
- Vary rate per clip: idle 4–8fps, walk 8–10, run/attacks up to 15–20.
- Uneven timing for attacks: slow anticipation (~120–200ms/frame),
near-instant strike (1–2 frames at ~30–60ms, one may be a smear), moderate
recovery (~80–150ms). Even timing for cycles (walk ~80–150ms/frame, run
~50–80ms). In Phaser use per-frame
durationoverrides, not one globalframeRate, for non-cycles. - Slow in, slow out: cluster spacing at a pose's start/end, big jump mid-motion. Five frames = small, small, HUGE, small, small.
- Hold the follow-through pose a beat longer; overshoot past rest on fast moves, then settle.
- Loops must not double the contact pose at the seam. Watch every loop for 10 straight seconds before calling it done.
Frame budgets (small sprites)
| Clip | Frames | Notes |
|---|---|---|
| Idle | 2–4 | 1px breathing bob; move interior pixels/hair, not the silhouette |
| Walk | 4–8 | 4 = two contacts + two passing; cut "up/recoil" frames first |
| Run | 6 (4 tiny, 3 with extreme poses) | not a fast walk: airborne moments, lean, arm swing |
| Jump | 3–5 phases | crouch → stretch ascent → apex → fall → land squash; select by velocity, not a timed clip |
| Attack | 3–8 | 1–3 anticipation, 1–2 strike, 1–3 recovery |
| Hit react | 1–3 | one strong recoil pose + white flash beats three soft poses |
| Death | 4–6 | one-shot, ends on a settled pose |
| FX (slash/smoke) | 3–6 | expand → disperse → fade; can run 15–24fps |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 7d ago First seen · 124 lines · 150 tokens per session scan A b78261646afa
animation is a skill published in the GitHub repository kyh/vibedgames (55 stars, last pushed today), licensed MIT. It adds 150 tokens to every session and 1,795 once invoked, about $0.0007 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
tiun-sdk
Use when integrating or debugging the tiun SDK (@tiun/sdk), tiun's JavaScript library for authentication, subscription billing, one-time purchases, and time-based paywalls. Triggers on imports of @tiun/sdk, calls like tiun.init, tiun.checkout, tiun.login, tiun.start, or questions about tiun products, entitlements…
supabase
Use when doing ANY task involving Supabase: Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues, supabase-js, @supabase/ssr, RLS, schema migrations, CLI, MCP server. Includes security checklist.
saas-payments
SaaS uygulaması için ödeme ve abonelik sistemi kur. Stripe veya Lemon Squeezy ile checkout, webhook, abonelik yönetimi, fiyatlandırma planları ve müşteri portalı yapılandır. Bu skill'i kullanıcı ödeme, abonelik, fiyatlandırma, Stripe, gelir, plan, subscription veya checkout ile ilgili bir şey istediğinde kullan. "Para…
react-three-fiber
Build declarative 3D scenes with React Three Fiber (R3F) - a React renderer for Three.js. Use when building interactive 3D experiences in React applications with component-based architecture, state management, and reusable abstractions. Ideal for product configurators, portfolios, games, data visualization, and…
framer-motion
Creates smooth animations and micro-interactions using Framer Motion including page transitions, gestures, scroll-based animations, and orchestrated sequences. Use when users request "add animation", "framer motion", "page transition", "animate component", or "micro-interactions".
remotion-best-practices
Best practices for Remotion - Video creation in React.