feat(remotion): +LogoMotion3D template (Tech/3D cinematic logo reveal)

First template built through the new flow (brief → quality-gate approval → build →
seed → deploy). Tech/3D logo motion: a 3D metallic card + radial light rays + lens
flare + bloom (genuine @remotion/three), with the user's uploaded logo composited
on the card as a reliable HTML <Img> (renders any SVG/PNG/data-URI; static camera
keeps it aligned), brand text + tagline, grain. Falls back to a branded play-mark
when no logo is set. Re-flows across 16:9/1:1/9:16.

- LogoMotion3D.tsx registered per aspect in Root.tsx.
- Seeded as fr-logo-motion-3d: text fields (brandText, tagline) + a logoUrl image
  upload field + the dark-tech palette (light text) + per-aspect previews.
- 3 thumbnails + 3 preview MP4s rendered, deployed; detail page + assets serve 200.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
soroush.asadi
2026-06-24 00:13:26 +03:30
parent 7394c5ce78
commit de8849bd94
10 changed files with 160 additions and 1 deletions
+16
View File
@@ -5,6 +5,7 @@ import { Three3DTest } from "./compositions/Three3DTest";
import { AssetSheet } from "./compositions/AssetSheet";
import { StoryScenes, STORY_SCENES_DURATION } from "./compositions/StoryScenes";
import { FlexStory, flexStorySchema, flexStoryDefaults, calcFlexStoryMetadata } from "./compositions/FlexStory";
import { LogoMotion3D, logoMotion3DSchema, logoMotion3DDefaults } from "./compositions/LogoMotion3D";
import { CHARACTER_JOURNEY } from "./scenes/presets";
import {
IlluminatedCircles,
@@ -107,6 +108,21 @@ export const RemotionRoot: React.FC = () => {
}}
/>
{/* Tech/3D logo motion — quality-preview composition */}
{ASPECTS.map((a) => (
<Composition
key={`LogoMotion3D-${a.id}`}
id={`LogoMotion3D-${a.id}`}
component={LogoMotion3D}
durationInFrames={5 * FPS}
fps={FPS}
width={a.width}
height={a.height}
schema={logoMotion3DSchema}
defaultProps={logoMotion3DDefaults}
/>
))}
{/* 3D feasibility test */}
<Composition
id="Three3DTest"