Not in the top 1,000 by GitHub stars
moguzbulbul/blueprint-animation
Claude Design skill: animated before → after UX redesign, explained step by step through a blueprint drawing. By @moguzbulbul.
History
Review weekly changes to SKILL.md before updating. Dates mark the weeks in which we observed each version; checks apply to the recorded commits.
View weekly changes
SKILL.md
Week of Nov 2, 2026 · +0 / −0 lines
Before Network or broad shell → After Network or broad shell
29aa30b83db4 → 29aa30b83db4
Diff text is unavailable under the recorded licenses. Line counts and the GitHub link remain available.
Week of Oct 26, 2026 · Line counts unavailable
Before Not checked yet → After Network or broad shell
First observation → 29aa30b83db4
No earlier version was observed for comparison.
Heat
0.4- Star growth, last 7 daysNot available
- Star growth, last 24 hoursNot available
- Rank movement, last 7 daysNot available
- Commits, last 30 daysNot available
- Accounts asking about it through MCP, last 7 daysNot available
- Hot votes this weekNot available
Heat never changes the order by stars, and sponsorship never touches it. How heat works
Stars over time
30-day change not yet available: not enough history.
Individual skills in this repository
How it works
blueprint-animation
When your agent uses it
Blueprint animation that explains UX decisions step by step. With Before and After, changed parts rebuild. With one screen, each module is annotated with what and why. For case studies and posts.
What it loads into context
Frontmatter
64 tokensAlways available to the agent
SKILL.md
3,875 tokensWhen the skill is activated
Reference documents
992 tokensLoaded on request
Token counts are estimates. Scripts run separately; they are not counted as reference context.
The playbook
- 0. Fidelity — the Figma design is exact
- 1. Before you build — gather
- 2. The per-step sequence (never skip a phase)
- 3. Blueprint drawing style
- 4. Text and overlap rules (checked every time)
- 5. Architecture (animations_v3 starter)
- 6. Performance (required, or it stutters)
- 7. QA before handing over
- 8. Explain mode (one screen, no Before)
Scripts executed separately
example-scene.jsx
Files
LICENSEasset19,616 bytesREADME.mddoc4,008 bytesSKILL.mdcore14,793 bytesSKILL.mdcore14,793 bytesSKILL.mdcore14,793 bytesexample-scene.jsxruns42,903 bytesmedia/example.mp4asset12,030,271 bytesmedia/preview.gifasset7,137,500 bytes
No excerpt is shown for this license. Read the source on GitHub.
View the complete source on GitHubSkills included
- blueprint-animation
Repository facts
- License
- No license detected
- Created
- Sep 27, 2026
- Last pushed
- Sep 27, 2026
- Forks
- 23
- Open issues
- 1
- Project activity
- Active
Before you install
Network or broad shellAutomated signals, not a guarantee
Checked Nov 6, 2026
Not fully analyzed: some files were too long, unreadable or missing. This never lowers the level.
Show 3 notes
SKILL.md:1Analysis incomplete: Referenced executable target unavailable; not analyzedSKILL.md:1Analysis incomplete: Referenced executable target unavailable; not analyzedmedia/example.mp4:1Analysis incomplete: Blob exceeds size or total-read limit; file skipped
- No broad tool permissions
- No dangerous shell commands
- 13 network referencesin 3 files: README.md:5 LICENSE:1 SKILL.md:2
- No hidden or obfuscated text
- No instruction overrides
- 1 executable scriptin 1 file: example-scene.jsx:1
- No access to secrets
- No requests to vote in Hot
Show all 14 signals by file
LICENSE
- Network accessline 1
Copyright (c) 2026 Oğuz (@moguzbulbul, https://oguz.design) - Network accessline 3
This work is licensed under the Creative Commons Attribution-NonCommercial 4.0 International License (CC BY-NC 4.0). Commercial use requires written - Network accessline 4
International License (CC BY-NC 4.0). Commercial use requires written
README.md
- Network accessline 5
Created by **Oğuz** · [@moguzbulbul](https://x.com/moguzbulbul) · [oguz.design](https://oguz.design) - Network accessline 7
Inspired by [Arjun Mahesh](https://x.com/arjmahesh). - Network accessline 9
Free for non-commercial use ([CC BY-NC 4.0](LICENSE)). Commercial use needs written permission. - Network accessline 49
1. Download [`blueprint-animation.zip`](https://github.com/moguzbulbul/blueprint-animation/releases/download/v1.3.1/blueprint-animation.zip) (v1.3.1). - Network accessline 61
© 2026 Oğuz ([@moguzbulbul](https://x.com/moguzbulbul)). Licensed under [CC BY-NC 4.0](https://creativecommons.org/licenses/by-nc/4.0/). See [`LICENSE`](LICENSE). - Network accessline 63
- **You may** use, share and adapt this skill for non-commercial purposes, with credit to Oğuz (@moguzbulbul) and a link to this repo. - **Commercial use**, for example selling the skill or including it in a paid product or service, needs w - Network accessline 64
- **Commercial use**, for example selling the skill or including it in a paid product or service, needs written permission. Ask on X: [@moguzbulbul](https://x.com/moguzbulbul).
SKILL.md
- Network accessline 2
name: blueprint-animation description: Blueprint animation that explains UX decisions step by step. With Before and After, changed parts rebuild. With one screen, each module is annotated with what and why. For case studies and posts. licen - Network accessline 3
description: Blueprint animation that explains UX decisions step by step. With Before and After, changed parts rebuild. With one screen, each module is annotated with what and why. For case studies and posts. license: CC BY-NC 4.0, non-comm - Network accessline 4
license: CC BY-NC 4.0, non-commercial use only. See LICENSE.
example-scene.jsx
- Executable scriptline 1
Executable file
How the signals fit together
Facts from a static read of the files at the pinned commit. They describe what the code does, not why.
Some files could not be read; the facts below still hold.
Signal confidence: 11 facts
- Network access in prose of documentationREADME.md:5Low confidence
- Network access in prose of documentationREADME.md:7Low confidence
- Network access in prose of documentationREADME.md:9Low confidence
- Network access in prose of documentationREADME.md:49Low confidence
- Network access in prose of documentationREADME.md:61Low confidence
- Network access in prose of documentationREADME.md:63Low confidence
- Network access in prose of documentationREADME.md:64Low confidence
- Network access in the frontmatter of the SKILL.mdSKILL.md:2Low confidence
- Network access in the frontmatter of the SKILL.mdSKILL.md:3Low confidence
- Network access in the frontmatter of the SKILL.mdSKILL.md:4Low confidence
- Executable script in code of a file that runsexample-scene.jsx:1High confidence
Works with
| Agent | Status | Evidence | Install to |
|---|---|---|---|
| Claude Code | Compatible | Standard SKILL.md SKILL.md | .claude/skills/<skill-name>/ |
| Codex | Compatible | Standard SKILL.md SKILL.md | .agents/skills/<skill-name>/ |
| Cursor | Compatible | Standard SKILL.md SKILL.md | .cursor/skills/<skill-name>/ |
| Gemini CLI | Compatible | Standard SKILL.md SKILL.md | .gemini/skills/<skill-name>/ |
| GitHub Copilot | Compatible | Standard SKILL.md SKILL.md | .github/skills/<skill-name>/ |
| OpenCode | Compatible | Standard SKILL.md SKILL.md | .opencode/skills/<skill-name>/ |
- Native The repository ships a manifest, folder or frontmatter field for this agent.
- Compatible A standard SKILL.md that this agent can read.
- Unknown No evidence either way.
Derived automatically from paths, manifests and frontmatter. Not tested on each agent.