feat(film): pillar 5 — know your true profit
This commit is contained in:
@@ -1,5 +1,35 @@
|
|||||||
|
import { AbsoluteFill, Sequence } from "remotion";
|
||||||
import { PillarTitle } from "../components/PillarTitle";
|
import { PillarTitle } from "../components/PillarTitle";
|
||||||
|
import { ScreenFrame } from "../components/ScreenFrame";
|
||||||
|
import { KenBurns } from "../components/KenBurns";
|
||||||
|
import { Cursor } from "../components/Cursor";
|
||||||
|
import { Caption } from "../components/Caption";
|
||||||
import { DURATIONS } from "../timing";
|
import { DURATIONS } from "../timing";
|
||||||
export const Pillar5Profit: React.FC = () => (
|
|
||||||
<PillarTitle index="⑤" title="Pillar 5" subtitle="(stub)" startFrame={0} durationInFrames={DURATIONS.pillar5} />
|
const D = DURATIONS.pillar5;
|
||||||
);
|
const TITLE = 75;
|
||||||
|
|
||||||
|
export const Pillar5Profit: React.FC = () => {
|
||||||
|
const afterTitle = D - TITLE;
|
||||||
|
const half = Math.floor(afterTitle / 2);
|
||||||
|
return (
|
||||||
|
<AbsoluteFill>
|
||||||
|
<Sequence durationInFrames={TITLE}>
|
||||||
|
<PillarTitle index="⑤" title="Know your true profit" subtitle="Real margin on every job" startFrame={0} durationInFrames={TITLE} />
|
||||||
|
</Sequence>
|
||||||
|
|
||||||
|
{/* Financial overview — drill into a job */}
|
||||||
|
<Sequence from={TITLE} durationInFrames={half}>
|
||||||
|
<KenBurns durationInFrames={half}><ScreenFrame captureId="owner-snapshot" /></KenBurns>
|
||||||
|
<Cursor from={{ x: 700, y: 360 }} to={{ x: 1250, y: 430 }} moveStartFrame={18} clickAtFrame={42} />
|
||||||
|
<Caption text="Revenue recognized job by job, on a true cost-to-cost basis." startFrame={10} durationInFrames={half - 20} />
|
||||||
|
</Sequence>
|
||||||
|
|
||||||
|
{/* Leaderboard — storm attribution bookend */}
|
||||||
|
<Sequence from={TITLE + half} durationInFrames={afterTitle - half}>
|
||||||
|
<KenBurns durationInFrames={afterTitle - half}><ScreenFrame captureId="leaderboard" /></KenBurns>
|
||||||
|
<Caption text="And every dollar traces back to the storm that started it." startFrame={10} durationInFrames={afterTitle - half - 20} />
|
||||||
|
</Sequence>
|
||||||
|
</AbsoluteFill>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user