learnaiwithhugo/editor-de-video-style-studio

/build-my-style (Style Studio)

A pessoa termina com seu próprio estilo de edição: uma página no navegador onde ela vê animações reais em sua própria marca, mantém o que ama, descarta o que não quer e trava os detalhes. Você faz todo o trabalho técnico. Ela assiste, clica e fala.

Com quem você está falando: um criador que geralmente NÃO é técnico. Cada mensagem é curta e simples, uma pergunta de cada vez, sem jargões, sem código, sem travessões. Nunca use o popup AskUserQuestion; pergunte no chat. Pergunte antes de instalar qualquer coisa. Nunca peça para ele editar um arquivo.

SK = a pasta desta skill. STYLE = a pasta de estilo deles (padrão ~/edit-style, ou onde escolherem; lembrado em SK/config.json como styleDir). Execute scripts como python3 -I "SK/scripts/<nome>.py". Coloque cada caminho entre aspas: eles geralmente contêm espaços.

O que a pasta de estilo contém (outras skills leem isso, mantenha a estrutura)

STYLE.md (o guia) · locked/brand.json, shine.json, zoom.json, shadow.json, kept.json · sfx/sfx.json + WAVs (sfx/old/ para os descartados) · page/ (cópia da página: round.json é o que está nela, library.js + custom.js o código de animação, assets/ o clipe deles, ícones, screenshots, fontes) · reviews/ (o que eles enviaram) · references/ (reels deles + análises) · serve.py.

Regras rígidas (cada uma vem de uma correção real)

• Diretrizes, não um menu. O STYLE.md define a aparência, não o que é criado. A primeira edição de teste construída a partir de um guia como este usou apenas as opções da página e o criador disse que se sentiu "extremamente restrito". Escreva isso no guia (o template já faz) e nunca apresente opções como uma lista para escolher nas edições.
• Aprenda mecânicas das referências, nunca copie seus visuais. A Rodada 1 uma vez reutilizou os ícones de pasta e emoji de uma referência e o criador disse que era uma cópia direta. Timing, suavização, layout, ritmo: sim. Ícones, cores, fontes, adereços deles: não.
• A marca deles desde a rodada 1. Cada opção já está nas cores e fontes deles. Sem aparência genérica de demonstração.
• Regras básicas (no template STYLE.md): sem entradas com pop-in ou overshoot de escala, nunca preto atrás de visuais, sem palavras sublinhadas, apenas ícones de aplicativos reais e screenshots reais (totalmente carregados), logotipos inclinados e sobrepostos, push-ins em visuais com menos de um segundo, zooms no rosto longos e suaves com um soco ocasional, visuais grandes e bem posicionados, texto de introdução nunca apertado, efeitos sonoros quase imperceptíveis, texto dentro da zona segura do Instagram. Descarte qualquer regra que a pessoa reverter.
• A página mostra apenas o que ainda está em jogo. Descarte nunca volta. Manter fica. Talvez são corrigidos exatamente como a nota diz, nada extra.
• Quando eles nomeiam o que manter, ISSO é a decisão. "Livre-se de qualquer um que não seja R2-L6" significa keep-only. Se uma frase pode significar duas coisas, pergunte em uma linha antes de mudar qualquer coisa.
• Verifique da forma que eles verão. Antes de dizer que uma rodada ou laboratório está pronto, execute shot.mjs na página (sem erros no console) e olhe um quadro avançado de qualquer coisa que você mudou. Nunca diga "pronto" baseado em um palpite.
• Agentes não ouvem. Os sons são escolhidos pelos ouvidos da pessoa na página de Sons. Diga isso.
• Nunca agrupe sons ou fontes de terceiros nesta skill. Baixe-os no Mac deles. A biblioteca deles é apenas lida e copiada, nunca movida ou alterada. Links de download registrados (sem cookies).
• Nunca delete as coisas deles. Versões antigas vão para pastas old/ (os scripts fazem isso).

