explainer-default

Installation
SKILL.md

Default explainer

A calm, premium product demo, the kind a well-funded startup puts on its homepage. Its whole trick is restraint: a bright, airy canvas, one short line of text at a time, and the product's own interface rebuilt cleanly and filmed up close while it is being used. The camera does the storytelling: it pushes into a line of text, rides along with typing, pulls back to reveal the result, and glides to the next feature.

You write it as one HTML page that renders any frame from a time value, then render it to MP4 with motion blur and a soundtrack.

Step 1: Get the brief (one message, then go)

Ask everything in one message, then work on your own. Only the product is required; for anything left blank, decide yourself and say what you chose.

  1. Product: name, and what it does in a few sentences. A website URL is even better.
  2. The one thing the viewer must remember (e.g. "type an idea, get a live app").
  3. Brand: colours, fonts, logo file, or "use the website". If none, use the default palette below.
  4. Format: 16:9 (1920×1080) or 9:16 (1080×1920). Default 16:9.
  5. Length: default is given below for this style.
  6. Music: their own track (a file path), or let you synthesise one. Default: synthesise.
  7. Direction (optional): scenes they want, a tagline, a call to action, anything to avoid.

If they gave a URL, read it (web fetch) for the product's real wording, features, colours and font names before writing anything. Use their real words for UI labels and taglines.

Installs
543
GitHub Stars
798
First Seen
10 days ago