Overdrive
Push a product UI past conventional polish with shaders, spring physics, scroll-driven motion, and 60fps interactions after design context is locked.
Overview
Overdrive is an agent skill most often used in Build (also Ship perf, Launch distribution polish) that pushes browser UIs past conventional limits with ambitious motion and interaction—only after Impeccable design contex
Install
npx skills add https://github.com/pbakaus/impeccable --skill overdriveWhat is this skill?
- Mandates Impeccable prep and Context Gathering Protocol before any overdrive work
- Propose-before-building gate so “extraordinary” matches project personality, not generic effects
- Technically ambitious patterns: shaders, spring physics, scroll-driven reveals, cinematic transitions
- Frames extraordinary as domain-appropriate (e.g. optimistic saves on settings vs particles on a portfolio)
- User-invocable overdrive mode with explicit entry ritual and optional target argument
- version 2.1.1
- mandatory Context Gathering Protocol via Impeccable
Adoption & trust: 63.4k installs on skills.sh; 35.9k GitHub stars; 3/3 security scanners passed (skills.sh audits).
What problem does it solve?
You want an interface that genuinely wows, but ad-hoc flashy effects clash with your product’s personality and skip the design guardrails you already rely on.
Who is it for?
Solo builders with an Impeccable-informed design direction who are ready to implement standout frontend motion, performance, and interaction on a specific screen or flow.
Skip if: Greenfield pages with zero design context (run Impeccable teach first), backend-only tasks, or teams that want subtle/conservative UI with no propose step.
When should I use this skill?
User wants to wow, impress, go all-out, or make something feel extraordinary on an interface—after Impeccable design context exists.
What do I get? / Deliverables
You get a scoped, context-aligned proposal for extraordinary UI implementation—then code that uses full browser power appropriately, with Impeccable prep completed first.
- Proposed extraordinary UI approach aligned to project personality
- Implementation using ambitious browser-native patterns where approved
Recommended Skills
Journey fit
Spans multiple journey phases - primary shelf plus alternate fits below.
Overdrive is where ambitious interface implementation lives in the solo-builder journey—after you know what you are building, not while you are still guessing positioning. The skill targets browser-native frontend craft (motion, performance, extraordinary interaction), which maps to the build → frontend shelf.
Where it fits
Prototype a hero interaction in a landing mock so validators feel the wow before full build.
Implement morphing dialogs and real-time streaming form feedback on the core product UI.
Tune scroll-driven reveals and animation budgets so extraordinary motion stays smooth on mid-tier devices.
Ship a cinematic marketing page transition that matches the product’s established personality from Impeccable context.
How it compares
A gated high-polish frontend workflow on top of Impeccable principles—not a generic “make it pretty” one-shot prompt.
Common Questions / FAQ
Who is overdrive for?
Solo and indie builders shipping web UIs with coding agents who already use Impeccable and want technically ambitious, personality-matched interface work—not random visual noise.
When should I use overdrive?
During Build frontend when you want to wow users with motion and interaction; during Ship perf when you need 60fps-feeling polish; during Launch when marketing surfaces need cinematic presentation—always after Impeccable context gathering and a propose step.
Is overdrive safe to install?
Treat it like any third-party agent skill: review the Security Audits panel on this Prism page and inspect the skill bundle in your repo before granting shell, network, or browser permissions to the agent.
Workflow Chain
Requires first: skill pbakaus impeccable impeccable
SKILL.md
READMESKILL.md - Overdrive
Start your response with: ``` ──────────── ⚡ OVERDRIVE ───────────── 》》》 Entering overdrive mode... ``` Push an interface past conventional limits. This isn't just about visual effects — it's about using the full power of the browser to make any part of an interface feel extraordinary: a table that handles a million rows, a dialog that morphs from its trigger, a form that validates in real-time with streaming feedback, a page transition that feels cinematic. ## MANDATORY PREPARATION Invoke /impeccable — it contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding — if no design context exists yet, you MUST run /impeccable teach first. **EXTRA IMPORTANT FOR THIS SKILL**: Context determines what "extraordinary" means. A particle system on a creative portfolio is impressive. The same particle system on a settings page is embarrassing. But a settings page with instant optimistic saves and animated state transitions? That's extraordinary too. Understand the project's personality and goals before deciding what's appropriate. ### Propose Before Building This skill has the highest potential to misfire. Do NOT jump straight into implementation. You MUST: 1. **Think through 2-3 different directions** — consider different techniques, levels of ambition, and aesthetic approaches. For each direction, briefly describe what the result would look and feel like. 2. **ask the user directly to clarify what you cannot infer.** to present these directions and get the user's pick before writing any code. Explain trade-offs (browser support, performance cost, complexity). 3. Only proceed with the direction the user confirms. Skipping this step risks building something embarrassing that needs to be thrown away. ### Iterate with Browser Automation Technically ambitious effects almost never work on the first try. You MUST actively use browser automation tools to preview your work, visually verify the result, and iterate. Do not assume the effect looks right — check it. Expect multiple rounds of refinement. The gap between "technically works" and "looks extraordinary" is closed through visual iteration, not code alone. --- ## Assess What "Extraordinary" Means Here The right kind of technical ambition depends entirely on what you're working with. Before choosing a technique, ask: **what would make a user of THIS specific interface say "wow, that's nice"?** ### For visual/marketing surfaces Pages, hero sections, landing pages, portfolios — the "wow" is often sensory: a scroll-driven reveal, a shader background, a cinematic page transition, generative art that responds to the cursor. ### For functional UI Tables, forms, dialogs, navigation — the "wow" is in how it FEELS: a dialog that morphs from the button that triggered it via View Transitions, a data table that renders 100k rows at 60fps via virtual scrolling, a form with streaming validation that feels instant, drag-and-drop with spring physics. ### For performance-critical UI The "wow" is invisible but felt: a search that filters 50k items without a flicker, a complex form that never blocks the main thread, an image editor that processes in near-real-time. The interface just never hesitates. ### For data-heavy interfaces Charts and dashboards — the "wow" is in fluidity: GPU-accelerated rendering via Canvas/WebGL for massive datasets, animated transitions between data states, force-directed graph layouts that settle naturally. **The common thread**: something about the implementation goes beyond what users expect from a web interface. The technique serves the experience, not th