A Claude Code skill
OVERDRIVE
Ask an AI for a website and you get the average. This skill refuses it.
/overdrive build · skeleton · audit · refine
§1 · Why slop happens
A model’s first idea is its most probable idea.
And the most probable website is the average website.
§2 · Diverge
These were this page’s first 15 ideas.
Written down before any design, then banned, along with the 46 patterns in its slop catalogue. The good ideas start somewhere after attempt eleven.
- A fake terminal typing the command
- Purple glow orb behind the headline
- Four mode cards with line icons
- “Escape AI slop” in gradient text
- A before/after slider
- A numbered-circle stepper
- Neural particle network
- One code block with a copy button
- “Loved by developers” quotes
- A marquee of tech logos
- A bento grid
- The sparkle AI icon
- Glass cards over blurred blobs
- An FAQ accordion
- Sticky stacking cards
§3 · The pipeline
Nine phases. Three gates where you decide.
- 0OrientReads your repo first, so it never asks what the code already answers.
- 1Interview gateIntensity, 3D tier, direction. Two short rounds at most.
- 2SubstanceMines the product for real nouns, copy, assets and one core metaphor.
- 3Diverge gateBans its first 15 ideas, researches the edge, pitches three directions.
- 4Storyboard gateA cut sheet: every section’s job, motion and signature moment.
- 5BuildFrom a working kit, in your stack and your conventions.
- 6VerifyScreenshots every viewport and theme. Two full rounds, minimum.
- 7ElevateA harsh art-director pass. Whatever fails the thousand-sites test gets rebuilt.
- 8ReportWhat was verified, what is invented, what still needs a real device.
§4 · The tail
Overdrive samples from the tail.
The floor, not the ceiling.
Pictured: a real build from the session that made this skill — a 3D landing page, 1,500 logo tiles, rendered live. That is the minimum for intensity 4–5.
§5 · Verify
It screenshots its own work, then measures it.
findings raised by shoot.mjs on the page this skill was born from. Real output, not a mock-up.
- contrast“Welcome to” 1.87:1, needs 3
- placeholdera letter-square “G” where a real logo belongs fixed
- clippedcard paragraph 8% visible at 390×664
- targetlogo link 94×30, needs 44
- clipped“Figma MCP” chip 4% visible
“Never claim what you did not see.”
- boot
- clipping
- contrast
- placeholders
- targets
- reduced motion
- no WebGL
§6 · Intensity
How crazy? You pick. It commits.
Quiet precision
Minimal, crazy in execution: one idea carried out obsessively, flawless type.
The headline’s tracking tightens as you scroll; a single hairline draws the whole page’s grid.
Minimal can be crazy. Level 1 done right beats level 5 done averagely.
§7 · Use it
It takes one paste.
01 Install · paste this into Claude Code
Needs Claude Code. The screenshot checks also use Node 18+, Chrome and puppeteer-core; Claude will tell you if one is missing. MIT licensed.
02 Run it · edit the box, then copy · or just say “use the overdrive skill”
Make a page or site. If there is nothing to stand on, it builds a skeleton first.
you get → the page · .overdrive/ trail · QA report
03 Answer at the three gates. The rest is its job.
§8 · The museum
The tail, collected.
Real sites made with overdrive, each checked by hand before it was hung. Most samples stay in the average; that’s the point.
Walk the whole museum →Stop shipping the average.
Paste one prompt into Claude Code to install it
This page was made with /overdrive build. Its whole trail (brief, bans, directions, storyboard) sits in site/.overdrive/.
4 modes · 9 phases · 3 gates · 46 slop patterns · 7 mechanical checks · 10-axis rubric · MIT license