Запись архива

Саймон Уиллисон показал, как Claude Opus 5.5 и Claude Code создают пиксельную анимацию с киви: рабочий процесс для разработчиков

Саймон Уиллисон на WeAreDevelopers World Congress продемонстрировал, как Claude Opus 5.5 генерирует пиксельную анимацию с 20 танцующими киви, а Claude Code автоматически записывает видео через Playwright. Разбираем практический пайплайн.

Пиксельная анимация с киви, сгенерированная Claude Opus 5.5 на HTML5 Canvas
Пиксельная анимация с киви, сгенерированная Claude Opus 5.5 на HTML5 Canvas
Изображение из исходного материала

Саймон Уиллисон, известный разработчик и автор популярного блога о LLM, выступил с закрывающим докладом на WeAreDevelopers World Congress North America. В качестве «звездного момента» он решил использовать недавний рекордный сезон размножения киви (kākāpō) в 2026 году. Но главное — Уиллисон продемонстрировал практический рабочий процесс, объединяющий генерацию пиксельной анимации через Claude Opus 5.5 и автоматическую запись видео через Claude Code с Playwright.

Как это работает: от фотографий к анимации

Уиллисон собрал три фотографии киви из поиска Google Images и передал их в Claude Opus 5.5 с простым промптом:

«Вот несколько фотографий попугаев киви, чтобы напомнить тебе, как они выглядят. Мне нужно, чтобы ты сделал анимацию в стиле пиксельной графики на HTML5 Canvas — очевидно, пиксельные киви, прыгающие вверх-вниз, с вечеринкой, конфетти и всем таким. Должно быть как минимум 20 штук».

Результат — веб-страница с анимацией на HTML5 Canvas, где 20 пиксельных киви прыгают под конфетти. Уиллисон назвал результат «довольно крутым». Полный транскрипт промпта и код доступны в его блоге.

Автоматизация записи видео через Claude Code и Playwright

Чтобы встроить анимацию в презентацию Keynote, Уиллисону понадобилось видео. Он скачал HTML-файл и дал локальному Claude Code задачу:

«Сделай мне видео из файла kakapo-party.html. Загрузи его в браузер, кликни несколько раз для эффекта конфетти. Видео должно быть 15 секунд. Не начинай кликать до 3 секунды. Убедись, что клики распределены по кликабельной области».

Claude Code сгенерировал скрипт на Playwright, который:

Открывает страницу в браузере Chromium с viewport 1280×720.
Скрипт кликает в 9 точках экрана: центр, углы, края и середина.
Клики распределены по времени: первый в 3 секунды, последний в 13.2 секунды.
Видео записывается в директорию vids.

Сам скрипт получился компактным — около 30 строк кода. Уиллисон отметил, что это «приятно короткий» пример.

Практический вывод для разработчиков

Этот кейс демонстрирует зрелость инструментов Anthropic для практических задач:

Claude Opus 5.5 способен генерировать рабочий HTML5 Canvas с анимацией по простому текстовому описанию, используя лишь несколько референсных изображений.
Claude Code может автономно создавать и выполнять скрипты Playwright для записи видео, корректно распределяя клики по времени и области.

Для разработчиков, которые хотят повторить этот пайплайн, достаточно:

Установить Claude Code (локально).
Передать ссылку на HTML-файл или загрузить его.
Описать задачу на естественном языке — указать длительность видео, моменты кликов и их расположение.
Получить готовый скрипт Playwright и видеофайл.

Ограничения и контекст

Стоит учитывать несколько моментов:

Уиллисон использовал Claude Opus 5.5, который доступен в платной подписке Anthropic. Для Claude Code также требуется подписка.
Генерация анимации заняла некоторое время — точное время не указано, но процесс не был мгновенным.
Для воспроизведения анимации в Keynote потребовалась дополнительная конвертация через Playwright, что добавляет шаг в пайплайн.

Тем не менее, пример показывает, что современные LLM способны закрывать цепочку задач: от генерации контента до его упаковки в нужный формат для презентаций.

Что это значит для пользователей

Для тех, кто регулярно готовит презентации, демо или обучающие материалы, этот подход может существенно сократить время на создание анимированной графики. Вместо поиска готовых анимаций или работы в профессиональных инструментах, можно описать желаемый результат текстом и получить рабочий код.

Однако важно проверять результат: анимация может не соответствовать ожиданиям по стилю или качеству, и потребуется итерация промпта.

Дополнительные источники

Полный пост Саймона Уиллисона с транскриптом и кодом: https://simonwillison.net/2026/Sep/26/kakapo-party/
Транскрипт промпта для Claude Opus 5.5: https://simonwillison.net/2026/Sep/26/kakapo-party/#transcript
Скрипт Playwright, сгенерированный Claude Code: встроен в пост Уиллисона.
Информация о рекордном сезоне размножения киви в 2026 году: доступна в открытых источниках по запросу «kākāpō breeding season 2026».

Источники