skills.rest
Gyanano
GyananoCOMMUNITY
Explore all skills by this author →
GitHub

overdrive

Create high-velocity browser animations with GPU-powered effects and accessibility safeguards.

5|Updated Mar 27, 2026
Search Tags:#browser-automation#view-transitions#ui-animation#spring-physics#experience-design#gpu-effects
One-click install
npx skills add https://github.com/Gyanano/Bower --skill overdrive-gyanano
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: overdrive
Source: https://github.com/Gyanano/Bower/tree/main/.agents/skills/overdrive
Command: npx skills add https://github.com/Gyanano/Bower --skill overdrive-gyanano

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Trying to deliver cinematic, high-performance UI moments without clear direction often results in effects that feel out of place or janky. Overdrive prevents misfires by mandating context gathering, progressive direction proposals, and AskUserQuestion confirmations before any technically ambitious engineering begins so the result aligns with what the project really needs. It also demands iteration with browser automation to ensure the "extraordinary" feeling actually holds up across real devices.

Core Features & Use Cases

  • Context-first entry: Invoke /frontend-design (and /teach-impeccable if no context exists) before coding, so you understand the brand personality, technical constraints, and what would genuinely wow these users.
  • Directional proposals & confirmation: Think through 2-3 radically different techniques—shader-driven hero, View Transitions morph, streaming validation form—describe each with trade-offs, and pause for the AskUserQuestion response before writing code.
  • High-velocity validation: Use browser automation tools to preview, verify, and refine each iteration, respecting prefers-reduced-motion, progressive enhancement, and fallback experiences so advanced animations never compromise usability.

Quick Start

Ask overdrive to run /frontend-design, gather project context, describe several extraordinary directions with trade-offs, confirm via AskUserQuestion, and then execute the user-approved option.

Frequently Asked Questions about overdrive

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add high-velocity UI animations and GPU effects to a web frontend?▼

High-velocity UI animations and GPU effects are implemented by gathering project context, proposing multiple directional techniques with trade-offs, and iterating with browser automation. This process ensures ambitious frontend experiences align with project goals before coding begins.

What is the best way to prototype cinematic motion for marketing pages without creating janky effects?▼

Prototyping cinematic motion requires proposing different techniques with trade-offs, confirming via user input, and validating with browser automation. This prevents out-of-place or janky effects by ensuring extraordinary visual polish holds up across real devices.

How do I build forms with streaming validation and spring physics interactions?▼

Forms with streaming validation and spring physics interactions are built by gathering context, proposing animation directions, and executing the user-approved option. Browser automation tools refine iterations while respecting progressive enhancement and fallback experiences.

Do I need to worry about accessibility when using GPU-powered browser effects?▼

Yes, GPU-powered browser effects require accessibility safeguards. The workflow mandates respecting prefers-reduced-motion settings, implementing progressive enhancement, and providing fallback experiences to ensure advanced animations never compromise usability.

Can I use View Transitions and shader effects for performant data tables demanding extraordinary polish?▼

Yes, View Transitions and shader effects suit performant data tables demanding extraordinary polish. The process involves context gathering, proposing techniques with trade-offs, and browser automation-driven iteration to verify performance across real devices.

Why does my ambitious frontend animation feel out of place despite high performance?▼

Ambitious frontend animations feel out of place without clear direction. The solution mandates context gathering, progressive direction proposals, and user confirmation before technically ambitious engineering begins, ensuring results align with project needs.

Related Skills

Explore More Design & Creative Skills→
kireevkit15-syskireevkit15-sys

shape

Run a structured discovery interview and generate a design brief.

Community
Advanced
oriysoriys

animate

Design purposeful animations and micro-interactions for dashboards, forms, and progressive web applications.

Community
Advanced
wzyxdwllwzyxdwll
14

overdrive

Render shader-based, physics-driven UI transitions at 60fps using WebGL/WebGPU.

Community
Advanced
gerald-icagerald-ica

overdrive

Create cinematic UI animations with 60fps performance and safe fallbacks.

Community
Advanced