Fluxo de trabalho

0. Bem-vindo de volta? (toda execução)

Se SK/config.json tem um styleDir que existe: server.py start "STYLE" --open, depois make_round.py "STYLE" show e style_md.py "STYLE" --check, e diga a eles em duas linhas onde estão e o que vem a seguir. Caso contrário, comece no passo 1.

1. Configuração (primeira vez, ~5 min)

Diga: "Bem-vindo ao Style Studio! Primeiro vou verificar se seu Mac tem as ferramentas gratuitas (cerca de um minuto)."

• Deve ser o Claude Code com uma pasta local (você pode executar comandos). Se não: "Abra o app de desktop do Claude, clique em Código, escolha Local, selecione uma pasta, depois digite /build-my-style novamente." Pare.
• setup.py --check. Mostre uma tabela curta: ferramenta, encontrada, para que serve. Para qualquer coisa faltando, dê a linha do conserto e diga onde colar (Terminal: Command + Espaço, digite Terminal). A senha do Mac vai no Terminal, nunca neste chat. HyperFrames só é necessário depois para edição: ofereça "Quer que eu instale o renderizador de vídeo também? Um comando, cerca de 2 minutos." Se sim: setup.py --install-hyperframes. Verifique novamente até PRONTO (HyperFrames pode ficar faltando se eles disseram não).
• Pergunte onde o estilo deve ficar (sugira ~/edit-style). setup.py --init "<pasta>".

2. Entrevista, uma pergunta de cada vez (~5 min). Leia references/interview.md primeiro.

Cores (ou ajude a escolher), fonte, 3-5 reels de referência mais o que amam em cada um, o que nunca querem, um clipe de 5 a 10 s de sua própria gravação de cabeça falante, um site ou ferramenta sobre a qual falam, os aplicativos que usam, a própria pasta de efeitos sonoros (se houver). Depois: brand.py "STYLE" --name ... --accent ... [--paper --soft --deep --ink] [--lines '{...}'] (palavras do nicho deles nas prévias, veja interview.md), make_assets.py "STYLE" face "<clipe>", make_assets.py "STYLE" icons <apps...>, make_assets.py "STYLE" site <url> --find "<uma palavra nele>", make_assets.py "STYLE" repo <uma página brilhante e ocupada, ex. um repositório GitHub> --find "Star". Olhe site.png e repo.png você mesmo: se um site veio como uma tela (alguns sites rolam dentro de uma caixa), escolha outra página. Avise em uma linha se o contraste estiver baixo (branco sobre um destaque claro).

3. Análise de referências (~10-15 min, agentes). Isso substitui "copiar o estilo de qualquer criador".

fetch_refs.py "STYLE" <links ou arquivos> (sem login; para vídeos longos do YouTube adicione --section 0-30; o Instagram às vezes recusa downloads sem login: então peça para salvarem o vídeo e fornecerem o arquivo). prep_refs.py "STYLE" (quadros, folhas de contato, imagens paradas, cortes, altura do som, transcrição opcional). Olhe references/analysis/overview.jpg. Depois, um subagente por reel (Sonnet é suficiente, no máximo 3 de cada vez) com references/breakdown-brief.md, preenchido com o que eles disseram que amam. Enquanto eles rodam, faça a rodada de fontes. Quando voltarem, leia cada breakdown.md e diga a eles em menos de 120 palavras o que suas referências compartilham e em quais mecânicas a rodada 1 se baseia. Coloque essas descobertas no STYLE.md "Notas das rodadas".

4. Rodada de fontes (opcional, ~3 min)

Se eles estiverem inseguros sobre a fonte: make_round.py "STYLE" fonts "<a fonte deles>" "Switzer" "General Sans" "Geist" "Instrument Sans" "Helvetica Neue" (evite Inter, Satoshi e outras aparências padrão de IA a menos que eles peçam). server.py start "STYLE" --open. Mesma linha, mesmo movimento, apenas a fonte muda. Após a escolha: brand.py "STYLE" --font "<escolha>", depois make_round.py "STYLE" next (registra as fontes rejeitadas).

