Wireframe Scan Reveal
Gives an agent a recipe for animating 3D models in with a wireframe scan that leads the solid surface
- Repository
- MengTo/Skills
- Stars
- 7,187
- Licence
- MIT
- Files
- 4 files
What it does
This skill teaches an AI agent how to build a 3D entrance animation for web pages using Three.js. A wave expands from a point, drawing a temporary wireframe mesh at its front while the solid model fills in behind it, then the wireframe fades and is removed. The skill includes shader code, timing values, reduced-motion fallbacks, performance and cleanup guidance, and a verification checklist. It is written for building web visuals rather than for general tasks.
Great for
- Front-end developers adding a 3D model intro to a marketing or portfolio page
- Designers who want a holographic or survey-style reveal that they can hand to a developer or agent
- Teams building Three.js scenes that need accessible, reduced-motion-friendly entrances
Skip it if
- Projects that do not use Three.js or WebGL, since the code and advice assume that stack
- Heavy scenes with dense geometry on low-powered devices, because the temporary wireframe pass adds real GPU cost the skill itself warns about
Try asking
- “Add a wireframe scan reveal to my 3D product model so it sweeps in from the lower-left corner”
- “Build a topology intro animation for this Three.js hero section with reduced-motion support”
- “Recreate the wireframe scan demo in demo/index.html for my own page”
Install in 3 steps
- 1
Download the skill
The ZIP contains the 4 original files, the MIT licence and an attribution note.
build-wireframe-scan-reveal.zip - 2
Add it to your agent
Claude Code (all projects)
mkdir -p ~/.claude/skills && unzip build-wireframe-scan-reveal.zip -d ~/.claude/skills/Claude Code / Agent SDK (this project only)
mkdir -p .claude/skills && unzip build-wireframe-scan-reveal.zip -d .claude/skills/Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.
- 3
Ask for the task
No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.
Get better results
- Name the page and model you want revealed so the agent can match the demo's scene and layout to your project.
- Ask the agent to profile GPU frame time before and during the wireframe pass if performance matters, since the skill says not to assume a speedup.
- Test with the reduced-motion setting and on a narrow mobile viewport, as the verification list recommends.
What's inside
- agents/openai.yaml
- demo/index.html
- demo/PROMPT.md
- SKILL.md
Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.