Skip to content

Commit 92bec1b

Browse files
committed
fix: macOS Tahoe camera focuses on MacBook, zoom-out animation
1 parent 5f02161 commit 92bec1b

1 file changed

Lines changed: 14 additions & 36 deletions

File tree

registry/blocks/macos-tahoe-liquid-glass/macos-tahoe-liquid-glass.html

Lines changed: 14 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -725,42 +725,20 @@
725725

726726
tl.to(S, { p: 1, drift: 15, duration: 15, ease: "none", onUpdate: render }, 0);
727727

728-
// ── Act 1 (0–3.5s): iPhone FRONT — hero close-up showing hyperframes.dev
729-
tl.to(S, { phRY: PI + 0.06, phRX: 0.015, duration: 1.5, ease: breatheEase }, 0.3);
730-
tl.to(S, { phRY: PI - 0.04, phRX: -0.01, duration: 1.5, ease: breatheEase }, 1.8);
731-
732-
// ── Act 2 (3.5–7s): iPhone spins 180° to show BACK (camera, titanium, Apple logo)
733-
tl.to(S, { phRY: PI * 2, duration: 2.2, ease: spinEase }, 3.5);
734-
tl.to(S, { cZ: 4.8, cY: 0.25, duration: 2, ease: driftEase }, 3.5);
735-
// Hold back view — slight orbit to appreciate hardware
736-
tl.to(
737-
S,
738-
{ phRY: PI * 2 + 0.15, phRX: 0.04, cX: 0.15, duration: 1.5, ease: breatheEase },
739-
5.5,
740-
);
741-
742-
// ── Act 3 (7–9s): iPhone spins back to front, then exits LEFT off screen
743-
tl.to(S, { phRY: PI * 3, duration: 1.8, ease: snapEase }, 7);
744-
tl.to(S, { cZ: 3.5, cY: 0.2, duration: 1.5, ease: driftEase }, 7);
745-
tl.to(S, { phX: -6, phZ: 0.3, duration: 2, ease: spinEase }, 8);
746-
747-
// ── Act 4 (9–11s): MacBook enters from right, hero close-up
748-
tl.to(S, { lpX: 0, duration: 2, ease: enterEase }, 9);
749-
tl.to(S, { cX: 0, clX: 0, cZ: 5, cY: 0.3, clY: -0.1, duration: 2, ease: driftEase }, 9);
750-
tl.to(S, { lpRY: 0.06, duration: 1.5, ease: breatheEase }, 10);
751-
752-
// ── Act 5 (11–12.5s): iPhone returns, both settle for turntable
753-
tl.to(S, { phX: -2.0, duration: 1.5, ease: enterEase }, 11);
754-
tl.to(S, { lpX: 2.2, duration: 1.5, ease: breatheEase }, 11);
755-
tl.to(
756-
S,
757-
{ cX: 0.1, clX: 0.1, cZ: 7.5, cY: 0.5, clY: -0.1, duration: 1.5, ease: driftEase },
758-
11,
759-
);
760-
tl.to(S, { phRY: PI * 3, lpRY: 0, duration: 1, ease: breatheEase }, 11);
761-
762-
// ── Act 6 (12.5–15s): 360° turntable — both devices rotate together
763-
tl.to(S, { turn: PI * 2, duration: 2.5, ease: spinEase }, 12.5);
728+
// ── macOS Tahoe: MacBook hero — zoomed close, slow pull-back ──
729+
// Move iPhone off screen immediately
730+
tl.set(S, { phX: 10 }, 0);
731+
// Start MacBook centered and close
732+
tl.set(S, { lpX: 0, lpRY: 0 }, 0);
733+
tl.set(S, { cX: 0, clX: 0, cZ: 4.5, cY: 0.4, clY: -0.1 }, 0);
734+
735+
// Slow zoom out
736+
tl.to(S, { cZ: 7, cY: 0.6, duration: 12, ease: driftEase }, 0.5);
737+
738+
// Gentle breathing tilt
739+
tl.to(S, { lpRY: 0.04, duration: 4, ease: breatheEase }, 1);
740+
tl.to(S, { lpRY: -0.03, duration: 4, ease: breatheEase }, 5);
741+
tl.to(S, { lpRY: 0.02, duration: 4, ease: breatheEase }, 9);
764742

765743
// ── Live HTML Animations (captured to 3D textures every frame) ──
766744
// Title fade in

0 commit comments

Comments
 (0)