Copybook中文Search

Prompt

4 starting points for a code-only animation

An animation you love, a one-line idea, a character image or an art style: a prompt for each, one HTML file rendered, plus sound.

589 saves on X, as of Posted

Prompt: reverse-engineer it
Reverse-engineer this video into HyperFrames code, then make a more creative version from a designer's point of view.

Next Send it to the model with your video, image or topic.

Those code-only animations all over the timeline come down to four approaches, each with a prompt you can copy:

  • Found an animation you love: have it reverse-engineer it
  • Just have an idea: one sentence, high effort
  • Have a character image: a screenshot and a few lines
  • Want a specific art style: spell out the spec

Found an animation you love? Drop the video in with the prompt.

That’s how I made mine: two messages, and the second one just asked it to change the story and polish the look. Everything lives in one index.html, rendered to MP4 with HyperFrames. About an hour start to finish, roughly $14 at API prices.

Just have an idea? Set /effort to max or xhigh, then give it one sentence:

Prompt: one sentence, high effort
Make a playable 3D racing game that runs in my browser, and make it look as good as you can.

Leave the ideas and the details to it. It can run for over an hour, and it uses the most of your limits.

Have a character image? Paste it in with a few lines:

Prompt: from a character image
Here's the main character. Turn it into a 30-second animated short about [TOPIC]: playful, with a clear ending, made to post on X. Skip synthesized sound effects and use real audio samples from my machine.

The fastest ones are done in under 20 minutes. Swap in screenshots and the repo of your own app, and you get a product intro video.

Want a specific art style? Spell out the spec. For pixel art, for example:

Prompt: a specific art style
In a single HTML file with vanilla JS and Canvas, make a pixel-art cat chasing fireflies. Draw on a low-res canvas first, like 160×90, then scale up by whole numbers. Use a small fixed palette and no anti-aliasing. Animate with a choppy 10 fps pixel feel, in four phases: idle, stalk, pounce, land. Loop it seamlessly.

How to do the sound:

  • Code only: have it synthesize the score with the Web Audio API or a Python script, timed to the story beats
  • Not happy with it: have it redo the score a few more times, using real instrument sounds
  • Samples: local audio samples, licensed music, or ElevenLabs for sound effects