7ed2ccc414
The reference-round workflow, run end to end for a real template: Taste system (how we learn the user's taste, persisted): - references/TASTE_PROFILE.md (living design contract) + references/README.md (the daily loop) + a "reference round" stage in docs/TEMPLATE_BRIEF.md (provide refs or I suggest+mock directions). Design-quality before/after: - HeroDemo — the fix recipe vs the faint default: layered-depth background, a proper big video type scale, and a bold composed focal object. (Backgrounds were naked, text too small, scenes had no objects.) - YaldaSofreh3D + IGPromoDirections + IGProfileMock — reference-match proofs (low-poly 3D, 3 IG-promo style directions, the realistic IG-light page). Instagram channel-promo template (the deliverable — a flexible 5-scene FlexStory): - igkit + 5 blocks: IGIntro, IGProfile (realistic IG-light profile, scales to all aspects), IGFeed (post grid), IGStats (animated count-up), IGFollowCTA (Follow taps to "Following"). - FlexStory gains a `finish` toggle so the IG-light scenes render clean (no brand grade). INSTAGRAM_PROMO preset + 3 aspect comps in Root. Verified: a still of every scene at 9:16 renders clean; full preview MP4 rendering. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
49 lines
2.1 KiB
TypeScript
49 lines
2.1 KiB
TypeScript
import type { SceneBlock } from "./types";
|
|
import { TitleCardBlock } from "./blocks/TitleCard";
|
|
import { CharacterSceneBlock } from "./blocks/CharacterScene";
|
|
import { ImageCaptionBlock } from "./blocks/ImageCaption";
|
|
import { KineticQuoteBlock } from "./blocks/KineticQuote";
|
|
import { SlideshowBlock } from "./blocks/Slideshow";
|
|
import { OutroCTABlock } from "./blocks/OutroCTA";
|
|
import { LogoRevealBlock } from "./blocks/LogoReveal";
|
|
import { StatCounterBlock } from "./blocks/StatCounter";
|
|
import { BarChartBlock } from "./blocks/BarChart";
|
|
import { StompBlock } from "./blocks/Stomp";
|
|
import { DeviceMockupBlock } from "./blocks/DeviceMockup";
|
|
import { ProductShowcaseBlock } from "./blocks/ProductShowcase";
|
|
import { PaperCutBlock } from "./blocks/PaperCut";
|
|
import { IGIntroBlock } from "./blocks/IGIntro";
|
|
import { IGProfileBlock } from "./blocks/IGProfile";
|
|
import { IGFeedBlock } from "./blocks/IGFeed";
|
|
import { IGStatsBlock } from "./blocks/IGStats";
|
|
import { IGFollowCTABlock } from "./blocks/IGFollowCTA";
|
|
|
|
/**
|
|
* The scene-block registry. A FlexStory template is an ordered list of these
|
|
* blocks; new template types = new blocks. Each block declares its editable
|
|
* fields + duration range (so the studio can clamp per-block, not globally).
|
|
*/
|
|
export const SCENE_BLOCKS: Record<string, SceneBlock> = {
|
|
[TitleCardBlock.id]: TitleCardBlock,
|
|
[CharacterSceneBlock.id]: CharacterSceneBlock,
|
|
[ImageCaptionBlock.id]: ImageCaptionBlock,
|
|
[KineticQuoteBlock.id]: KineticQuoteBlock,
|
|
[SlideshowBlock.id]: SlideshowBlock,
|
|
[OutroCTABlock.id]: OutroCTABlock,
|
|
[LogoRevealBlock.id]: LogoRevealBlock,
|
|
[StatCounterBlock.id]: StatCounterBlock,
|
|
[ProductShowcaseBlock.id]: ProductShowcaseBlock,
|
|
[BarChartBlock.id]: BarChartBlock,
|
|
[StompBlock.id]: StompBlock,
|
|
[DeviceMockupBlock.id]: DeviceMockupBlock,
|
|
[PaperCutBlock.id]: PaperCutBlock,
|
|
[IGIntroBlock.id]: IGIntroBlock,
|
|
[IGProfileBlock.id]: IGProfileBlock,
|
|
[IGFeedBlock.id]: IGFeedBlock,
|
|
[IGStatsBlock.id]: IGStatsBlock,
|
|
[IGFollowCTABlock.id]: IGFollowCTABlock,
|
|
};
|
|
|
|
export const BLOCK_LIST = Object.values(SCENE_BLOCKS);
|
|
export const getBlock = (id: string): SceneBlock | undefined => SCENE_BLOCKS[id];
|