Files
mintel.me/apps/video/src/illustrations/motion.ts
T
mmintelandClaude Opus 5.5 4bfbcbcacd feat: video films for social media, with the skill to make more
Adds apps/video, a standalone Remotion package (not part of the pnpm
workspace, so it never reaches the web build or the Docker image). It
renders six looping films, one per service, in German and English, as
4:5 for LinkedIn and 16:9 for YouTube and ads, together with the text
to post and an overview page.

Each film is one continuous shot: close on something abstract, the
camera pulls back to show what it really is, the form changes, and the
picture folds back into its opening. The slide deck code from the
earlier attempts is still in the package and no longer used.

Also adds the Google Ads concept, brings the relaunch concept in line
with the site as built, and a project skill that describes how to make
further films.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-04 21:23:01 +02:00

21 lines
877 B
TypeScript

import { Easing, interpolate } from "remotion";
/** Small motion helpers shared by all illustrations. All of them are pure functions of the frame. */
const CLAMP = { extrapolateLeft: "clamp", extrapolateRight: "clamp" } as const;
/** 0 before `from`, 1 after `to`, linear in between. */
export const progress = (frame: number, from: number, to: number): number =>
interpolate(frame, [from, to], [0, 1], CLAMP);
export const mix = (from: number, to: number, t: number): number => from + (to - from) * t;
export const inOut = Easing.inOut(Easing.cubic);
export const out = Easing.out(Easing.cubic);
/** Overshoots slightly, for things that pop in. */
export const pop = Easing.out(Easing.back(2.2));
/** `pop` between two frames: 0 before, 1 after. */
export const popAt = (frame: number, from: number, length = 8): number =>
pop(progress(frame, from, from + length));