fix: hero moves as one coherent camera shot, not a pasted-on spinning centre

The previous render rotated only small circular patches at the centre over a
frozen plate, so only the middle appeared to move and it read as composited
onto a static background. Replaced it with a coherent floating-camera move:
one closed sine/cosine cycle drives a whole-frame zoom-breathe + orbit + sway,
so the entire mechanism and its cast shadow move together as a single live
beauty shot. Seamless by construction (start==end), re-mastered at 2560x1440.

A single 2-D plate still can't reveal new faces of the object — a true
turntable needs a 3-D model or an image-to-video generation (documented in
README). Motion tests inverted accordingly: the housing must now move WITH the
frame (proving coherence) and the centre must not dwarf it (proving it isn't
composited).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: mustbesimo2

examples/kern-calibration/README.md

@@ -10,7 +10,7 @@ An original cinematic example website for the `cinematic-scroll` skill.
 - Scroll-scrubbed CSS radial-gradient masking: five soft colour blooms open cumulatively over each mechanical system as the scan plane crosses it, then a full-frame wash floods the whole unit in colour.
 - Frame-by-frame drift correction using `requestVideoFrameCallback` and circular phase-aware playback-rate convergence—no repeated seeking at the loop boundary.
 - A genuinely full-viewport video stage using `object-fit: cover`; no framed media panel or transformed 3D ancestor.
-- Generated precision-mechanical hero imagery converted into a seamless 11.667-second, 30 fps, 1080p locked-camera loop. The outer housing stays pixel-stable while the inner carrier, escapement and counter-rotating pinions move at exact integer loop ratios; the coil and emitter pulse without moving the camera.
+- Generated precision-mechanical hero imagery converted into a seamless 11.667-second, 30 fps, 1440p loop with a coherent floating-camera move: the whole frame — mechanism and cast shadow together — drifts, breathes and sways as one integrated beauty shot, so no region ever reads as a pasted-on moving patch. (A single 2-D plate cannot reveal new faces of the object; a true turntable would need a 3-D model or an image-to-video generation.)
 - Velocity-reactive playback: scrolling accelerates the loop up to ~1.9×, easing back to 1× at rest; the loops pause off-screen and resume in sync.
 - Muted inline autoplay plus pointer, touch, wheel, scroll, visibility and page-show recovery hooks.
 - Five selectable mechanical systems with live, phase-locked macro video crops and matching readings.
@@ -22,12 +22,12 @@ An original cinematic example website for the `cinematic-scroll` skill.
 
 | Asset | Role | Specification |
 |---|---|---|
-| `kern-mono.mp4` | Persistent base layer | 1920×1080, 30 fps, 11.667 s, H.264, locked-camera mechanical loop |
-| `kern-color.mp4` | Scroll-masked colour layer | 1920×1080, 30 fps, 11.667 s, H.264, locked-camera mechanical loop |
+| `kern-mono.mp4` | Persistent base layer | 2560×1440, 30 fps, 11.667 s, H.264, coherent floating-camera loop |
+| `kern-color.mp4` | Scroll-masked colour layer | 2560×1440, 30 fps, 11.667 s, H.264, coherent floating-camera loop |
 | `kern-calibration-unit.png` | Poster and macro source | Generated precision-mechanical plate |
-| `render-mechanism.py` | Deterministic renderer | Rotates isolated internal subassemblies and derives both frame-matched encodes |
+| `render-mechanism.py` | Deterministic renderer | Applies one closed sine/cosine camera cycle to the whole plate and derives both frame-matched encodes |
 
-The colour loop is rendered once; the monochrome layer is a desaturated encode of that exact stream. Framing, duration, frame count and mechanism motion therefore match by construction.
+The colour loop is rendered once; the monochrome layer is a desaturated encode of that exact stream. Framing, duration, frame count and camera motion therefore match by construction.
 
 ## Originality boundary
 

examples/kern-calibration/assets/kern-color.mp4

@@ -1,84 +1,72 @@
 #!/usr/bin/env python3
-"""Render the KERN hero as a locked-camera mechanical loop.
+"""Render the KERN hero as a coherent, seamless-loop camera move.
 
