Back to Details

frost-sequence-camera-orbit

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

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.
一个完整的 22.5 秒冰面序列：标志、第一个文字、第二个文字、碎裂和淡出。摄像机环绕固定物体，并在正面进行较慢的通过以方便阅读。同一个粒子场承载每个过渡。可自定义两个文字时刻和 SVG 标志；源文件包含可编辑的摄像机和组合时间。
组合 ID：
frost-sequence-rig
。时长 22.5 秒，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)
  • 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
    (从 CDN 安装时获取)
  • assets/test-mark.svg
    (1 KB)
  • assets/textures/bluenoise64.png
    (12 KB)
  • assets/textures/ice-inclusions-generated.png
    (从 CDN 安装时获取)

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
:
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:
sh
npx --yes hyperframes@0.8.12 render 'compositions/frost-sequence-camera-orbit/frost-sequence-camera-orbit.html' --variables '{"headline1":"Hard to|break.","headline2":"Easy to|remember."}'
使用 
npx hyperframes add frost-sequence-camera-orbit
安装；默认情况下上述文件位于 
compositions/frost-sequence-camera-orbit/
下。然后从宿主 
index.html
挂载该区块：
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>
通过直接指定组合文件，使用自定义值渲染：
sh
npx --yes hyperframes@0.8.12 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."
| First text ( | = line break) max 60 chars | | 
headline2
| string | 
"Easy to           | remember."
| Second text ( | = line break) max 60 chars | | 
logoUrl
| string | 
"assets/logo.svg"
| Logo SVG asset path (upload in Assets, then paste path) max 200 chars | | 
assemblyMode
| enum | 
"hybrid"
| Assembly response (physical | directed | hybrid) | | 
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 | 600 | 700) | | 
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 | aces | neutral | linear) | | 
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 | lite) | | 
upscaler
| enum | 
"fsr1"
| Performance · Upscaler (fsr1 | taau | bilinear | native) | | 
renderScale
| number | 
1
| Performance · Scene resolution scale (upscaled to 1080p) 0.35–1 step 0.05 | | 
shapeResolution
| enum | 
"256"
| Shape voxel resolution (128 | 256 | 384) | | 
erosionResolution
| enum | 
"96"
| Performance · Erosion field resolution (voxels per axis) (64 | 96 | 128 | 192) | | 
particleCount
| enum | 
"100k"
| Performance · Powder particles (100k | 250k | 500k | 1M) | | 
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 | 1 | 0) | | 
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 | lookup | mesh | studio | matcap) | | 
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 |
在运行时通过 
window.__hyperframes.getVariables()
读取；在组合根元素上声明为 
data-composition-variables
（单引号属性，纯 JSON）。
id类型默认值标签 / 范围
headline1
string
"Hard to | break."
第一个文本（| 表示换行）最多 60 个字符
headline2
string
"Easy to | remember."
第二个文本（| 表示换行）最多 60 个字符
logoUrl
string
"assets/logo.svg"
标志 SVG 资源路径（在 Assets 中上传，然后粘贴路径）最多 200 个字符
assemblyMode
enum
"hybrid"
组合响应（物理 | 引导 | 混合）
materialBaseColor
color
"#ffffff"
基础颜色
baseRoughness
number
0.31
基础粗糙度 0–0.5 步长 0.005
materialTransmission
boolean
true
透射
materialBacklight
number
0.27
冰内背光 0–2 步长 0.01
ior
number
1.675
折射率 1–2 步长 0.005
thicknessScale
number
2.04
厚度比例 0.1–3 步长 0.01
materialAbsorption
boolean
true
吸收 / 色调
attenuationColor
color
"#d5f4ff"
衰减颜色（白色 = 无吸收，透明玻璃）
attenuationDistance
number
6.54
衰减距离 0.05–12 步长 0.01
materialDispersion
boolean
false
色散
dispersion
number
0.12
色散（0 = 关闭；开/关需要重载）0–0.3 步长 0.005
materialReflections
boolean
true
反射
envIntensity
number
2.04
环境强度 0–3 步长 0.01
specularIntensity
number
1.44
高光强度 0–2 步长 0.01
materialFrost
boolean
true
霜冻
materialInteriorFrost
number
0
均匀霜冻 0–1 步长 0.01
frostScale
number
0.7
缩放 0.2–6 步长 0.05
frostThreshold
number
0.62
阈值（1 = 无霜冻，透明玻璃）0–1 步长 0.01
frostSoftness
number
0.24
柔和度 0.01–1 步长 0.01
frostRoughness
number
0.73
粗糙度 0–1 步长 0.01
frostDiffuse
number
0.11
漫反射（霜冻区域捕捉光线的程度）0–1 步长 0.01
materialSurfaceBumps
boolean
false
物体表面凹凸 / 裂纹缺口
materialCrystals
boolean
true
晶体凹凸
crystalBump
number
0.01
晶体凹凸强度 0–1 步长 0.01
crystalScale
number
4
晶体缩放 4–80 步长 1
materialGrain
boolean
true
颗粒凹凸
materialGrainAmount
number
0.47
颗粒强度 0–2 步长 0.01
materialGrainScale
number
150
颗粒缩放 1–150 步长 1
materialCutNormals
boolean
true
断裂法线
materialMicro
boolean
true
微观凹凸
microBump
number
0.445
微观凹凸强度 0–1 步长 0.005
microScale
number
10
微观缩放 10–200 步长 1
microCoverage
number
0.25
微观覆盖 0–1 步长 0.01
bumpMaskScale
number
1.45
遮罩缩放 0.1–6 步长 0.05
materialRipples
boolean
true
波纹
rippleBump
number
0.22
波纹凹凸 0–1 步长 0.01
rippleScale
number
23
波纹缩放 2–30 步长 0.5
materialSmudges
boolean
true
污渍
smudgeAmount
number
0.78
数量 0–1 步长 0.01
smudgeCoverage
number
0.58
覆盖 0–1 步长 0.01
smudgeMaskScale
number
1.85
遮罩缩放 0.1–6 步长 0.05
smudgeAnisotropy
number
16.5
各向异性 1–20 步长 0.5
smudgeRoughness
number
0.75
粗糙度 0–1 步长 0.01
smudgeWhiteness
number
0.035
白度 0–0.5 步长 0.005
smudgeScale
number
1.3
缩放 0.5–10 步长 0.1
materialCracks
boolean
true
裂纹
crackLargeScale
number
2.45
大尺度 0.3–8 步长 0.05
crackWarp
number
0.22
扭曲 0–1.5 步长 0.01
crackCoverage
number
0.19
覆盖 0–1 步长 0.01
crackRegionScale
number
1.8
区域缩放 0.1–4 步长 0.05
crackRegionCoverage
number
0.6
区域覆盖 0–1 步长 0.01
veinScale
number
8
静脉纹理缩放 1–20 步长 0.25
veinContrast
number
0.55
静脉纹理对比度 0–1 步长 0.01
crackWidth
number
0.0025
宽度 0.0005–0.02 步长 0.0005
crackBrightness
number
0.65
亮度 0–3 步长 0.01
crackDarkness
number
0.69
暗度 0–1 步长 0.01
crackRefraction
number
0.076
折射 0–0.1 步长 0.001
crackSurfaceStrength
number
0.16
表面强度 0–1 步长 0.01
fineScale
number
18.4
精细缩放 2–20 步长 0.1
fineAmount
number
0.52
精细数量 0–1 步长 0.01
fineCoverage
number
1
精细覆盖 0–1 步长 0.01
materialScatter
boolean
true
内部散射
materialInclusionScale
number
0.05
内含物缩放 0.05–3 步长 0.01
materialInclusionAmount
number
2
摄影内含物 0–2 步长 0.01
interiorScatter
number
0.09
内部散射 0–1 步长 0.01
materialClearcoat
boolean
true
清漆
clearcoat
number
0
清漆 0–1 步长 0.01
clearcoatRoughness
number
0
清漆粗糙度 0–1 步长 0.005
materialShardNormals
boolean
true
碎片法线
spriteNormal
number
0.15
精灵法线强度 0–2.5 步长 0.05
materialShardFrost
boolean
true
碎片霜冻
materialShardTransmission
boolean
true
碎片透明度
spriteSeeThrough
number
1
透视（0 = 关闭；开/关需要重载）0–1 步长 0.01
materialShardReflections
boolean
true
碎片反射
minPixelSize
number
0.25
最小像素尺寸 0–4 步长 0.05
grainSizeMultiplier
number
1.05
颗粒尺寸倍率 0.2–4 步长 0.05
spriteSize
number
1.9
精灵尺寸 0.3–4 步长 0.05
spriteTilt
number
12
精灵倾斜 0–70 步长 1
spriteAlphaCut
number
0.6
Alpha 裁剪 0.05–0.6 步长 0.01
fontWeight
enum
"600"
类型 · 字重（Geist）（400 | 600 | 700）
letterSpacing
number
0.01
类型 · 字距 -0.1–0.4 步长 0.005
shardAmount
number
0.44
碎片 · 破碎体积可见比例（粉末量）0.02–1 步长 0.01
strayDust
number
24
碎片 · 物体周围的漂浮尘埃（实验值为 40）0–200 步长 1
sliceRadius
number
0.6
破碎 · 第一（对角）切片半径 0.05–1.5 步长 0.01
sliceStrength
number
21.5
破碎 · 第一切片强度 1–40 步长 0.5
finalEjectBoost
number
2.5
破碎 · 最后一次破碎：喷射速度与速度上限倍率 1–6 步长 0.1
shatterRadius
number
0.45
破碎 · 后续切片半径（也设置它们的间距）0.1–1.5 步长 0.01
shatterStrength
number
32.5
破碎 · 后续切片强度 1–40 步长 0.5
cutThreshold
number
0.3
调整破碎 · 切割阈值（超过此侵蚀量表面消失）0.3–0.98 步长 0.01
cutSoftness
number
0.19
调整破碎 · 切割柔和度 0.005–0.3 步长 0.005
edgeWidth
number
0.19
调整破碎 · 易碎边缘带宽 0.05–0.8 步长 0.01
edgeInset
number
0
调整破碎 · 边缘内缩 0–0.3 步长 0.005
brushSoftness
number
0.15
调整破碎 · 笔刷柔和度（切片的边缘衰减）0.02–1 步长 0.01
brushNoise
number
0.4
调整破碎 · 笔刷噪点（参差边界）0–1 步长 0.01
crumbleRate
number
4.3
调整破碎 · 沿裂纹的崩解速率（高 = 整个形状立即崩解）0–6 步长 0.05
crumbleCrackBias
number
5.1
调整破碎 · 崩解裂纹偏差 0–6 步长 0.05
crumbleDuration
number
0.35
调整破碎 · 一次切割后的崩解持续时间 0–2 步长 0.01
ejectSpeed
number
0.91
飞行 · 喷射速度 0–4 步长 0.01
ejectSpread
number
0.48
飞行 · 沿法线的喷射扩散 0–3 步长 0.01
ejectTurbulence
number
4
飞行 · 喷射湍流 0–4 步长 0.01
drag
number
0
飞行 · 阻力（速度每秒衰减该值）0–8 步长 0.01
gravity
number
0
飞行 · 重力（0 = 碎片永不掉落）0–2 步长 0.005
turbulence
number
4
飞行 · 湍流强度（卷曲噪声）0–4 步长 0.01
turbulenceScale
number
2.65
飞行 · 湍流缩放 0.2–8 步长 0.05
turbulenceDecay
number
3.65
飞行 · 湍流随时间衰减（低 = 持续旋转）0.05–4 步长 0.01
clumpCohesion
number
0.9
飞行 · 团块凝聚力（碎片绕领导者运动；0 = 无）0–10 步长 0.05
followObject
number
30
飞行 · 碎片跟随物体运动时长（秒；30 = 整个飞行）0–30 步长 0.5
settleTime
number
2.2
飞行 · 稳定时间（此后速度被消除；12 = 永不）0.3–12 步长 0.05
settledDrift
number
1
飞行 · 稳定后的有机漂移（卷曲噪声）0–1 步长 0.005
maxSpeed
number
26.3
飞行 · 速度上限 1–40 步长 0.1
repelStrength
number
30
飞行 · 破碎时将碎片推出实体形状 0–30 步长 0.1
repelRange
number
0.97
飞行 · 表面外的推出范围 0.02–2 步长 0.01
repelRadial
number
17.5
飞行 · 从形状中心向外推开（清除空腔和孔洞）0–60 步长 0.5
repelRadialRange
number
3.3
飞行 · 径向推出范围（物体半径倍数）1–4 步长 0.05
tumble
number
1.05
飞行 · 翻滚速率 0–12 步长 0.05
returnGroupStagger
number
1.35
组合 · 区域延迟（秒）0–1.5 步长 0.05
returnGroupScale
number
2.55
组合 · 区域/噪点大小 0.1–3 步长 0.05
returnGroupSeed
number
60765
返回 · 分组时间种子 0–65535 步长 1
formSpread
number
0
返回 · 波扩散（最近的碎片先离开，秒）0–4 步长 0.05
waveReach
number
10
返回 · 波扩散的距离 0.2–10 步长 0.1
formJitter
number
2.8
返回 · 每个碎片的错开（最多此值的随机延迟）0–3 步长 0.05
formFill
number
3
返回 · 没有碎片返回的体素填充速率 0.05–3 步长 0.05
returnSpring
number
29.9
返回 · 弹簧刚度 0.5–40 步长 0.1
returnDamping
number
1.34
返回 · 弹簧阻尼 0.2–2 步长 0.01
returnRamp
number
0.45
返回 · 弹簧渐入（达到全力后拉前的秒数）0–3 步长 0.05
returnMaxSpeed
number
60
返回 · 返回途中的速度上限 1–60 步长 0.5
alignToSurface
number
1
返回 · 碎片转向并贴合表面（0 = 保持翻滚）0–1 步长 0.01
alignCurve
number
3.75
返回 · 返回飞行的对齐曲线（1 线性，更高 = 更晚）0.2–4 步长 0.05
healRate
number
3
返回 · 邻居恢复速率 0.02–3 步长 0.01
cellRestore
number
60
返回 · 体素恢复速率 0–60 步长 0.5
landedFade
number
1.65
返回 · 落地碎片淡出 0–2 步长 0.01
refrostTime
number
10.6
返回 · 重新结霜时间 0.2–12 步长 0.1
keyColor
color
"#f0f7ff"
灯光 · 主光颜色
keyIntensity
number
5.05
灯光 · 主光强度 0–12 步长 0.05
keyElevation
number
42
灯光 · 主光俯仰角 10–89 步长 0.5
keyAzimuth
number
-38
灯光 · 主光方位角 -90–90 步长 0.5
keySize
number
1.25
灯光 · 主光尺寸（柔光箱）0.2–3 步长 0.01
fill
number
0.18
灯光 · 补光强度（半球漫射，仅漫反射：在透明冰上几乎不可见）0–1.5 步长 0.005
fillColor
color
"#cadde9"
灯光 · 补光天空颜色
fillGroundColor
color
"#172635"
灯光 · 补光地面颜色
rim
number
2.5
灯光 · 轮廓光强度 0–5 步长 0.01
rimColor
color
"#d9f1ff"
灯光 · 轮廓光颜色
rimElevation
number
20
灯光 · 轮廓光俯仰角（0 = 正后方）0–89 步长 0.5
swayAmplitude
number
0
灯光 · 主光摇摆幅度 0–0.15 步长 0.001
swayPeriod
number
35
灯光 · 主光摇摆周期 2–40 步长 0.5
envSoftbox
number
1.1
灯光 · 环境柔光箱（玻璃上的主光源）0–3 步长 0.01
envRim
number
1.4
灯光 · 环境轮廓光带 0–3 步长 0.01
envFill
number
0.22
灯光 · 环境正面补光 0–1 步长 0.005
backdropTop
color
"#050505"
背景 · 顶部颜色
backdropMid
color
"#050505"
背景 · 中部颜色
backdropBottom
color
"#050505"
背景 · 底部颜色
backdropCenterX
number
0.73
背景 · 光晕中心 X 0–1 步长 0.005
backdropCenterY
number
0.22
背景 · 光晕中心 Y 0–2 步长 0.005
backdropRadius
number
0.8
背景 · 光晕半径 0.1–2 步长 0.005
backdropFalloff
number
0.85
背景 · 光晕衰减 0.5–6 步长 0.01
backdropNoise
number
0
背景 · 抖动噪点 0–3 步长 0.05
bloomThreshold
number
3
后期 · 泛光阈值 0–3 步长 0.01
bloomIntensity
number
0.04
后期 · 泛光强度 0–1.5 步长 0.005
bloomRadius
number
1
后期 · 泛光半径 0–1 步长 0.005
monochrome
number
0.04
后期 · 单色 0–1 步长 0.01
tonemap
enum
"aces"
后期 · 色调映射（agx | aces | neutral | linear）
exposure
number
1
后期 · 曝光 0.1–4 步长 0.01
contrast
number
1.03
后期 · 对比度 0.6–1.6 步长 0.005
blackLift
number
0
后期 · 黑色提升 0–0.1 步长 0.001
vignetteStrength
number
0.14
后期 · 暗角强度 0–1 步长 0.005
vignetteSoftness
number
1.2
后期 · 暗角柔和度 0.1–1.5 步长 0.005
vignetteRadius
number
1.2
后期 · 暗角半径 0.2–1.6 步长 0.005
grainStrength
number
0
后期 · 胶片颗粒 0–0.15 步长 0.001
quality
enum
"full"
性能 · 质量档位（full | lite）
upscaler
enum
"fsr1"
性能 · 超分辨率器（fsr1 | taau | bilinear | native）
renderScale
number
1
性能 · 场景分辨率缩放（放大到 1080p）0.35–1 步长 0.05
shapeResolution
enum
"256"
形状体素分辨率（128 | 256 | 384）
erosionResolution
enum
"96"
性能 · 侵蚀场分辨率（每轴体素数）（64 | 96 | 128 | 192）
particleCount
enum
"100k"
性能 · 粉末粒子数（100k | 250k | 500k | 1M）
logoMeshDetail
number
2
形状 · 标志网格细节（1-4；更高 = 表面更精细）1–4 步长 1
deformStrength
number
0
几何 · 冰变形强度（0 = 原始）0–0.08 步长 0.001
deformScale
number
0.41
几何 · 噪点特征大小（更大 = 更宽泛）0.001–0.5 步长 0.001
deformSeed
number
7
几何 · 变形种子 0–65535 步长 1
rimAzimuth
number
-146
灯光 · 轮廓光方位角 -180–180 步长 1
rimAngle
number
26
灯光 · 轮廓光束角 10–89 步长 1
rimSize
number
0.45
灯光 · 轮廓反射大小 0.1–3 步长 0.05
fillReflectionStrength
number
0.3
灯光 · 补光反射强度 0–2 步长 0.01
accentCoolIntensity
number
3.71
工作室冷色点缀 · 强度 0–4 步长 0.01
accentCoolReflection
number
2.31
工作室冷色点缀 · 反射 0–3 步长 0.01
accentCoolElevation
number
63
工作室冷色点缀 · 俯仰角 -85–85 步长 1
accentCoolAzimuth
number
22
工作室冷色点缀 · 方位角 -180–180 步长 1
accentCoolSize
number
2.65
工作室冷色点缀 · 大小 0.1–3 步长 0.05
accentCoolColor
color
"#ff5900"
工作室冷色点缀 · 颜色
accentWarmIntensity
number
2.99
工作室暖色点缀 · 强度 0–4 步长 0.01
accentWarmReflection
number
0.34
工作室暖色点缀 · 反射 0–3 步长 0.01
accentWarmElevation
number
30
工作室暖色点缀 · 俯仰角 -85–85 步长 1
accentWarmAzimuth
number
-30
工作室暖色点缀 · 方位角 -180–180 步长 1
accentWarmSize
number
1.2
工作室暖色点缀 · 大小 0.1–3 步长 0.05
accentWarmColor
color
"#75aaff"
工作室暖色点缀 · 颜色
returnNoiseAmount
enum
"2"
组合 · 区域模式（2 | 1 | 0）
assemblyFrontDuration
number
3.2
组合 · 生长持续时间（秒）0–6 步长 0.05
assemblyOriginX
number
-0.65
组合 · 生长起点 X -1–1 步长 0.01
assemblyOriginY
number
0.55
组合 · 生长起点 Y -1–1 步长 0.01
assemblyAngle
number
-35
组合 · 接缝方向（度）-180–180 步长 1
assemblySpread
number
0.65
组合 · 向外扩散与接缝移动的比率 0–1 步长 0.01
assemblyFrontNoise
number
0.35
组合 · 生长边缘不规则度 0–1 步长 0.01
assemblySpeedVariation
number
0.65
组合 · 返回速度变化 0–1 步长 0.01
assemblyBend
number
1.2
组合 · 接近路径弯曲 0–3 步长 0.05
assemblySwirl
number
1.1
组合 · 接近路径扭转 0–3 步长 0.05
assemblyLandingVariation
number
0.8
组合 · 落地过渡变化 0–1 步长 0.01
rendererProfile
enum
"studio"
渲染器实验（需要重载）（original | lookup | mesh | studio | matcap）
textWidth
number
6.5
类型 · 标题块宽度（标志宽度为 2.6）1.2–9 步长 0.05
textLineHeight
number
0.95
类型 · 行高 0.7–1.4 步长 0.01
textDepth
number
0.16
类型 · 挤出深度（字体大小的比例）0.05–0.8 步长 0.01
textBevel
number
0.04
类型 · 倒角（字体大小的比例）0–0.12 步长 0.005
textCorner
number
0.008
类型 · 圆角（字体大小的比例）0–0.06 步长 0.002
textMeshDetail
number
4
类型 · 文字网格细节（1-4；更高 = 变形更平滑）1–4 步长 1

