frost-sequence-camera-orbit
An orbiting camera follows an ice logo as it breaks apart, reforms into two text moments, and fades. HyperFrames block, 1920×1080, 22.5s, 216 variables.
Esta skill incluye scripts que tu agente puede ejecutar. Ver qué archivos
Resumen
Frost Sequence Camera Orbit
A complete 22.5-second ice sequence: logo, first text, second text, breakup, and fade. The camera orbits the fixed objects with slower front-facing passes for reading. The same particle field carries each transition. Customize the two text moments and SVG logo; the source includes editable camera and assembly timing.
Composition id: frost-sequence-rig. Duration 22.5 s at 30 fps, 1920×1080.
Files
frost-sequence-camera-orbit.html(131 KB)assets/example-logo.svg(1 KB)assets/fonts/Geist-Bold.ttf(65 KB)assets/fonts/Geist-OFL.txt(4 KB)assets/fonts/Geist-Regular.ttf(65 KB)assets/fonts/Geist-SemiBold.ttf(65 KB)assets/frost.js(1.5 MB)assets/Three-LICENSE.txt(1 KB)assets/ThreeMeshBVH-LICENSE.txt(1 KB)assets/OpentypeJS-LICENSE.txt(1 KB)assets/Clipper-LICENSE.txt(3 KB)assets/gsap-3.14.2.min.js(128 KB)assets/GSAP-NOTICE.txt(1 KB)assets/logo.svg(1 KB)assets/shards-atlas.png(fetched from the CDN at install)assets/test-mark.svg(1 KB)assets/textures/bluenoise64.png(12 KB)assets/textures/ice-inclusions-generated.png(fetched from the CDN at install)
Install
Install with npx hyperframes add frost-sequence-camera-orbit; by default the files above land under compositions/frost-sequence-camera-orbit/. Then mount the block from the host index.html:
<div
data-composition-id="frost-sequence-rig"
data-composition-src="compositions/frost-sequence-camera-orbit/frost-sequence-camera-orbit.html"
data-start="0"
data-duration="22.5"
data-track-index="1"
data-width="1920"
data-height="1080"
></div>Render with custom values by targeting the composition file directly:
npx --yes [email protected] render 'compositions/frost-sequence-camera-orbit/frost-sequence-camera-orbit.html' --variables '{"headline1":"Hard to|break.","headline2":"Easy to|remember."}'Variables
Read at runtime via window.__hyperframes.getVariables(); declared on the composition root as data-composition-variables (single-quoted attribute, plain JSON).
| id | type | default | label / range |
|---|---|---|---|
headline1 | string | `"Hard to | break."` |
headline2 | string | `"Easy to | remember."` |
logoUrl | string | "assets/logo.svg" | Logo SVG asset path (upload in Assets, then paste path) max 200 chars |
assemblyMode | enum | "hybrid" | Assembly response (physical |
materialBaseColor | color | "#ffffff" | Base color |
baseRoughness | number | 0.31 | Base roughness 0–0.5 step 0.005 |
materialTransmission | boolean | true | Transmission |
materialBacklight | number | 0.27 | Backlight through ice 0–2 step 0.01 |
ior | number | 1.675 | Index of refraction 1–2 step 0.005 |
thicknessScale | number | 2.04 | Thickness scale 0.1–3 step 0.01 |
materialAbsorption | boolean | true | Absorption / tint |
attenuationColor | color | "#d5f4ff" | Attenuation colour (white = no absorption, clear glass) |
attenuationDistance | number | 6.54 | Attenuation distance 0.05–12 step 0.01 |
materialDispersion | boolean | false | Dispersion |
dispersion | number | 0.12 | Dispersion (0 = off; on/off reloads) 0–0.3 step 0.005 |
materialReflections | boolean | true | Reflections |
envIntensity | number | 2.04 | Environment intensity 0–3 step 0.01 |
specularIntensity | number | 1.44 | Specular intensity 0–2 step 0.01 |
materialFrost | boolean | true | Frost |
materialInteriorFrost | number | 0 | Uniform frost 0–1 step 0.01 |
frostScale | number | 0.7 | Scale 0.2–6 step 0.05 |
frostThreshold | number | 0.62 | Threshold (1 = no frost, clear glass) 0–1 step 0.01 |
frostSoftness | number | 0.24 | Softness 0.01–1 step 0.01 |
frostRoughness | number | 0.73 | Roughness 0–1 step 0.01 |
frostDiffuse | number | 0.11 | Diffuse (how much light frosted areas catch) 0–1 step 0.01 |
materialSurfaceBumps | boolean | false | Object surface bumps / crack notches |
materialCrystals | boolean | true | Crystal bumps |
crystalBump | number | 0.01 | Crystal bump 0–1 step 0.01 |
crystalScale | number | 4 | Crystal scale 4–80 step 1 |
materialGrain | boolean | true | Grain bumps |
materialGrainAmount | number | 0.47 | Grain strength 0–2 step 0.01 |
materialGrainScale | number | 150 | Grain scale 1–150 step 1 |
materialCutNormals | boolean | true | Fracture normals |
materialMicro | boolean | true | Micro bumps |
microBump | number | 0.445 | Micro bump 0–1 step 0.005 |
microScale | number | 10 | Micro scale 10–200 step 1 |
microCoverage | number | 0.25 | Micro coverage 0–1 step 0.01 |
bumpMaskScale | number | 1.45 | Mask scale 0.1–6 step 0.05 |
materialRipples | boolean | true | Ripples |
rippleBump | number | 0.22 | Ripple bump 0–1 step 0.01 |
rippleScale | number | 23 | Ripple scale 2–30 step 0.5 |
materialSmudges | boolean | true | Smudges |
smudgeAmount | number | 0.78 | Amount 0–1 step 0.01 |
smudgeCoverage | number | 0.58 | Coverage 0–1 step 0.01 |
smudgeMaskScale | number | 1.85 | Mask scale 0.1–6 step 0.05 |
smudgeAnisotropy | number | 16.5 | Anisotropy 1–20 step 0.5 |
smudgeRoughness | number | 0.75 | Roughness 0–1 step 0.01 |
smudgeWhiteness | number | 0.035 | Whiteness 0–0.5 step 0.005 |
smudgeScale | number | 1.3 | Scale 0.5–10 step 0.1 |
materialCracks | boolean | true | Cracks |
crackLargeScale | number | 2.45 | Large scale 0.3–8 step 0.05 |
crackWarp | number | 0.22 | Warp 0–1.5 step 0.01 |
crackCoverage | number | 0.19 | Coverage 0–1 step 0.01 |
crackRegionScale | number | 1.8 | Region scale 0.1–4 step 0.05 |
crackRegionCoverage | number | 0.6 | Region coverage 0–1 step 0.01 |
veinScale | number | 8 | Vein scale 1–20 step 0.25 |
veinContrast | number | 0.55 | Vein contrast 0–1 step 0.01 |
crackWidth | number | 0.0025 | Width 0.0005–0.02 step 0.0005 |
crackBrightness | number | 0.65 | Brightness 0–3 step 0.01 |
crackDarkness | number | 0.69 | Darkness 0–1 step 0.01 |
crackRefraction | number | 0.076 | Refraction 0–0.1 step 0.001 |
crackSurfaceStrength | number | 0.16 | Surface strength 0–1 step 0.01 |
fineScale | number | 18.4 | Fine scale 2–20 step 0.1 |
fineAmount | number | 0.52 | Fine amount 0–1 step 0.01 |
fineCoverage | number | 1 | Fine coverage 0–1 step 0.01 |
materialScatter | boolean | true | Internal scattering |
materialInclusionScale | number | 0.05 | Inclusion scale 0.05–3 step 0.01 |
materialInclusionAmount | number | 2 | Photographic inclusions 0–2 step 0.01 |
interiorScatter | number | 0.09 | Interior scatter 0–1 step 0.01 |
materialClearcoat | boolean | true | Clearcoat |
clearcoat | number | 0 | Clearcoat 0–1 step 0.01 |
clearcoatRoughness | number | 0 | Clearcoat roughness 0–1 step 0.005 |
materialShardNormals | boolean | true | Shard normals |
spriteNormal | number | 0.15 | Sprite normal strength 0–2.5 step 0.05 |
materialShardFrost | boolean | true | Shard frost |
materialShardTransmission | boolean | true | Shard transparency |
spriteSeeThrough | number | 1 | See-through (0 = off; on/off reloads) 0–1 step 0.01 |
materialShardReflections | boolean | true | Shard reflections |
minPixelSize | number | 0.25 | Minimum pixel size 0–4 step 0.05 |
grainSizeMultiplier | number | 1.05 | Grain size multiplier 0.2–4 step 0.05 |
spriteSize | number | 1.9 | Sprite size 0.3–4 step 0.05 |
spriteTilt | number | 12 | Sprite tilt 0–70 step 1 |
spriteAlphaCut | number | 0.6 | Alpha cut 0.05–0.6 step 0.01 |
fontWeight | enum | "600" | Type · Weight (Geist) (400 |
letterSpacing | number | 0.01 | Type · Letter spacing -0.1–0.4 step 0.005 |
shardAmount | number | 0.44 | Shards · Visible fraction of the broken volume (Powder amount) 0.02–1 step 0.01 |
strayDust | number | 24 | Shards · Ambient dust motes around the object (the experiment had 40) 0–200 step 1 |
sliceRadius | number | 0.6 | Break · First (diagonal) slice radius 0.05–1.5 step 0.01 |
sliceStrength | number | 21.5 | Break · First slice strength 1–40 step 0.5 |
finalEjectBoost | number | 2.5 | Break · Last break: eject speed and speed cap multiplier 1–6 step 0.1 |
shatterRadius | number | 0.45 | Break · Follow-up slice radius (sets their spacing too) 0.1–1.5 step 0.01 |
shatterStrength | number | 32.5 | Break · Follow-up slice strength 1–40 step 0.5 |
cutThreshold | number | 0.3 | Tune break · Cut threshold (surface gone above this erosion) 0.3–0.98 step 0.01 |
cutSoftness | number | 0.19 | Tune break · Cut softness 0.005–0.3 step 0.005 |
edgeWidth | number | 0.19 | Tune break · Crumbly edge band width 0.05–0.8 step 0.01 |
edgeInset | number | 0 | Tune break · Edge inset 0–0.3 step 0.005 |
brushSoftness | number | 0.15 | Tune break · Brush softness (edge falloff of a slice) 0.02–1 step 0.01 |
brushNoise | number | 0.4 | Tune break · Brush noise (ragged boundary) 0–1 step 0.01 |
crumbleRate | number | 4.3 | Tune break · Crumble rate along cracks (high = the whole shape goes at once) 0–6 step 0.05 |
crumbleCrackBias | number | 5.1 | Tune break · Crumble crack bias 0–6 step 0.05 |
crumbleDuration | number | 0.35 | Tune break · Crumble duration after a stroke 0–2 step 0.01 |
ejectSpeed | number | 0.91 | Flight · Eject speed 0–4 step 0.01 |
ejectSpread | number | 0.48 | Flight · Eject spread along the normal 0–3 step 0.01 |
ejectTurbulence | number | 4 | Flight · Eject turbulence 0–4 step 0.01 |
drag | number | 0 | Flight · Drag (speed decays by this per second) 0–8 step 0.01 |
gravity | number | 0 | Flight · Gravity (0 = shards never fall) 0–2 step 0.005 |
turbulence | number | 4 | Flight · Turbulence strength (curl noise) 0–4 step 0.01 |
turbulenceScale | number | 2.65 | Flight · Turbulence scale 0.2–8 step 0.05 |
turbulenceDecay | number | 3.65 | Flight · Turbulence decay with age (low = keeps swirling) 0.05–4 step 0.01 |
clumpCohesion | number | 0.9 | Flight · Clump cohesion (shards orbit a leader; 0 = none) 0–10 step 0.05 |
followObject | number | 30 | Flight · Shards follow the object motion for (s; 30 = whole flight) 0–30 step 0.5 |
settleTime | number | 2.2 | Flight · Settle time (velocity is killed after this; 12 = never) 0.3–12 step 0.05 |
settledDrift | number | 1 | Flight · Organic drift once settled (curl noise) 0–1 step 0.005 |
maxSpeed | number | 26.3 | Flight · Speed cap 1–40 step 0.1 |
repelStrength | number | 30 | Flight · Push out of the solid shape while it breaks 0–30 step 0.1 |
repelRange | number | 0.97 | Flight · Push range outside the surface 0.02–2 step 0.01 |
repelRadial | number | 17.5 | Flight · Push away from the shape centre (clears pockets and the hole) 0–60 step 0.5 |
repelRadialRange | number | 3.3 | Flight · Radial push range (object radii) 1–4 step 0.05 |
tumble | number | 1.05 | Flight · Tumble rate 0–12 step 0.05 |
returnGroupStagger | number | 1.35 | Assembly · Regional delay (seconds) 0–1.5 step 0.05 |
returnGroupScale | number | 2.55 | Assembly · Region / noise size 0.1–3 step 0.05 |
returnGroupSeed | number | 60765 | Return · Group timing seed 0–65535 step 1 |
formSpread | number | 0 | Return · Wave spread (nearest shards leave first, seconds) 0–4 step 0.05 |
waveReach | number | 10 | Return · Distance over which the wave spreads 0.2–10 step 0.1 |
formJitter | number | 2.8 | Return · Per-shard stagger (random delay up to this) 0–3 step 0.05 |
formFill | number | 3 | Return · Fill-in rate for voxels no shard returns to 0.05–3 step 0.05 |
returnSpring | number | 29.9 | Return · Spring stiffness 0.5–40 step 0.1 |
returnDamping | number | 1.34 | Return · Spring damping 0.2–2 step 0.01 |
returnRamp | number | 0.45 | Return · Spring ramp-in (seconds until it pulls at full strength) 0–3 step 0.05 |
returnMaxSpeed | number | 60 | Return · Speed cap on the way home 1–60 step 0.5 |
alignToSurface | number | 1 | Return · Shards turn to lie on the surface (0 = keep tumbling) 0–1 step 0.01 |
alignCurve | number | 3.75 | Return · Alignment curve over the flight home (1 linear, higher = later) 0.2–4 step 0.05 |
healRate | number | 3 | Return · Neighbour heal rate 0.02–3 step 0.01 |
cellRestore | number | 60 | Return · Cell restore rate 0–60 step 0.5 |
landedFade | number | 1.65 | Return · Landed shard fade 0–2 step 0.01 |
refrostTime | number | 10.6 | Return · Refrost time 0.2–12 step 0.1 |
keyColor | color | "#f0f7ff" | Light · Key colour |
keyIntensity | number | 5.05 | Light · Key intensity 0–12 step 0.05 |
keyElevation | number | 42 | Light · Key elevation 10–89 step 0.5 |
keyAzimuth | number | -38 | Light · Key azimuth -90–90 step 0.5 |
keySize | number | 1.25 | Light · Key size (softbox) 0.2–3 step 0.01 |
fill | number | 0.18 | Light · Fill intensity (hemisphere, diffuse only: barely shows on clear ice) 0–1.5 step 0.005 |
fillColor | color | "#cadde9" | Light · Fill sky colour |
fillGroundColor | color | "#172635" | Light · Fill ground colour |
rim | number | 2.5 | Light · Rim spot intensity 0–5 step 0.01 |
rimColor | color | "#d9f1ff" | Light · Rim colour |
rimElevation | number | 20 | Light · Rim elevation (0 = straight behind) 0–89 step 0.5 |
swayAmplitude | number | 0 | Light · Key sway amplitude 0–0.15 step 0.001 |
swayPeriod | number | 35 | Light · Key sway period 2–40 step 0.5 |
envSoftbox | number | 1.1 | Light · Environment softbox (the main light on glass) 0–3 step 0.01 |
envRim | number | 1.4 | Light · Environment rim strip 0–3 step 0.01 |
envFill | number | 0.22 | Light · Environment front fill 0–1 step 0.005 |
backdropTop | color | "#050505" | Backdrop · Top colour |
backdropMid | color | "#050505" | Backdrop · Mid colour |
backdropBottom | color | "#050505" | Backdrop · Bottom colour |
backdropCenterX | number | 0.73 | Backdrop · Bloom centre X 0–1 step 0.005 |
backdropCenterY | number | 0.22 | Backdrop · Bloom centre Y 0–2 step 0.005 |
backdropRadius | number | 0.8 | Backdrop · Bloom radius 0.1–2 step 0.005 |
backdropFalloff | number | 0.85 | Backdrop · Bloom falloff 0.5–6 step 0.01 |
backdropNoise | number | 0 | Backdrop · Dither noise 0–3 step 0.05 |
bloomThreshold | number | 3 | Post · Bloom threshold 0–3 step 0.01 |
bloomIntensity | number | 0.04 | Post · Bloom intensity 0–1.5 step 0.005 |
bloomRadius | number | 1 | Post · Bloom radius 0–1 step 0.005 |
monochrome | number | 0.04 | Post · Monochrome 0–1 step 0.01 |
tonemap | enum | "aces" | Post · Tonemap (agx |
exposure | number | 1 | Post · Exposure 0.1–4 step 0.01 |
contrast | number | 1.03 | Post · Contrast 0.6–1.6 step 0.005 |
blackLift | number | 0 | Post · Black lift 0–0.1 step 0.001 |
vignetteStrength | number | 0.14 | Post · Vignette strength 0–1 step 0.005 |
vignetteSoftness | number | 1.2 | Post · Vignette softness 0.1–1.5 step 0.005 |
vignetteRadius | number | 1.2 | Post · Vignette radius 0.2–1.6 step 0.005 |
grainStrength | number | 0 | Post · Film grain 0–0.15 step 0.001 |
quality | enum | "full" | Performance · Quality profile (full |
upscaler | enum | "fsr1" | Performance · Upscaler (fsr1 |
renderScale | number | 1 | Performance · Scene resolution scale (upscaled to 1080p) 0.35–1 step 0.05 |
shapeResolution | enum | "256" | Shape voxel resolution (128 |
erosionResolution | enum | "96" | Performance · Erosion field resolution (voxels per axis) (64 |
particleCount | enum | "100k" | Performance · Powder particles (100k |
logoMeshDetail | number | 2 | Shape · Logo mesh detail (1-4; higher = finer surface) 1–4 step 1 |
deformStrength | number | 0 | Geometry · Ice deformation strength (0 = original) 0–0.08 step 0.001 |
deformScale | number | 0.41 | Geometry · Noise feature size (larger = broader) 0.001–0.5 step 0.001 |
deformSeed | number | 7 | Geometry · Deformation seed 0–65535 step 1 |
rimAzimuth | number | -146 | Light · Rim azimuth -180–180 step 1 |
rimAngle | number | 26 | Light · Rim beam angle 10–89 step 1 |
rimSize | number | 0.45 | Light · Rim reflection size 0.1–3 step 0.05 |
fillReflectionStrength | number | 0.3 | Light · Fill reflection strength 0–2 step 0.01 |
accentCoolIntensity | number | 3.71 | Studio Cool accent · intensity 0–4 step 0.01 |
accentCoolReflection | number | 2.31 | Studio Cool accent · reflection 0–3 step 0.01 |
accentCoolElevation | number | 63 | Studio Cool accent · elevation -85–85 step 1 |
accentCoolAzimuth | number | 22 | Studio Cool accent · azimuth -180–180 step 1 |
accentCoolSize | number | 2.65 | Studio Cool accent · size 0.1–3 step 0.05 |
accentCoolColor | color | "#ff5900" | Studio Cool accent · color |
accentWarmIntensity | number | 2.99 | Studio Warm accent · intensity 0–4 step 0.01 |
accentWarmReflection | number | 0.34 | Studio Warm accent · reflection 0–3 step 0.01 |
accentWarmElevation | number | 30 | Studio Warm accent · elevation -85–85 step 1 |
accentWarmAzimuth | number | -30 | Studio Warm accent · azimuth -180–180 step 1 |
accentWarmSize | number | 1.2 | Studio Warm accent · size 0.1–3 step 0.05 |
accentWarmColor | color | "#75aaff" | Studio Warm accent · color |
returnNoiseAmount | enum | "2" | Assembly · Regional pattern (2 |
assemblyFrontDuration | number | 3.2 | Assembly · Growth duration (seconds) 0–6 step 0.05 |
assemblyOriginX | number | -0.65 | Assembly · Growth start X -1–1 step 0.01 |
assemblyOriginY | number | 0.55 | Assembly · Growth start Y -1–1 step 0.01 |
assemblyAngle | number | -35 | Assembly · Seam direction (degrees) -180–180 step 1 |
assemblySpread | number | 0.65 | Assembly · Outward spread vs seam travel 0–1 step 0.01 |
assemblyFrontNoise | number | 0.35 | Assembly · Growth edge irregularity 0–1 step 0.01 |
assemblySpeedVariation | number | 0.65 | Assembly · Return speed variation 0–1 step 0.01 |
assemblyBend | number | 1.2 | Assembly · Approach path bend 0–3 step 0.05 |
assemblySwirl | number | 1.1 | Assembly · Approach twist 0–3 step 0.05 |
assemblyLandingVariation | number | 0.8 | Assembly · Landing transition variation 0–1 step 0.01 |
rendererProfile | enum | "studio" | Renderer experiment (reload required) (original |
textWidth | number | 6.5 | Type · Headline block width (the mark is 2.6 wide) 1.2–9 step 0.05 |
textLineHeight | number | 0.95 | Type · Line height 0.7–1.4 step 0.01 |
textDepth | number | 0.16 | Type · Extrusion depth (fraction of the font size) 0.05–0.8 step 0.01 |
textBevel | number | 0.04 | Type · Bevel (fraction of the font size) 0–0.12 step 0.005 |
textCorner | number | 0.008 | Type · Corner rounding (fraction of the font size) 0–0.06 step 0.002 |
textMeshDetail | number | 4 | Type · Text mesh detail (1-4; higher = smoother deformation) 1–4 step 1 |
Runtime contract
- One paused GSAP timeline registered as
window.__timelines["frost-sequence-rig"]. - Re-syncs on the
hf-seekCustomEvent; every frame is a closed-form function of time (seeded PRNG only, no rAF loops, no Date.now). - Renderer: WebGPU, GSAP, Matcap.
- External runtime dependencies: none (served locally).
Editing rules (from the source project)
- Keep
data-composition-variablesa single-quoted attribute with plain"JSON. Never save it through Studio's Design panel. - Do not put
<canvas>in static markup; create it at runtime. - Keep every visual state a function of t; seek-safety is what makes the block renderable.
Archivos 83 archivos
- assets/frost.jsScript
- assets/gsap-3.14.2.min.jsScript
- source/build.mjsScript
- source/src/assets.tsScript
- source/src/cache.tsScript
- source/src/core/AdaptiveResolution.tsScript
- source/src/core/clock.tsScript
- source/src/core/ease.tsScript
- source/src/core/interaction.tsScript
- source/src/core/motion.tsScript
- source/src/core/schedule.tsScript
- source/src/core/seed.tsScript
Instálala a mano
Deska ejecuta esto por ti, para cada agente que elijas. Para ejecutarlo tú en una terminal:
npx skills add heygen-com/hyperframes --skill frost-sequence-camera-orbitMás de heygen-com
- hyperframes-cliheygen-comUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes, single or batch render, publish, cloud, cloudrun, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, timeline, history, clean, docs, benchmark, telemetry, transcribe, auth, tts, and remove-background. Also use when diagnosing build or render failures. validate, inspect, and layout are deprecated aliases; use check. Covers local, HeyGen-hosted cloud, AWS Lambda, and Google Cloud Run rendering.831.6 k instalaciones en skills.sh1
- hyperframesheygen-comMandatory entry point: read this first for any request to make, create, edit, animate, or render a video, animation, or motion graphic, including a promo, explainer, captioned clip, title card, overlay, slideshow or interactive deck, Remotion port, or any HyperFrames HTML composition. Also use it to inspect, diagnose, validate, preview, publish, or batch-render an existing HyperFrames project. Inputs may be a website URL, GitHub PR, Figma design or URL, text or brief, existing footage, or music. It resumes project state, captures intent when applicable, selects and installs the owning workflow, and routes domain capabilities. HyperFrames is the default output framework unless the user explicitly chooses another framework for the deliverable or asks only to record a browser session.798.7 k instalaciones en skills.sh1
- hyperframes-registryheygen-comSearch, install, and wire registry blocks and components into HyperFrames compositions. Use BEFORE hand-building any named visual — whenever a brief, a user, or a storyboard names a look, effect, treatment, or transition such as CRT scanlines, glitch, chromatic aberration, film grain, a shimmer sweep, a chart, a code or terminal window, a map, or a confetti burst — because roughly 400 hosted items already cover many of them and the search ranks all of them with nothing installed, no project, and no account. Also use when running hyperframes add or hyperframes catalog, installing one item or every block matching a tag, wiring an installed item into index.html, or working with hyperframes.json. Covers discovery, install locations, block sub-composition wiring, component snippet merging, and authoring a new block or component to contribute upstream (idea → scaffold → validate → PR).719.6 k instalaciones en skills.sh1
- media-useheygen-comAgent Media OS, the single skill for every media need in a HyperFrames project. Resolve BGM, SFX, image, icon, brand logo, voice, color grade, or LUT into a frozen local file or paste-ready block + ledger record (one verb, `resolve`); generate via TTS / music / image models when the catalog misses; produce voiceover, transcription, captions, and background removal through one shared audio engine; operate on media (cut / reframe / transform); and reuse assets across projects. Also use for vague feedback that real footage looks dark, flat, boring, should feel retro/camcorder/print/ASCII, needs privacy, or needs a media reveal.705.6 k instalaciones en skills.sh1
- hyperframes-animationheygen-comAll animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.686.4 k instalaciones en skills.sh0