К основному содержанию
плагин CX Codex GP ChatGPT официальный · OpenAI

hyperframes · openai — плагин для Codex: HTML-видео

Плагин помогает создавать и рендерить видео из HTML-композиций. Подойдёт для анимаций GSAP, субтитров и захвата сайта в ролик.

Открыть на GitHub

Что делает hyperframes

Внутри пять скиллов: для композиций на HTML, CSS и GSAP, работы с CLI, установки готовых компонентов, анимаций GSAP и захвата сайта в видео. Можно собирать композиции с переходами, титрами и визуализацией, реагирующей на аудио, а затем запускать предпросмотр или рендер через hyperframes.

Скиллы вызывают CLI командой npx hyperframes. Для работы нужны Node.js версии 22 или выше и FFmpeg в PATH; без FFmpeg CLI не сможет выполнить рендер. Среди команд есть init, lint, preview, render, transcribe, tts, doctor и browser.

Какие задачи решает

  • создать видеокомпозицию на HTML, CSS и GSAP
  • отрендерить композицию в видео через CLI
  • добавить готовые переходы и эффекты через реестр
  • захватить сайт и собрать из него видео
  • создать субтитры или озвучку для ролика

Примеры запросов агенту

  • Создай видеокомпозицию на HTML и CSS с анимацией GSAP, затем подготовь её к рендеру через hyperframes.
  • Проверь проект командой hyperframes lint и покажи предпросмотр через hyperframes preview.
  • Захвати сайт и собери из него готовое видео по шагам website-to-hyperframes.

Вопросы о hyperframes

Как установить hyperframes в Codex?

Для запуска скиллов нужны Node.js версии 22 или выше и FFmpeg в PATH. Сам CLI вызывается командой npx hyperframes.

Что делает hyperframes?

Плагин помогает создавать видео из HTML-композиций: от анимаций и титров до рендера и захвата сайта в ролик.

Что нужно для работы hyperframes?

Нужны Node.js версии 22 или выше и FFmpeg, доступный через PATH. Скиллы запускают CLI с помощью npx hyperframes.

Исходный текст

hyperframes · Apache-2.0
# hyperframes

OpenAI Codex plugin for [HyperFrames](https://hyperframes.heygen.com) — an open-source video rendering framework where HTML is the source of truth for video.

## What's included

Five skills for authoring and rendering video:

- **hyperframes** — composition authoring (HTML + CSS + GSAP), visual styles, palettes, house style, motion principles, transitions, captions, audio-reactive visuals
- **hyperframes-cli** — `hyperframes init / lint / preview / render / transcribe / tts / doctor / browser`
- **hyperframes-registry** — `hyperframes add` to install reusable blocks and components (social overlays, shader transitions, data viz, effects)
- **gsap** — tweens, timelines, easing, stagger, performance
- **website-to-hyperframes** — 7-step pipeline that captures a URL and produces a finished video

## Requirements

The skills invoke the `hyperframes` CLI via `npx hyperframes`, which needs:

- Node.js ≥ 22
- FFmpeg on `PATH`

See [hyperframes.heygen.com/quickstart](https://hyperframes.heygen.com/quickstart) for full setup.

## Source of truth

The skills are authored in [`heygen-com/hyperframes`](https://github.com/heygen-com/hyperframes) (under `skills/` at the repo root) and mirrored here. File issues about skill content on that repo.

© HeyGen · Apache-2.0 · openai/plugins

Похожие плагины

Все плагины по теме «Дизайн» →

Сначала — hyperframes от других авторов.

hyperframes HeyGen Собирает MP4-видео из вёрстки на HTML и CSS прямо через диалог с агентом. Пригодится для создания субтитров и анимированных роликов. ★ 72 481звёзд репо example-skills официальный anthropics Набор примеров скиллов для Claude: от веб-тестов и MCP до дизайна и документов. Подойдёт, чтобы изучить структуру скилла или взять шаблон за основу. ★ 183 839звёзд репо impeccable pbakaus Даёт агенту словарь дизайнера: 24 команды вроде polish, audit и bolder, чтобы правки интерфейса не сводились к «сделай красиво». ★ 88 212звёзд репо playground официальный Anthropic Собирает одностраничный HTML с ползунками, живым превью и готовым промптом, который можно скопировать обратно в Claude. ★ 44 635звёзд репо frontend-design официальный Anthropic Скилл для Claude, который ведёт фронтенд-работу к выразительной типографике, палитре и анимации вместо типовых ИИ-макетов. ★ 44 635звёзд репо visual-explainer nicobailon Плагин превращает сложный вывод терминала, архитектуру и сравнения требований в HTML-страницы с диаграммами. Страницы открываются в браузере. ★ 10 630звёзд репо

Из того же набора360

Весь набор →
openai-developers Плагин связывает Codex с платформой OpenAI для создания агентов и приложений ChatGPT. Он помогает генерировать зашифрованные ключи API и настраивать проекты на базе Agents SDK. CX Codex GP ChatGPT ★ 7 596звёзд репо twilio-developer-kit Плагин даёт агенту процедурные знания о продуктах Twilio: какие API использовать, в каком порядке и чего избегать. Пригодится при разработке с сервисами Twilio. CX Codex GP ChatGPT ★ 7 596звёзд репо codex-security Плагин от OpenAI добавляет в Codex рабочие сценарии по безопасности: сканирование, анализ и разбор инцидентов прямо в чате. CX Codex GP ChatGPT ★ 7 596звёзд репо supabase Плагин подключает Codex к проектам Supabase через MCP-сервер. Позволяет выполнять SQL-запросы к PostgreSQL, менять схемы таблиц и настраивать авторизацию. CX Codex GP ChatGPT ★ 7 596звёзд репо monday-com Связывает Codex и ChatGPT с рабочими досками monday.com. Позволяет ассистенту управлять задачами, сделками CRM, сроками и процессами прямо из диалога. CX Codex GP ChatGPT ★ 7 596звёзд репо granola granola подключает историю встреч к ChatGPT, чтобы ассистент находил решения, требования и отзывы клиентов прямо во время работы. CX Codex GP ChatGPT ★ 7 596звёзд репо plugin-eval Считает локальный отчёт по скиллу или плагину: почему такая оценка, что править первым, сколько уходит токенов. CX Codex GP ChatGPT ★ 7 596звёзд репо remotion Помогает создавать видео на React с анимациями, звуком, субтитрами и 3D прямо в коде. Пригодится при программной сборке и рендеринге роликов через FFmpeg. CX Codex GP ChatGPT ★ 7 596звёзд репо

Спонсоры проекта

Компании, которые помогают держать аналитику открытой