Английское название: Closertensating

Claude Opus 5.5 и Claude Sonnet 5.5 заполнили мою ленту видеозаписями, нарисованными в коде, поэтому я подделал навык для обоих. Это вступление было сделано с таким умением: каждый кадр рисуется в коде. Смотрите 45-секундный MP4.

Кованые для обеих моделей

Code-video превращает тему, дизайн и формат в MP4, полностью написанный кодом. Он предназначен для работы с Claude Opus 5.5 и Claude Sonnet 5.5.

Агентский навык, который исследует тему и превращает ее в короткое видео, полностью написанное кодом. Дайте ему тему и стиль (один из предустановленных ниже, DESIGN.md любого сайта или взгляд, описанный вашими собственными словами) и получите MP4. Никакой модели видеопоколения и никаких стоковых кадров: агент пишет сцены, визуализирует их кадр за кадром и передает вам файл.

Как это работает

1. ** Все это код. ** Каждый кадр - это функция времени, нарисованная на холсте HTML, захваченная безголовым Chrome и закодированная ffmpeg. Музыка и звуковые эффекты также синтезируются в коде, поэтому один и тот же вход всегда отображает одно и то же видео.
2. ** Сначала исследование. ** Агент собирает около десяти фактов с источниками и берет палитру и шрифты от бренда. Каждый номер на экране имеет свой источник.

code-video

English | 한국어

Claude Opus 5.5 and Claude Sonnet 5.5 filled my feed with videos drawn in code, so I forged a skill for both. This intro was made with that skill: every frame is drawn in code. Watch the 45-second MP4.

Forged for both models

code-video turns a topic, a design, and a format into an MP4 drawn entirely in code. It is designed to work with both Claude Opus 5.5 and Claude Sonnet 5.5.

An agent skill that researches a topic and turns it into a short video drawn entirely in code. Give it a topic and a style (one of the presets below, any site’s DESIGN.md, or a look described in your own words) and get an MP4. No video-generation model and no stock footage: the agent writes the scenes, renders them frame by frame, and hands you the file.

How it works

1. Everything is code. Each frame is a function of time drawn on an HTML canvas, captured by headless Chrome, and encoded by ffmpeg. Music and sound effects are synthesized in code too, so the same input always renders the same video.
2. Research first. The agent collects about ten facts with sources and takes the palette and fonts from the brand. Every number on screen has a source.
3. Design, research, format. You give the look (a style, a brand preset, any site’s DESIGN.md, or any look in your own words), the topic, and the length, frame, and language. The agent writes the story that fits and shows you a short plan before it builds.
4. Few rules, on purpose. The skill hands the agent the look and one hard rule (sourced numbers) and leaves the story to it. In our A/B test, cutting the process rules made a video 23–51% cheaper with no visible drop in quality.
5. Fast enough to iterate. Frames render in parallel headless Chrome pages and are captured as JPEG: a 45-second 1080p video renders in about a minute on a 10-core laptop, and a whole run from research to MP4 took 4–13 minutes in our tests.

Gallery

A few seconds from an example in each style. Every example is a video about this skill, made by a fresh agent with only this skill; the full MP4s are in the latest release. New styles are added over time, and pull requests for new ones are welcome (see Contributing).

The brand-style presets borrow only the public design language of each site; this project is not affiliated with those companies.

Hand-drawn · @nahiddotai