Haiku 5.5 写代码做动效，一条不到一分钱

xanonku @xanonku原推发布于 2026.10.11

在 X 上打开原推

HAIKU 5.5 CAN ANIMATE ALMOST ANYTHING YOU CAN DESCRIBE A FREELANCER STILL QUOTES $500+ FOR A SHORT MOTION CLIP. HAIKU WRITES THE CODE FOR ONE FOR UNDER A CENT. THE CATCH IS THE PROMPT, AND MOST PEOPLE GET IT WRONG haiku 5.5 came out this week at $0.50 per 1M output tokens. a 20-second animation is one html file, ~8k tokens. that's $0.004 the mistake: asking for "a video" the fix: ask for one file where every frame is a function of time. small, strict code is exactly what a cheap model is good at the master prompt, copy it: you are a motion designer who writes code. build ONE self-contained html file: a 1080x1350 canvas animation, [20]s, seamless loop. scene: [describe it in 1-3 sentences] rules: - no libraries, no external files, no images. canvas 2d only - every frame is a pure function of time: draw(t), t in seconds. no setInterval, no unseeded random - write the timeline first as a comment: what happens at each second - easeOutCubic for entrances, easeInOutSine for camera, a small overshoot for things that land - keep every piece of text on screen at least 1.2s - max 2 fonts, 3 colors + background, defined as constants at the top - the first frame already shows the hook text, never a blank screen - the last frame matches the first, so the loop has no jump - add window.renderFrame = t => draw(t) so it can be exported frame by frame return only the html 8 scenes i'd steal first. paste one into [describe it in 1-3 sentences] 1. candlestick: a dark trading screen. 40 candles draw left to right, each grows from open to close in 0.15s, green up, red down. at 6s a dashed line marks the all-time high and the last candle breaks it 2. counter: a big number counts from $0 to $1,000,000 over 4s, fast then slowing. digits roll vertically like an odometer, commas stay fixed. on landing a small bounce, then "per year" fades in under it 3. split-flap: a train-station split-flap board, 3 rows x 18 cells. each cell flips through random letters (seeded), then settles on [your headline], left to right, 40ms apart. show the top half folding down on every flip 4. order book: 12 green bid rows on the left, 12 red ask rows on the right, horizontal depth bars that breathe on smooth sine noise. every 2s a large order eats 3 ask rows, they flash and refill 5. agent pipeline: 5 rounded boxes left to right: scout, research, reader, filter, you. curved wires between them. glowing packets travel along the wires. the filter rejects 9 of 10 packets, they turn grey and fall. 1 reaches "you" 6. receipt: a thermal printer prints a receipt line by line, paper slides down. 5 items with prices, a dashed rule, TOTAL. at the end a red PAID stamp hits it at a slight angle with a small shake 7. ui demo: an app screen built from rectangles: sidebar, header, 3 cards. a cursor moves on curved paths, clicks the middle card with a ripple, the card expands into a detail view and a number inside counts up 8. portfolio: a donut chart with 5 labeled slices. at 3s each slice unrolls into a vertical bar, keeping its color, sorted by size. at 6s they roll back into the donut for the loop honestly the rule doing the most work is draw(t). no timers, no randomness. the same t always gives the same frame, so you can loop it, scrub it and export it to get an mp4, hand the file to claude code: "render window.renderFrame at 30 fps, 1080x1350, encode with ffmpeg" there are too many guides now, and not all of them are useful

这条是引用着另一条写的：x.com/xinc3s/status/2108204467774509059