Product film for Taxtello bookkeeping app made with Claude Code and Remotion: Claude Code launch video

Originally posted by @daniel_haida on X · posted Sep 27, 2026 · curated by MotionHunt, updated Oct 15, 2026

In short

A 15-second product showreel for Taxtello, a German bookkeeping app, meant to look like a premium product film rather than a feature walkthrough. The author says it is 1920x1080 at 60 fps, with shot timings taken from the planned storyboard in the shared prompt; I could not verify them against the final video.

How it was made

The author says the film was made with Claude Code (Opus 5.5), using React and Remotion, with no After Effects. The author says every frame is code and the soundtrack was synthesized in Python from sine waves and noise. The work took one prompt and two rounds of feedback. No other timing or cost details were shared.

Tools: Claude Code, Claude Opus, Remotion
Effort: One prompt and 2 rounds of feedback

Shot breakdown

0.00-1.20sPlanned: dark navy opening. A small warm-gold glint reveals a fragment of the Taxtello mark or wordmark, and the UI begins to emerge from it. Little or no copy.
1.20-4.40sPlanned: financial control. The real cockpit is split into layered regions so they can animate separately. The hero number resolves, the chart draws in, and supporting metrics settle slightly later. Planned copy: "Alles im Blick."
4.40-7.50sPlanned: bookkeeping. A gold chart point expands into the corner of a receipt, the camera follows, and the document snaps into its matching booking. Optional copy: "Belege. Erledigt."
7.50-10.70sPlanned: invoices. Transition into the Rechnungen interface with one strong moment, such as a status change or payment resolving. Gold marks the active state. Optional copy: "Geld. Im Griff."
10.70-12.80sPlanned: tax clarity. Several noisy signals collapse into one calm tax overview. The rhythm slows here. Planned copy: "Steuern im Blick."
12.80-15.00sPlanned: brand payoff. The camera pulls out, the UI folds into one product object, darkness returns, and the gold wordmark resolves with one short line beneath it. The prompt lists several candidate lines.

Breakdown written by AI from the prompt and post, reviewed by MotionHunt.

Why it works

One idea per scene and a clear arc (control, clarity, brand) keeps a 15-second film easy to follow.
Object-driven transitions, such as a chart point becoming a receipt corner, make each cut feel caused rather than arbitrary.
Gold is used as a precise accent on dark navy, and green is reserved for positive states, which supports a premium look.
The real UI stays crisp and unblurred. Motion comes from staggered region reveals and eased timing rather than heavy effects.
The prompt asks for music at about 115-120 BPM with restrained tactile ticks and a resolved tone at the logo payoff.

Remix it for your product

You are the senior motion designer, product designer and Remotion engineer for [PRODUCT].

Your task is to create a premium, Apple-level product film for [PRODUCT], maximum 15 seconds, 1920x1080, 60 fps, H.264. This is NOT a generic SaaS explainer, NOT a feature walkthrough, and NOT a startup template animation. The goal is to make [PRODUCT] look like a mature, expensive product. Think product launch film, premium editorial motion, and restrained product presentation.

SOURCE OF TRUTH
First inspect the real repositories before designing anything: the design tokens, the brand docs, the logo files, and the newest valid UI screenshots. Do not invent screens, functionality or metrics. Use clearly synthetic, demo-safe values. Do not expose personal, test-user or production information. Use the actual logo. Do not redraw it.

VISUAL LANGUAGE
Use the real palette and typography from the repository. The brand accent should feel precious, not like a flood of color. Avoid neon, crypto or gaming looks, generic AI gradients, rainbow gradients, and glassmorphism everywhere.

CORE RULES
One shot = one idea. The product UI is the hero. Keep copy minimal, with headlines of about 3-4 words on one line. No hard cuts unless there is a deliberate reason. Transitions should come from shared objects, such as a chart line becoming a connector, a card becoming the next card, or a number becoming an interface element. Use premium easing, no linear motion, no bouncing UI, and overshoot below 2%. Motion should overlap so elements do not start and stop on the same frame. Use depth sparingly. No particle spam, no excessive blur, no constant zooming, no spinning 3D cards.

STORY ARC
One continuous thought, for example CHAOS, then CONTROL, then CLARITY, then BRAND. The first meaningful product moment should land by about 2 seconds. No long logo intro.

REAL SURFACES
Use the strongest real surfaces from the repository: [FEATURES]. Choose the 3-4 most visually strong and recreate them faithfully in React from the design system where regions need to animate separately. Do not simply scale a giant screenshot.

STORYBOARD AND BUILD
First write a storyboard with exact timestamps, key visual, transition logic, copy and rhythm for each scene. Then implement it as a new independent composition using deterministic, frame-based animation with no setTimeout. Keep existing compositions working.

SOUND
No copyrighted audio. Design the motion around about 115-120 BPM. Plan a low soft impact for the main reveal, restrained tactile UI ticks, and a resolved tone at the payoff. Provide a cue sheet. Synthesized or local audio is fine.

FINAL FRAME
End on a still frame with enough room to register. No bouncing CTA.

QA
Render frames at 0, 1, 2.5, 4.5, 6.5, 8.5, 10.5, 12.5, 14 and 14.8 seconds. Inspect each one visually and ask whether it looks premium, whether anything looks like a template, whether it is too busy, whether the product is legible, and whether the transitions are logical. Fix weaknesses, render the full MP4, and inspect decoded frames from the MP4 itself. Do not declare success because the code compiles. Do not deploy or merge anything.