-The outer housing and background remain pixel-stable. Only circular internal
-subassemblies rotate/oscillate; the monochrome master is derived from the exact
-colour encode so both website layers remain frame-matched.
+The whole frame moves as ONE integrated shot — the entire mechanism and its cast
+shadow drift, breathe and sway together under a gently floating camera. There are
+no isolated composited "moving centre" patches over a frozen plate, so the motion
+never reads as pasted on: every pixel belongs to the same live beauty shot.
+
+The camera path is built from a single sine/cosine cycle, so the last frame's
+position and velocity exactly match the first — the loop is seamless with no
+crossfade. The monochrome master is a desaturated grade of the exact colour
+encode, so both website layers stay frame-matched by construction.
+
+Note: a single 2-D still cannot reveal new faces of the object. A true turntable
+(the mechanism itself rotating) needs either a 3-D model or an image-to-video
+generation — see README. This renderer delivers the honest best from one plate.
 """
 from pathlib import Path
 from subprocess import Popen, run, PIPE
-from math import sin, tau
-from PIL import Image, ImageDraw, ImageFilter, ImageEnhance
+from math import sin, cos, tau, radians
+from PIL import Image, ImageEnhance, ImageFilter
 
 HERE = Path(__file__).resolve().parent
 SOURCE = HERE / "kern-calibration-unit.png"
 COLOR = HERE / "kern-color.mp4"
 MONO = HERE / "kern-mono.mp4"
-WIDTH, HEIGHT, FPS, FRAMES = 1920, 1080, 30, 350
+OW, OH, FPS, FRAMES = 2560, 1440, 30, 350
 DURATION = FRAMES / FPS
 
-base = Image.open(SOURCE).convert("RGB").resize((WIDTH, HEIGHT), Image.Resampling.LANCZOS)
-base = ImageEnhance.Contrast(base).enhance(1.035)
-base = ImageEnhance.Color(base).enhance(1.06)
+# Prepare the plate once: grade + sharpen so every resampled frame is crisp and consistent.
+src = Image.open(SOURCE).convert("RGB")
+src = ImageEnhance.Contrast(src).enhance(1.035)
+src = ImageEnhance.Color(src).enhance(1.05)
+src = src.filter(ImageFilter.UnsharpMask(radius=2.2, percent=90, threshold=2))
+SW, SH = src.size
+base_fit = max(OW / SW, OH / SH)          # cover the output frame from the plate
+OCX, OCY = OW / 2.0, OH / 2.0
+SCX, SCY = SW / 2.0, SH / 2.0
 
-# center-x, center-y and radius are normalized to the output frame.
-parts = [
-    # Tourbillon-like inner carrier: one calm revolution per seamless loop.
-    {"name": "carrier", "x": .505, "y": .515, "r": .112, "cycles": 1.0, "phase": 0},
-    # Visible pinions counter-rotate at integer loop ratios.
-    {"name": "upper-pinion", "x": .548, "y": .455, "r": .034, "cycles": -7.0, "phase": 8},
-    {"name": "lower-pinion", "x": .458, "y": .555, "r": .031, "cycles": 10.0, "phase": -5},
-    # Central gold escapement receives continuous rotation plus a tick oscillation.
-    {"name": "escapement", "x": .505, "y": .515, "r": .052, "cycles": 4.0, "phase": 0, "tick": 14},
-]
-
-prepared = []
-for part in parts:
-    cx, cy = int(part["x"] * WIDTH), int(part["y"] * HEIGHT)
-    radius = int(part["r"] * HEIGHT)
-    pad = int(radius * 1.18)
-    box = (cx - pad, cy - pad, cx + pad, cy + pad)
-    patch = base.crop(box)
-    mask = Image.new("L", patch.size, 0)
-    d = ImageDraw.Draw(mask)
-    feather = max(5, int(radius * .10))
-    d.ellipse((pad-radius+feather, pad-radius+feather, pad+radius-feather, pad+radius-feather), fill=255)
-    mask = mask.filter(ImageFilter.GaussianBlur(feather))
-    prepared.append((part, box, patch, mask))
+# Floating-camera path — one closed sine cycle → seamless loop (start == end, matching velocity).
+ZOOM0, ZOOM_A = 1.09, 0.020               # breathe 1.07 <-> 1.11 (headroom hides translate/rotate)
+DX_A = 0.008 * OW                         # gentle horizontal orbit
+DY_A = 0.006 * OH                         # gentle vertical bob
+ROT_A = 1.2                               # degrees of sway
 
 cmd = [
     "ffmpeg", "-loglevel", "error", "-y", "-f", "rawvideo", "-pix_fmt", "rgb24",
-    "-s", f"{WIDTH}x{HEIGHT}", "-r", str(FPS), "-i", "-", "-an", "-c:v", "libx264",
-    "-preset", "slow", "-crf", "18", "-pix_fmt", "yuv420p", "-movflags", "+faststart", str(COLOR),
+    "-s", f"{OW}x{OH}", "-r", str(FPS), "-i", "-", "-an",
+    "-vf", "gradfun=1.0:16,format=yuv420p",
+    "-c:v", "libx264", "-preset", "slow", "-crf", "19", "-movflags", "+faststart", str(COLOR),
 ]
 encoder = Popen(cmd, stdin=PIPE)
 assert encoder.stdin is not None
 stream = encoder.stdin
 
-for frame_index in range(FRAMES):
-    progress = frame_index / FRAMES
-    frame = base.copy()
-    for part, box, patch, mask in prepared:
-        angle = part["phase"] + 360 * part["cycles"] * progress
-        if part.get("tick"):
-            angle += 8.5 * sin(tau * part["tick"] * progress)
-        rotated = patch.rotate(angle, resample=Image.Resampling.BICUBIC, expand=False)
-        rotated_mask = mask.rotate(angle, resample=Image.Resampling.BICUBIC, expand=False)
-        frame.paste(rotated, box[:2], rotated_mask)
-
-    # Energy is dynamic, not camera movement: coil and emitter breathe in place.
-    glow = Image.new("RGBA", (WIDTH, HEIGHT), (0, 0, 0, 0))
-    gd = ImageDraw.Draw(glow)
-    coil_pulse = .5 + .5 * sin(tau * 6 * progress)
-    emit_pulse = .5 + .5 * sin(tau * 8 * progress + 1.2)
-    for x, y, radius, color, strength in [
-        (.36, .35, .052, (224, 148, 66), coil_pulse),
-        (.69, .57, .046, (0, 230, 210), emit_pulse),
-    ]:
-        cx, cy, rr = int(x*WIDTH), int(y*HEIGHT), int(radius*HEIGHT)
-        gd.ellipse((cx-rr, cy-rr, cx+rr, cy+rr), fill=(*color, int(16 + strength*24)))
-    glow = glow.filter(ImageFilter.GaussianBlur(26))
-    frame = Image.alpha_composite(frame.convert("RGBA"), glow).convert("RGB")
+for i in range(FRAMES):
+    a = tau * i / FRAMES
+    theta = radians(ROT_A * sin(a))
+    zoom = ZOOM0 + ZOOM_A * (-cos(a))     # min at loop start, max at half, back — smooth
+    dx = DX_A * cos(a)
+    dy = DY_A * sin(a)
+    k = base_fit * zoom                    # total plate->frame scale
+    ct, st = cos(theta) / k, sin(theta) / k
+    # Inverse affine: output pixel (x,y) samples the plate at (a*x+b*y+c, d*x+e*y+f).
+    ax, bx = ct, st
+    dxc, ex = -st, ct
+    c = SCX - (ax * (OCX + dx) + bx * (OCY + dy))
+    f = SCY - (dxc * (OCX + dx) + ex * (OCY + dy))
+    frame = src.transform((OW, OH), Image.AFFINE, (ax, bx, c, dxc, ex, f), resample=Image.BICUBIC)
     stream.write(frame.tobytes())
 
 stream.close()
@@ -87,10 +75,10 @@
 
 result = run([
     "ffmpeg", "-loglevel", "error", "-y", "-i", str(COLOR),
-    "-vf", "hue=s=0,eq=contrast=1.12:brightness=-0.015,format=yuv420p",
-    "-c:v", "libx264", "-preset", "slow", "-crf", "18", "-movflags", "+faststart", "-an", str(MONO),
+    "-vf", "hue=s=0,eq=contrast=1.06:brightness=-0.012,format=yuv420p",
+    "-c:v", "libx264", "-preset", "slow", "-crf", "19", "-movflags", "+faststart", "-an", str(MONO),
 ])
 if result.returncode:
     raise SystemExit("monochrome encode failed")
 
-print(f"rendered {FRAMES} frames / {DURATION:.3f}s -> {COLOR.name}, {MONO.name}")
+print(f"rendered {FRAMES} frames / {DURATION:.3f}s coherent camera move -> {COLOR.name}, {MONO.name}")

examples/kern-calibration/assets/kern-mono.mp4

@@ -1,31 +1,49 @@
 #!/usr/bin/env python3
+"""Assert the hero moves as ONE coherent shot, not an isolated moving centre.
+
+The failure this guards against: a frozen plate with only a small central region
+composited-and-rotated on top, which reads as pasted on. So we require the outer
+housing/background annulus to move perceptibly too (the whole frame drifts under
+the camera), and we require the loop to close seamlessly.
+"""
 from pathlib import Path
 from subprocess import run
 from tempfile import TemporaryDirectory
 from PIL import Image, ImageChops, ImageStat, ImageDraw
 
 VIDEO = Path(__file__).parent / "assets" / "kern-color.mp4"
 
+
+def grab(video, n, tmp):
+    target = Path(tmp) / f"frame-{n}.png"
+    result = run(["ffmpeg", "-loglevel", "error", "-y", "-i", str(video),
+                  "-vf", f"select='eq(n,{n})',scale=480:270", "-vsync", "0", "-frames:v", "1", str(target)])
+    assert result.returncode == 0, "ffmpeg could not decode the hero video"
+    return Image.open(target).convert("RGB")
+
+
 with TemporaryDirectory() as tmp:
-    frames = []
-    for index, second in enumerate((0, 1)):
-        target = Path(tmp) / f"frame-{index}.png"
-        result = run(["ffmpeg", "-loglevel", "error", "-y", "-ss", str(second), "-i", str(VIDEO), "-frames:v", "1", "-vf", "scale=480:270", str(target)])
-        assert result.returncode == 0, "ffmpeg could not decode the hero video"
-        frames.append(Image.open(target).convert("RGB"))
-
-    diff = ImageChops.difference(*frames)
+    f0, f30, f_last = grab(VIDEO, 0, tmp), grab(VIDEO, 30, tmp), grab(VIDEO, 349, tmp)
+
+    diff = ImageChops.difference(f0, f30)
     w, h = diff.size
-    housing = Image.new("L", diff.size, 0)
-    draw = ImageDraw.Draw(housing)
     cx, cy = w * 0.5, h * 0.51
-    draw.ellipse((cx-h*.43, cy-h*.43, cx+h*.43, cy+h*.43), fill=255)
-    draw.ellipse((cx-h*.20, cy-h*.20, cx+h*.20, cy+h*.20), fill=0)
-    mechanism = Image.new("L", diff.size, 0)
-    ImageDraw.Draw(mechanism).ellipse((cx-h*.18, cy-h*.18, cx+h*.18, cy+h*.18), fill=255)
-
-    housing_delta = sum(ImageStat.Stat(diff, housing).mean) / 3
-    mechanism_delta = sum(ImageStat.Stat(diff, mechanism).mean) / 3
-    assert housing_delta < 2.0, f"camera/housing is shaking: static annulus delta {housing_delta:.2f}"
-    assert mechanism_delta > 3.0, f"mechanism is not visibly moving: center delta {mechanism_delta:.2f}"
-    print(f"PASS stable housing {housing_delta:.2f}; dynamic mechanism {mechanism_delta:.2f}")
+    outer = Image.new("L", diff.size, 0)
+    draw = ImageDraw.Draw(outer)
+    draw.ellipse((cx - h * .47, cy - h * .47, cx + h * .47, cy + h * .47), fill=255)
+    draw.ellipse((cx - h * .30, cy - h * .30, cx + h * .30, cy + h * .30), fill=0)
+    center = Image.new("L", diff.size, 0)
+    ImageDraw.Draw(center).ellipse((cx - h * .16, cy - h * .16, cx + h * .16, cy + h * .16), fill=255)
+
+    outer_delta = sum(ImageStat.Stat(diff, outer).mean) / 3
+    center_delta = sum(ImageStat.Stat(diff, center).mean) / 3
+    seam_delta = sum(ImageStat.Stat(ImageChops.difference(f0, f_last)).mean) / 3
+
+    # The whole frame must move — the housing is NOT allowed to sit frozen while only the centre moves.
+    assert outer_delta > 3.0, f"only the centre moves — housing/background is static (outer delta {outer_delta:.2f})"
+    assert center_delta > 3.0, f"mechanism is not visibly moving: centre delta {center_delta:.2f}"
+    # A pasted-on spinning centre shows up as centre motion wildly exceeding the coherent frame drift.
+    assert center_delta < outer_delta * 6.0, f"centre motion ({center_delta:.2f}) dwarfs the frame ({outer_delta:.2f}) — looks composited"
+    # One sine cycle → the last frame should land back on the first.
+    assert seam_delta < 3.0, f"loop is not seamless: first/last frame delta {seam_delta:.2f}"
+    print(f"PASS coherent camera move — outer {outer_delta:.2f}, centre {center_delta:.2f}, seam {seam_delta:.2f}")

examples/kern-calibration/assets/kern-poster.jpg

@@ -19,5 +19,5 @@
 
     difference = ImageChops.difference(*frames)
     mean_delta = sum(ImageStat.Stat(difference).mean) / 3
-    assert mean_delta >= 0.8, f"mechanical loop has no perceptible frame change: mean delta {mean_delta:.2f} < 0.8"
-    print(f"PASS perceptible localized video motion: mean frame delta {mean_delta:.2f}")
+    assert mean_delta >= 2.0, f"camera move has no perceptible frame change: mean delta {mean_delta:.2f} < 2.0"
+    print(f"PASS perceptible coherent camera motion: mean frame delta {mean_delta:.2f}")