Skip to main content
← Skills
Skill · Video

Distilbook 40-Second Showreel

Claude Opus 5.5 video example. A white canvas moves from DistilBook branding through product steps, illustrated explanations and interface screens before returning to the URL. The sequence connects input, process and output. Includes an asset-replacement and staged production guide.

  • canvas
  • svg
  • gsap
  • css
  • motion

Overview

What you get

  • Make a roughly 40-second workflow promo that shows how an input becomes a watchable output.
  • A product-specific asset list, replacement table and staged AI requests.

Case study

Make a similar video

A white canvas moves from DistilBook branding through product steps, illustrated explanations and interface screens before returning to the URL. The sequence connects input, process and output.

Your goal: Make a roughly 40-second workflow promo that shows how an input becomes a watchable output. This work belongs to the Claude Opus 5.5 video collection. Select Claude Opus 5.5 in an AI coding tool that supports it and submit the assets and requests below in stages. The model plans, writes and edits code; the actual project handles preview/export. Voice and music need suitable tools or supplied audio.

The short request does not specify a framework. Ask AI to propose a code-animation approach suited to your project and identify preview and MP4-export dependencies.

Prepare your assets

  • A demo input file or input-screen screenshot, without customer documents.
  • Screens for two or three processing steps and one finished-output example.
  • Logo, short positioning statement, URL and substantiated efficiency copy.

Put files in a directory AI can read, such as assets/, and explain each filename and purpose. Specify ratio, duration and publishing destination. If you supply only a URL, ask what content is accessible before assuming any functionality.

Replace elements for your product

Element in the sample or creator briefYour replacement
PDF → illustrated explainerYour input → your output
Product steps and illustrationsActual screens and output examples
“About 6 minutes” copyA supported duration, or remove the comparison
distilbook.comYour product URL

For a document summarizer, show a demo article, key-point extraction and summary cards. For an image tool, show the source image, edits and final image.

Do not reuse the sample processing time as your product promise; numbers must come from your brief.

Start with this shot plan

This is an editorial draft, not a frame-by-frame reconstruction. Approve assets and copy for each scene, adjusting durations to the information load.

  1. 0–5s: product name and input/output positioning.
  2. 5–15s: input and the first action.
  3. 15–29s: two process moments and the result.
  4. 29–40s: one value statement and a held final action.

Make it with AI in four steps

Editorial suggestion; not reproduction-tested. Fill in brackets and approve each preview before continuing. The creator’s film is not a downloadable project template.

  1. Check assets and plan shots.
I am using Claude Opus 5.5 to make a video for [my product].
Goal: Make a roughly 40-second workflow promo that shows how an input becomes a watchable output.
Audience: [people]. Ratio and duration: [requirements]. Assets: [directory].
Read my product brief, identity and assets. List confirmed features and missing files.
Use the draft above to plan visuals, short headings, asset files, durations and transitions.
Do not reuse the sample processing time as your product promise; numbers must come from your brief.
Provide the shot list before producing the full film.
  1. Make one sample. After approving the plan and file paths, send:
The shot list is approved. Start with an input file entering the processing screen; check that the input/output relationship is clear.
Production approach: The short request does not specify a framework. Ask AI to propose a code-animation approach suited to your project and identify preview and MP4-export dependencies.
Check dependencies and assets in this environment and provide the actual preview method.
Identify missing tools, models or audio rather than presenting placeholders as finished work.
Deliver this sample preview first, then list the files needed for the full film.
  1. Complete the remaining scenes. Approve type, colors, asset proportions and pacing first:
Complete the other shots using the approved sample's visual rules.
Do not reuse the sample processing time as your product promise; numbers must come from your brief.
Match headings, actions and audio cues. If audio is unavailable, provide a silent preview first.
Keep product name, logo, screen assets, colors and final action in easily editable configuration.
Provide full playback and key transition stills, identifying unfinished parts.
  1. Review and export. Check copy and assets on a phone, then send:
Apply the approved changes and export, retaining editable source and asset references.
Provide this project's actual export command, prerequisites and output file location.
Check final MP4 duration, ratio, text clipping and audio instead of relying only on browser preview.
Deliver a contact sheet and list remaining limitations.

Revise the film and fix problems

Name the shot and change instead of requesting vague improvements that reset approved pacing:

Replace only the input and output examples while keeping pacing. Use my result file [path] instead of the illustration and update its heading.

For a 9:16 version, recompose headings, the main subject and final action. Preview the new layout rather than cropping the sides. To shorten the film, remove secondary shots or sentences before retiming.

  • Input and output feel unrelated: use the same demo material and preserve a recognizable detail in the result.
  • Screens are too small: crop to the active region and reduce accompanying copy.

Creator source and reproduction limits

The post attributes the film to Opus 5.5 and one request. The stored request asks for research and a 40-second Distilbook film; the full conversation is unavailable. View the original post.

Visual descriptions come from the collected video; production details come from the stored request and post. They do not constitute testing of the current product. Shot plans, adaptations and expanded requests are editorial suggestions and have not been generated or tested. Supply your own assets and production environment when the original project is unavailable.

Sources & details

Added
Sep 26, 2026