hyperframes

Habilidades de Design para Agentes

O que é hyperframes?

O pacote `hyperframes` é um conjunto de 11 habilidades especializadas para agentes de IA de codificação que precisam produzir vídeos a partir de composições HTML. Ele abrange a criação de cenas com HTML/CSS/JS, síntese de fala (TTS) e transcrição via HeyGen, um fluxo de renderização por linha de comando, um registro de ativos para mídia reutilizável, captura de URL para conteúdo web ao vivo e seis sub-habilidades de animação (GSAP, Anime.js, CSS animado, Lottie, Three.js 3D e Web Animations API). É ideal para pipelines de produção de vídeo orientadas por agente, mas requer uma conta HeyGen para recursos de geração de mídia como TTS e renderização de vídeo. A instalação é feita via `npx skills add heygen-com/hyperframes` e, após instalado, o agente pode ser invocado com o nome da habilidade `hyperframes` ou frases de gatilho como "HTML to video".

Funciona com✓Claude Code~Codex CLI✓Cursor
npx skills add podo/design-agent-skills

Installed? Explore more Programação e Desenvolvimento skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que hyperframes faz?

Catálogo provisório — pacote completo: heygen-com/hyperframes

Nota: Requer uma conta HeyGen para recursos de TTS e geração de mídia.

Árvore de decisão

  1. O pacote já está instalado? Verifique: o diretório de habilidades do seu agente contém hyperframes com conteúdo além deste catálogo.

    • Sim → invoque hyperframes e prossiga
    • Não → vá para a etapa 2
  2. Em qual agente você está?

    • Claude Code → npx skills add heygen-com/hyperframes — ou envie ! npx skills add … como uma mensagem de chat (adicione -g para global, omita para apenas no projeto)
    • Cursor → npx skills add heygen-com/hyperframes
    • Outro → npx skills add heygen-com/hyperframes ou veja o README no GitHub

Comando de instalação

npx skills add heygen-com/hyperframes

Uma conta HeyGen é necessária para recursos de TTS, transcrição e renderização de vídeo. A criação de animações funciona sem uma conta.

Invocar após a instalação

  • Nome da habilidade: hyperframes
  • Frases de gatilho: "hyperframes", "HTML para vídeo", "HeyGen", "renderizar vídeo a partir de HTML", "Anime.js"

O que faz

"Escreva HTML. Renderize vídeo." — um conjunto de 11 habilidades construídas especificamente para agentes de codificação de IA que precisam produzir saída de vídeo a partir de composições HTML. Abrange: criação de composições (construção de cenas HTML/CSS/JS), síntese de fala e transcrição via HeyGen, um fluxo de trabalho de renderização orientado por CLI, um registro de ativos para mídia reutilizável, captura de URL para obter conteúdo web ao vivo e seis sub-habilidades de animação que abrangem GSAP, Anime.js, animações CSS simples, reprodução Lottie, 3D com Three.js e a API de Animações Web (WAAPI). Projetado desde o início para pipelines de produção de vídeo orientados por agentes.

Quando NÃO usar

  • Animação estática sem saída de vídeo (use gsap-skills, framer-motion-skills ou animate-css-skill)
  • Quando você não tem uma conta HeyGen — os recursos de geração de mídia (TTS, renderização de vídeo) não funcionarão

Individual skills in this repo

This repo contains 3 individual skills — each has its own dedicated page.

Habilidades Relacionadas