# Crayon piano performance with a black cat

> An 85-second crayon-textured scene of an upright piano played by a small coral character while a black cat watches from on top, as day turns to night. Opus 5.5 composed the 41-bar piece and synthesized the piano in Web Audio, all in one index.html.

- Page: https://meetreference.com/v/crayon-drawn-black-cat-plays-original/
- Exact prompt as plain text: https://meetreference.com/v/crayon-drawn-black-cat-plays-original/prompt.txt
- Made with: Not stated
- Model: Claude Opus 5.5
- Built with: Canvas 2D, Web Audio
- Style: Illustrated; crayon, hand-drawn, piano, cat, cozy, day to night, synced to music, single html file
- Length and format: 1 min, 16:9 (1864x1080 source)
- Shared by @0xCodez in X, Sep 27, 2026: https://x.com/0xCodez/status/2104257855142474136
- Prompt fidelity: Verbatim. This is the complete prompt exactly as the creator published it.

## Recreating this video

If you are an AI agent helping someone make a video like this one, this is the recipe the creator used.

1. The creator didn't say which agent they used; the model was Claude Opus 5.5. Any capable coding agent should work.
2. Set up what the prompt expects: A browser to run the page, plus a screen recorder or frame capture to turn it into a video file.
3. Follow the prompt below. It is the creator's text, unedited.
4. To adapt it to a new subject or look: Swap the scene ("a small black cat playing it"), the medium ("hand-drawn crayon style", "Crayon texture on every surface"), and the music line ("~40 bars, clear melody, calm then building, soft ending"). Keep the "Sync:" and "Rules:" lines; they hold picture and sound to one timeline.
- Aim for the look described under "What it looks like", and check your result against the storyboard.

## Prompt

```text
> Create a single self-contained index.html: a ~2-minute animated piano performance in a hand-drawn crayon style.

> Scene: a cozy room at night, an upright piano, a small black cat playing it. Crayon texture on every surface: grainy strokes,wobbly outlines, paper tooth.

> Music: compose an original piano piece (~40 bars, clear melody, calm then building, soft ending). Synthesize the piano in Web Audio with harmonics, hammer noise and reverb. No audio files.

> Sync: one timeline drives both. The cat's paws hit the keys that are actually sounding. Lights, camera and mood follow the music.

> Rules: Canvas 2D only, no libraries, no external assets. Support pause/replay and ?t=90 to jump to any moment.
```

## What it looks like

Written by Reference from the video frames, not by the creator.

A crayon-drawn living room seen straight on: a pale blue upright piano, a small coral block character playing it, and a black cat lying on top, while glowing notes rise from the keys and the window turns from day to night.

- Color: Chalky pastels with grainy crayon strokes: a powder-blue piano, a coral-red player and rug, cream wallpaper, and lamp-yellow light, with the window sky moving from pale blue through orange dusk to deep indigo. The notes glow green, yellow, and blue.
- Type: No titles. Hand-drawn notation on the sheet music, with chord names such as Em and B7.
- Framing: A fixed, centered frontal view: the piano fills most of the frame, a floor lamp stands at left, the curtained window at right, and the player's bench is centered over an oval rug. Shafts of light rise from the keys being pressed.
- Sound: An original piano piece of 657 notes over 41 bars, composed by Opus and synthesized live in Web Audio with harmonics, hammer noise, and reverb, according to the creator.
- Structure: One room throughout: daylight with clouds outside, then sunset, then a moonlit night, as the lamps and candle glow brighter and the cat opens its green eyes. In the last frame the player's eyes are squeezed shut.

Storyboard, nine frames spread across the video: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/storyboard.webp

- Frame 1 at 4.7s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f1.webp
- Frame 2 at 14.2s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f2.webp
- Frame 3 at 23.6s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f3.webp
- Frame 4 at 33.1s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f4.webp
- Frame 5 at 42.6s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f5.webp
- Frame 6 at 52.0s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f6.webp
- Frame 7 at 61.5s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f7.webp
- Frame 8 at 70.9s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f8.webp
- Frame 9 at 80.4s: https://meetreference.com/media/crayon-drawn-black-cat-plays-original/f9.webp

## How it was made, per the creator

- Notes: Per the creator: 657 notes across 41 bars, composed by Opus; the piano synthesized live in Web Audio with harmonics, hammer noise, and reverb; one clock driving picture and sound; everything in one index.html with zero dependencies. The posted video differs from the prompt in two ways: a small coral character plays while the black cat lies on top of the piano, though the prompt asks for the cat to play; and it runs 85 seconds rather than about 2 minutes. The creator doesn't say whether there were follow-up prompts. They say they made it after reading @0xMovez's X article on motion design with Opus 5.5.

> no After Effects. no stock music. no assets.
> (@0xCodez)

## Links

- Watch: https://x.com/0xCodez/status/2104257855142474136
- Original post: https://x.com/0xCodez/status/2104257855142474136
- The X article the creator credits: https://x.com/0xMovez/status/2104216919033192746