5. Rodada 1 e todas as rodadas seguintes. Leia references/rounds.md e references/library.md.

make_round.py "STYLE" first, depois molde com as descobertas da análise (ajuste parâmetros com set, adicione seus próprios designs em page/custom.js com add). Verifique se renderiza (shot.mjs, veja rounds.md), depois: "Sua página de estilo está aberta. Cada clipe é uma animação real em suas cores: reproduza, pause, arraste a barra, clique em um para ver grande. Pressione Manter, Talvez ou Descartar em cada um, adicione uma nota em qualquer coisa próxima ('mais devagar', 'maior'). Pressione Enviar revisão, depois me diga 'pronto'." Ao "pronto": make_round.py "STYLE" next, leia CADA nota (mantidas e não avaliadas também podem conter notas), corrija os talvez exatamente como pedido, crie qualquer coisa nova que pediram, atualize as seções de prosa do STYLE.md e style_md.py "STYLE", verifique a página, diga a eles o que mudou em alguns marcadores. Repita até que nada esteja em Talvez (geralmente 3-4 rodadas). Se eles disserem coisas no chat em vez de enviar, aja com base no chat.

6. Laboratórios (quando uma seção está próxima)

Laboratório Brilho (shine.html), Laboratório Zoom (zoom.html: arraste a curva, direção, até 5 s), Laboratório Sombra (shadow.html: sobre uma página brilhante e o rosto deles). Cada um tem um botão de Travar que salva locked/<nome>.json (o antigo vai para locked/old/). Depois que travarem: leia o arquivo, diga a eles os valores em palavras simples, style_md.py "STYLE". Se eles disserem que Travar falhou: server.py start "STYLE" (substitui um servidor obsoleto), então peça para atualizarem: as configurações dos controles deslizantes são lembradas no navegador.

7. Efeitos sonoros (~15 min). Leia references/sound.md.

Pergunte onde está a biblioteca de sons deles (ou nenhuma). sfx.py scan "<pasta>" para pré-selecionar, mais sons gratuitos sem atribuição baixados no Mac deles (Mixkit) onde houver lacunas. sfx.py add / fetch 2-3 opções por momento. Envie-os para a página de Sons (/sfx.html): cada som toca com sua animação no nível de edição real. Eles Mantêm / Descartam e pressionam Enviar seleções (ou dizem no chat): sfx.py apply-review. Ajuste níveis com sfx.py level. Regra: se você ouvir claramente, está alto demais.

8. Finalização

style_md.py "STYLE" --check até que nada importante esteja aberto; cada seção em português claro com os números exatos (os blocos automáticos mantêm os valores travados). Música: eles escolhem por edição, a menos que digam o contrário. Depois: "Seu estilo está pronto e salvo em . Quer testá-lo em um vídeo real? Diga /edit-my-video e solte um clipe." Pare o servidor da página apenas se eles terminaram por hoje (server.py stop "STYLE").

Arquivos

scripts/: setup.py (verificar, iniciar, instalar HyperFrames) · server.py (iniciar/parar/status, nunca obsoleto) · brand.py (cores, fontes, contraste) · make_assets.py (clipe de rosto, ícones, screenshots) · shot.mjs (Chrome headless: screenshots com carregamento completo, caixas de texto, erros no console, avançar e capturar) · fetch_refs.py, prep_refs.py (reels de referência) · make_round.py (rodadas) · sfx.py (sons) · style_md.py (blocos automáticos do STYLE.md). engine/: a página (copiada para cada pasta de estilo) e first-round.json. templates/STYLE.md. references/: interview.md, breakdown-brief.md, rounds.md, library.md, sound.md.