oversized-cursor
oversized-cursor — an installable skill for AI agents.
By heygen-com · 59,861 installs
npx skills add heygen-com/hyperframes --skill oversized-cursor
Source repository · Upstream listing
Oversized Cursor — the eye carrier
A deliberately oversized macOS style pointer that travels the frame as a visible
protagonist : it enters from off screen, walks the viewer's eye to the next point of
interest, clicks to cause the next thing that happens, and leaves. Production proven
across multiple launch films.
Why it exists. Big cursor movement is one of the cheapest high yield motion sources
in a launch video: one element, transform only tweens, and it (1) brings the eye across
the screen on scenes that would otherwise read as dead, (2) gives causal ignition to
morphs/transitions ("the click did that"), and (3) segments the eye out of a stale
state when kicking off a new scene or a complex animation sequence. Bigger is better —
an actual size cursor disappears at video scale.
Size & look (house convention)
Full frame scenes: 7cqw (≈134px at 1920). In mock / small frame variants:
4.6–5.5cqw . Never smaller.
One SVG arrow geometry everywhere. Two proven fills — white body + black stroke, or
black body ( 1c1c1c ) + white stroke (1.4px). Pick per scene contrast, keep it
constant per film.
Brand motif cursors (the power play). The macOS arrow is the DEFAULT, not a
mandate. When the subject brand has a recognizable cursor identity — a collaborative
design tool's colored multiplayer arrow with a name tag (Figma style), a creative
suite's precision crosshair, a distinctive product pointer — use THAT cursor instead:
instantly legible brand language for anyone who knows the product. Same laws apply
unchanged (oversized scale, physical entry/exit, tip targeting, click ignition), and
a name tag variant travels as one rigid unit (tag trailing the arrow). Reach for it
only when the motif is genuinely referenceable; a cursor nobody recognizes is just a
weird arrow — default back to macOS.
filter: drop shadow(0 4px 6px rgba(0,0,0,.3)) , pointer events: none ,
z index above all scene content, will change: transform .
Entry law — physical, never revealed
The cursor always enters from off screen (canonical: from below, top:115–120% )
and travels to its first target in one decelerating glide. It must feel like it
entered the room . Never opacity fade it in at a resting position, never mask reveal
it — that reads as a glitch (a real, repeatedly observed failure mode).
Default path: straight up the y axis to the target — no fragmented diagonals.
A diagonal is fine when it IS the story (entering toward an off axis target), but it
is one continuous vector either way.
duration: 0.4–0.92s , ease: power3.out , immediateRender: false on the fromTo.
Tip targeting & the click tap
The hot spot is the arrow TIP, not the box center. Land the tip on the target's
center, and pivot all press scaling on the tip: transformOrigin: '21% 14%' (for the
house arrow path in a 24 unit viewBox).
Click = asymmetric compress/expand (1:2 ratio reads as a real tap):
The target's reaction is a separate, parallel tween (button: scale: 0.94 + press
color/shadow, starting at the same t ). Cursor only taps (e.g. focusing a text input)
get NO target reaction. Pair with cursor click ripple / press release spring for
the target side.
The click IGNITES the next beat
Never let a morph, typing run, window transform, or scene defining animation simply
start . Park the cursor on the trigger and let the click cause it, same frame:
click ▸ menu/submenu cascade, toggle flip
click ▸ typing kickoff into an input
click ▸ composer morph down / window shrink
click ▸ logo ignition / flight launch
click ▸ play state flip + UI life wake in a product mock
During long beats it doesn't own (typing, narration), the cursor drifts aside
(0.5–0.9s, power2.out ) — never sits frozen on top of the action, never wobbles idly.
Exit law & cross scene handoff
Two sanctioned exits — both physical, never an opacity fade in place :
1. Leave the frame : accelerate off the nearest edge with power2.in
( left:'118%' , left:' 12%' , or top:'116%' ), 0.5–0.7s.
2. Cut the curve handoff : in the final ~0.3s before a hard cut, the cursor starts
accelerating ( power2.in ) toward the NEXT scene's first click point, covering the
first ~1/3 of that path; the next composition gsap.set s the cursor at the
handoff pose and continues with power2.out at matched velocity. The cursor itself
becomes the carrier element that stitches the seam:
Checklist
[ ] ≥ 7cqw full frame (4.6–5.5cqw inside a mock) — when unsure, bigger
[ ] enters from off screen on one continuous vector (no fade/mask reveal)
[ ] tip lands on the target center; press pivots on transformOrigin: '21% 14%'
[ ] every click causes something, same frame
[ ] drifts aside during beats it doesn't own; zero idle wobble
[ ] exits physically (off frame or cut the curve handoff) — no fade in place