Runtime contract

运行时约定

  • One paused GSAP timeline registered as 
    window.__timelines["frost-sequence-rig"]
    .
  • Re-syncs on the 
    hf-seek
    CustomEvent; 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).
  • 一个暂停的 GSAP 时间线注册为 
    window.__timelines["frost-sequence-rig"]
    。
  • 在 
    hf-seek
    CustomEvent 上重新同步；每一帧都是时间的闭式函数（仅种子 PRNG，无 rAF 循环，无 Date.now）。
  • 渲染器：WebGPU、GSAP、Matcap。
  • 外部运行时依赖：无（本地提供）。

Editing rules (from the source project)

编辑规则（来自源项目）

  1. Keep 
    data-composition-variables
    a single-quoted attribute with plain 
    "
    JSON. Never save it through Studio's Design panel.
  2. Do not put 
    <canvas>
    in static markup; create it at runtime.
  3. Keep every visual state a function of t; seek-safety is what makes the block renderable.
  1. 将 
    data-composition-variables
    保持为单引号属性，内容为纯 
    "
    JSON。切勿通过 Studio 的设计面板保存。
  2. 不要在静态标记中放置 
    <canvas>
    ；在运行时创建。
  3. 保持每个视觉状态都是 t 的函数；seek 安全是使该区块可渲染的原因。