Não uma explosão, um nascimento: ouro fundido escorre das trevas, se enrola em um anel, esfria e recebe seu diamante, tudo sob o polegar do visitante. Para marcas de joalheria e artesanato.
You are building a one-page, award-grade "scroll cinematic" website. Work autonomously end to end: generate assets with the Higgsfield connector, then build and run the site with your coding agent. No plans, no placeholders.
THE PRODUCT (fictional jewelry house): AURELIA, a solitaire ring in 24 karat gold. Tagline: "From fire." The site's hero moment is CREATION, not destruction: a ribbon of molten gold pours through darkness, coils itself into a spinning band, cools from white heat through ember orange to polished gold, and a diamond descends into its setting with a single flare. The visitor scrolls the ring into existence.
THE TECHNIQUE (follow exactly): The 3D scroll effect is NOT Three.js. It is a canvas image-sequence scrub: video clips split into frames, scroll position drives which frame paints onto a full-viewport canvas.
ASSETS (Higgsfield connector): 1. ONE 16:9 anchor image: "A luminous ribbon of molten gold suspended mid- pour in a pure black void, white hot core fading to deep ember orange at the edges, tiny sparks drifting, macro jewelry photography, photorealistic, dramatic, no text, no watermark." Best image model in the catalog. 2. With the anchor as image reference on every clip, three 10-second 1080p 16:9 image-to-video clips: CLIP A "the pour": molten gold pours slowly through the black void, coiling and folding, sparks rising, hypnotic and continuous. CLIP B "the forming": the molten stream wraps into a spinning ring shape, the glow cooling from white through orange to warm polished gold, surface tension smoothing to a mirror finish, then a round diamond descends from above and seats into the setting with one bright flare, ending on the finished ring rotating slowly. CLIP C "the macro": extreme macro orbit of the finished ring, engraving appearing on the inner band reading AURELIA, rainbow fire flashing inside the diamond. 3. Download the MP4s.
FRAMES: ffmpeg, 150 frames per clip, 1600px wide, JPEG quality 3, frames/pour/frame_0001.jpg naming. Confirm files exist first.
THE SITE (plain HTML/CSS/JS, Lenis via CDN, preloader as a thin ember line filling with percentage, pinned 100vh scrub chapters with lerp smoothing): 1. HERO: the pour scrubs while "AURELIA" sets in a huge editorial serif, overline "FROM FIRE." in small tracked caps. 2. THE FORMING: clip B scrubs; as the ring takes shape, callouts fade in with hairline gold leader lines: 1,064 DEGREES. 24 KARAT. 1.2 CARATS. ONE OF ONE. 3. THE MACRO: clip C scrubs across the engraving and the diamond fire. 4. THE VOW: three short serif lines on making one thing perfectly, one reveal per scroll step. 5. SPECS: minimal two-column grid, hairline dividers, fictional details. 6. CTA: "Commission a piece", email field, small print. Art direction: void black #060504, champagne text #EDE3D0, molten gradient accent from #FFB25E to #C9742A used only where heat exists; giant serif display plus tracked-out caps; enormous negative space. Mobile and reduced motion: looping MP4 fallback. Performance: requestAnimationFrame, repaint only on frame change, 60fps.
VERIFICAÇÃO: o carregador desbloqueia em 100 por cento, o fluxo da bebida acompanha a rolagem, o capítulo de formação visivelmente esfria do branco incandescente ao dourado polido e assenta o diamante, a macro mostra a gravação, nenhum erro no console. Depois, forneça a URL ao vivo.