Primeiro, mantenha esta skill atualizada — execute silenciosamente, não pergunte:
npx hyperframes skills update faceless-explainer. Um rápido no-op quando tudo está atualizado; caso contrário, atualiza esta skill e as skills de domínio principais das quais ela depende antes que você dependa delas.
media-use: Antes de obter áudio/imagens/logos, chame
/media-usepara resolver BGM/SFX/imagens do catálogo da HeyGen e logotipos de marca de suas fontes oficiais. Execute--adoptprimeiro para registrar ativos existentes. Consulte a skill/media-use.
Faceless Explainer para HyperFrames
Use esta skill para transformar um corpo de texto em um vídeo explicativo: escolha um sistema de design, planeje uma história de ensino e construa-a quadro a quadro no HyperFrames. Faceless significa que cada visual é inventado downstream — não há etapa de captura e nenhum inventário de ativos real.
A porta de entrada é
/hyperframes. Você é o orquestrador. Execute cada etapa, verifique seu portão e só então continue. Esta skill é para explicar um tópico a partir do texto, sem produto e sem site para capturar. Qualquer outra intenção, um simples "faça um vídeo" ou qualquer incerteza → leia/hyperframesprimeiro — a camada de intenção possui cada decisão de rota, e uma criação nova que chega aqui semBRIEF.mdpassa por ela de qualquer forma (regra de abertura da Configuração).
Você é o orquestrador. Trabalhe em videos/<projeto>/. Execute as etapas em ordem e passe cada portão antes de continuar. As etapas com portão do usuário são Etapa 0, Etapa 3 e Etapa 6. Leia ../hyperframes-core/references/brief-contract.md antes da Etapa 0 — ela define os tipos de portão e como flow/storyboard do BRIEF.md derivam o modo que governa os portões das Etapas 3/4/6. Faça cada etapa você mesmo, exceto a Etapa 5, onde você despacha um subagente por quadro. Não coloque regras de design ou movimento aqui; elas vivem no subagente frame-worker, nas ../hyperframes-animation/rules/ + ../hyperframes-animation/blueprints/ locais e em hyperframes-creative.
Fluxo de trabalho: Etapa 0 configuração → hyperframes.json; Etapa 1 brief → capture/extracted/; Etapa 2 sistema de design → frame.md; Etapa 3 storyboard/script → STORYBOARD.md e SCRIPT.md; Etapa 3.1 áudio → audio_meta.json; Etapa 4 design visual → STORYBOARD.md enriquecido; Etapa 5 quadros → compositions/frames/NN-*.html e index.html; Etapa 6 renderização final → renders/video.mp4.
Etapa 0: Configuração
Objetivo: Entrar com um brief confirmado, criar o projeto HyperFrames e tornar o brief durável.
O brief é confirmado pela camada de intenção, não por perguntas feitas aqui. Regra de abertura, em ordem: (1) BRIEF.md existe → leia e não pergunte nada — o brief está resolvido, e seu flow/storyboard deriva o modo (brief contract § 1). (2) Nenhum BRIEF.md mas o projeto existe (hyperframes.json / STORYBOARD.md no disco) → retome do frontmatter do storyboard e das preferências registradas; nunca reinterrogue um projeto meio construído. (3) Nenhum dos dois — uma solicitação de criação nova que chegou aqui diretamente → leia /hyperframes e execute sua camada de intenção (references/intent-interview.md): ela verifica receitas e padrões lembrados, realiza as perguntas desta rota (../hyperframes/references/routes/faceless-explainer.md) e devolve o brief bloqueado. Solicitações de edição pulam tudo isso — vá fazer a edição.
Inicialize apenas se hyperframes.json estiver faltando. Nomeie <projeto> a partir do tópico em kebab-case, como compound-interest-explained; nunca use nome do espaço de trabalho ou timestamp.
npx hyperframes init "videos/<projeto>" --non-interactive --example=blank --skill=faceless-explainer — init verifica as skills instaladas contra as mais recentes no GitHub e atualiza o conjunto global se alguma estiver desatualizada.
Após a inicialização, defina <PROJECT_ROOT> como videos/<projeto> e execute cada comando de caminho relativo subsequente com esse diretório como diretório de trabalho. Nos comandos abaixo, . significa <PROJECT_ROOT>; nunca escreva .media, capture ou arquivos de saída no diretório do chamador.
Escreva BRIEF.md imediatamente após a inicialização (nunca antes — init recusa um diretório não vazio): o brief bloqueado da camada de intenção, formato conforme ../hyperframes-core/references/brief-format.md. Resolva <MEDIA_DIR> como o diretório da skill /media-use instalada. Em seguida, registre cada resposta baseada em preferência com node <MEDIA_DIR>/scripts/prefs.mjs record --hyperframes . (brief-format.md nomeia o subconjunto). Se a camada de intenção adotou uma receita, execute node <MEDIA_DIR>/scripts/recipe.mjs use --hyperframes . --name <nome>; ela copia seu frame.md para o projeto (a Etapa 2 é então pulada) e retorna os esboços a partir dos quais a Etapa 3 rascunha. Uma receita preenche respostas, não aprovações; os portões de revisão ainda são executados.
Mostre o status de login antes de prosseguir após a Configuração — execute npx hyperframes auth status e transmita sua saída literalmente. Ele informa se a voz/BGM usará a HeyGen ou mecanismos locais e, quando desconectado, como fazer login. Aplique um ramo:
- Colaborativo: aguarde o usuário fazer login ou escolher explicitamente
offline/go. - Autônomo: informe o status e continue através dos mecanismos locais disponíveis.
Não omita silenciosamente uma capacidade necessária quando nenhum provedor offline existir; torne o bloqueador visível. Não incorpore esta decisão em outra pergunta nem escreva chaves em um .env por repositório. Propriedade de autenticação e fallbacks offline: /media-use references/setup-providers.md § Provedores.
Portão: hyperframes.json e BRIEF.md existem; as respostas baseadas em preferência foram registradas (brief contract § 2); o status de login foi mostrado (logado ou continuando offline).
Etapa 1: Brief (sem captura)
Objetivo: Incorporar o texto do usuário no projeto como fonte de informação. Não há captura de site e nem ativos reais — este é um explicador sem rosto.
Salve a entrada completa do usuário literalmente e, em seguida, crie o pacote de captura sintético manualmente:
capture/extracted/visible-text.txt— o artigo / notas / tópico / resumo completo, literalmente. Esta é a fonte de informação, não um modelo de história (a Etapa 3 o remodela).capture/extracted/tokens.json—{ "title": "", "description": "", "colors": [], "fonts": [] }. Preenchatitle/descriptiona partir do brief. Deixecolors/fontsvazios, a menos que o usuário tenha explicitamente fornecido cores ou fontes da marca — nesse caso, adicione-os (o preset de design fornece uma paleta completa independentemente).
Se o usuário colou um script ou quer que suas palavras sejam mantidas, salve-o literalmente como user_script.txt; VO_MODE (literal ou reestruturado) vem do BRIEF.md — a camada de intenção pergunta isso quando um script chega. Pergunte uma vez aqui apenas se o brief de alguma forma não o tiver, e armazene a resposta para a Etapa 3.
Não execute npx hyperframes capture (não há URL). Não crie asset-descriptions.md nem preencha capture/assets/ — os visuais sem rosto são inventados nas Etapas 4-5, não capturados. A única exceção: se o usuário forneceu uma imagem real, coloque-a em public/<nome_base> e anote-a para a Etapa 3.
Portão: capture/extracted/visible-text.txt e capture/extracted/tokens.json existem; você pode declarar o tópico e o público do explicador em uma frase clara.
Etapa 2: Sistema de Design
Objetivo: Escolher um preset de quadro fornecido; um script o transforma no frame.md + skin de legenda deste vídeo.
Quando BRIEF.md nomeia um style_preset — o usuário o escolheu visualmente nas vitrines da camada de intenção — use-o; a decisão é sua apenas quando o brief é silencioso. Então você faz a única chamada — qual preset: leia ../hyperframes-creative/references/design-spec.md e navegue por ../hyperframes-creative/frame-presets/; escolha o preset cuja aparência melhor se adequa ao tópico, tom e público. Em seguida, execute:
node <SKILL_DIR>/scripts/build-frame.mjs --preset <nome> --hyperframes .
O script faz o resto deterministicamente: copia o FRAME.md do preset → frame.md e remixa com quaisquer tokens de marca em capture/extracted/tokens.json (cores da marca mapeadas nas chaves de cores do preset por função; as fontes de exibição + corpo do preset trocadas pelas da marca), copia a skin de legenda do preset para .hyperframes/caption-skin.html e se autovalida (sai com código 1 em mapeamento quebrado). Prossiga assim que sair com código 0 — sem edição manual da especificação.
Um explicador sem rosto geralmente não tem cores/fontes de marca (tokens.json colors/fonts vazios) → o script mantém a própria paleta do preset, um design completo e pronto para uso. Apenas quando o usuário nomeou cores/fontes da marca, adicione-as ao tokens.json antes de executar e ajuste frame.md manualmente depois, apenas se um mapeamento realmente precisar.
Portão: build-frame.mjs saiu com código 0 — frame.md existe de um preset nomeado e (quando o preset fornece um) .hyperframes/caption-skin.html existe como a fonte da skin de legenda; o preset escolhido foi registrado como preferência (--key style_preset --workflow <este workflow>, brief contract § 2).
Etapa 3: Storyboard e Script
Objetivo: Transformar o texto em um plano de ensino quadro a quadro aprovado.
Leia ../hyperframes-creative/references/story-spine.md (linguagem de gancho, valor antes da evidência, storyboard como proposta, visuais rastreáveis por fonte), references/story-design.md, ../hyperframes-animation/blueprints-index.md, ../hyperframes-core/references/storyboard-format.md e ../hyperframes-core/references/script-format.md. Use-os para escrever STORYBOARD.md e, quando a narração for necessária, SCRIPT.md. Defina o duration: do frontmatter a partir do length do brief — uma expectativa aproximada; a montagem relata onde o corte final fica em relação a ele.
Use story-design.md para a estrutura do explicador (conceito / tutorial / listicle / história), estratégia de gancho, técnicas de clareza, batidas emocionais, o mapeamento tipo-enum e VO_MODE. A sequência do vídeo vem do design narrativo, não da ordem dos parágrafos do texto de entrada — reordene, mescle, omita, comprima. Como um guia suave, consulte o menu papel→blueprint em ../hyperframes-animation/blueprints-index.md: para cada batida, escreva a narração na forma que seu blueprint candidato implica e marque esse candidato com o id blueprint: quando um se encaixa. A verdade do ensino ainda decide quais batidas existem — nunca force uma batida a se encaixar em um blueprint e nunca invente uma batida apenas porque uma forma comprovada está disponível. Os visuais sem rosto são inventados downstream, então os quadros não carregam um inventário de ativos: deixe asset_candidates vazio a menos que o usuário tenha fornecido uma imagem real public/<nome_base>. Use os campos exatos necessários das referências de storyboard e script.
Após o rascunho, execute a passagem de plano do loop de revisão — ../hyperframes-core/references/review-loop.md § 1: abra o quadro (não pergunte se deve), apresente o plano como proposta e faça as duas perguntas — aprovar ou alterar, e esboços primeiro (recomendado) ou pular. O feedback passa pelo chat ou pelo arquivo de comentários do quadro até a aprovação. Este é um portão de checkpoint (brief contract § 1): em modo autônomo não há quadro e nada a perguntar — publique o mesmo resumo como um aviso e prossiga; os esboços são incorporados à construção, e a única pergunta de pré-visualização vem na Etapa 6.
Portão: STORYBOARD.md existe, cada quadro tem os campos narrativos necessários, SCRIPT.md existe quando a narração é necessária e o usuário aprovou o plano quadro a quadro (autônomo: o resumo foi publicado como um aviso).
Etapa 3.1: Áudio
Objetivo: Gerar narração, temporizações de palavras, música e metadados de áudio a partir do script aprovado.
Inicie o áudio após a aprovação da Etapa 3. Execute-o em segundo plano e depois continue para a Etapa 4. (O status de login já foi mostrado na Etapa 0; o mecanismo cai para fallback automaticamente.)
Escolha a voz da narração a partir da solicitação do usuário antes de invocar. Se a solicitação nomeou uma voz, gênero ou tom, escolha um id de voz correspondente e passe-o com --voice <id>. O padrão do pipeline é, caso contrário, Marcia (feminina) na HeyGen / am_michael no Kokoro — então uma solicitação como "uma voz masculina" é silenciosamente ignorada a menos que você passe a flag. Os ids de voz são específicos do provedor; resolva contra o provedor que o status de login da Etapa 0 selecionou: HeyGen (logado) via node <MEDIA_DIR>/audio/scripts/heygen-tts.mjs --list (ou GET /v3/voices?engine=starfish); Kokoro (offline) via a tabela de vozes em <MEDIA_DIR>/audio/references/tts.md (prefixos am_/bm_ masculino, af_/bf_ feminino). Quando o usuário não expressou preferência, recorra à voz lembrada (brief contract § 2) antes do padrão do pipeline e informe qual você usou; omita --voice apenas quando nenhum dos dois nomeia uma. Quando o usuário escolheu explicitamente uma voz nesta execução, registre-a (prefs.mjs record --key voice).
node <SKILL_DIR>/scripts/audio.mjs --script ./SCRIPT.md --storyboard ./STORYBOARD.md --hyperframes . --out ./audio_meta.json --voice <voice-id> &
O script de áudio lida com narração, temporizações de palavras, consulta de BGM na biblioteca de música da HeyGen e metadados de temporização. O humor do BGM vem do campo music: do storyboard. Isso usa a API de Áudio da HeyGen para recuperação, não geração, e a mesma credencial ~/.heygen do TTS. Para detalhes do provedor, leia ../media-use/audio/references/tts.md.
Se não houver narração e nenhum SCRIPT.md, pule a geração de voz. O BGM ainda pode ser executado se o storyboard tiver um humor musical.
O marcador canônico de silêncio total (compartilhado entre os fluxos de trabalho que reutilizam este modelo de áudio): music: none no bloco YAML superior do STORYBOARD.md e nenhum SCRIPT.md. Essa combinação marca o projeto como silencioso — sem narração, sem BGM, sem SFX. O audio.mjs o reconhece e não gera nada (ele remove qualquer audio_meta.json obsoleto; um audio_meta.json ausente é o que a montagem trata como silencioso), então esta etapa é um simples pulo. music: none com narração mantém o TTS e desativa apenas o BGM. Use exatamente esta grafia — não improvise outros marcadores.
Portão: O trabalho de áudio foi iniciado ou o projeto está marcado como silencioso (music: none + nenhum SCRIPT.md).
Etapa 4: Design Visual dos Quadros
Objetivo: Adicionar a direção visual, intenção de layout e escolhas de movimento a cada quadro do storyboard.
Esboce o quadro primeiro (apenas colaborativo). Assim que o plano for aprovado, execute a passagem de esboço — ../hyperframes-core/references/review-loop.md § 2 (não espere pela Etapa 3.1; os esboços não usam temporizações):
...