# Vídeo de produto (v2)

Um comercial de lançamento vertical de 15 a 20 s com a energia de um anúncio da Apple ou da Beats: cortes a cada 2 ou 3 s,
câmera que nunca para, o produto girando, zoom em detalhe com seta e cartão explicando, pessoas usando o produto em lugares e
luzes diferentes, interface de celular realista e o nome da marca fechando. Sem narração: quem conduz é o ritmo da trilha,
com batida, e os efeitos analógicos (whoosh, clique, pop) marcando cada corte.

## Quando usar

- Lançamento de produto físico (fone, relógio, garrafa, cosmético, eletrônico, livro) para Reels, Shorts, anúncio e site.
- Quando o produto tem de dois a quatro diferenciais que dá para mostrar (um detalhe, um número, um uso).
- Com uma foto só do produto: os outros ângulos e as cenas de uso são gerados no GPT Image a partir dela.
- Com modelo 3D do produto: ele entra no lugar do giro falso (ver a regra 4).

## Quando não usar

- Software ou serviço que precisa ser explicado tela a tela: use a apresentação de software.
- Quando só existe uma foto e não pode gerar outras imagens (marca que proíbe imagem gerada): o estilo depende de variedade de cenas.
- Mais de quatro diferenciais: escolha os quatro mais fortes e deixe o resto para a legenda.

## Etapa 0 - Briefing do produto (obrigatória, antes de planejar)

Antes de planejar qualquer cena, o Claude manda **uma mensagem só**, com perguntas curtas e numeradas, e espera a resposta:

1. **O produto:** o que é e para quem é?
2. **Diferenciais:** quais são os 3 principais? (com número, se tiver: "40 h de bateria", "250 g")
3. **Uso:** como e onde a pessoa usa? (a cena de uso: metrô, academia, escritório, cozinha...)
4. **Imagens:** que fotos ou vídeos reais existem? Posso gerar outros ângulos e cenas com pessoas no GPT Image?
5. **Marca:** cores, fonte, tom (sério, divertido, premium) e uma marca que você admira como referência.
6. **Formato:** duração e onde vai rodar (Reels, anúncio, site, vitrine)?
7. **Chamada final:** o que a pessoa deve fazer no fim? ("Pré-venda aberta", "Compre no site", "Link na bio")

Com as respostas, a direção sai assim:

| Resposta | Vira |
| --- | --- |
| Diferenciais | uma cena de destaque para cada um (detalhe com seta e cartão, número contando, interface) |
| Uso | uma ou duas cenas com pessoas usando, em lugares e luzes diferentes |
| Imagens | a lista de assets a gerar: recortes com fundo transparente, ângulos, macros, cenas de uso |
| Marca | paleta, fonte e o cenário do fecho; a referência vira ritmo e tipo de movimento |
| Formato | duração total, número de cenas (uma a cada 2 a 3 s) e as zonas seguras |
| Chamada final | o botão da última cena |

O Claude devolve então o **plano de cenas** (uma linha por cena: tempo, imagem, movimento, texto, interface, transição) antes de
produzir. Se a pessoa disser "faz direto", ele preenche o briefing com suposições razoáveis e lista quais foram, junto do plano.

## A receita (estrutura padrão de 18 s)

| Cena | Tempo | O que acontece |
| --- | --- | --- |
| Gancho | 0 - 2,4 s | o problema que o produto resolve, em movimento (ex.: palavras de barulho voando em volta de quem usa o fone, e sendo sugadas até "Silêncio.") |
| Revelação | 2,4 - 5 s | o produto entra com impacto e gira (três recortes trocando com compressão horizontal, ou o modelo 3D) com uma faixa de luz passando |
| Diferencial 1 | 5 - 8 s | macro do detalhe, câmera indo de lado a lado, ponto pulsando, seta se desenhando até um cartão com interface (toggle, medidor) |
| Diferencial 2 | 8 - 10,8 s | pessoa usando, luz diferente, widget realista com número contando |
| Diferencial 3 | 10,8 - 13,4 s | outro macro ou outro uso, com chips de informação |
| Uso + interface | 13,4 - 15,4 s | pessoa em outro cenário, interface de celular (pareamento, compra, app) |
| Fecho | 15,4 - 18 s | produto no cenário da marca, nome com o espaçamento fechando, frase curta e o botão da chamada final |

## Tokens

| Token | Valor | Uso |
| --- | --- | --- |
| Fonte | Inter 400, 600 e 800 (ou a fonte da marca) | tudo |
| Título de impacto | 132 px, 800, espaçamento -0,035em, entra palavra a palavra | "Silêncio.", "40 horas de música." |
| Título de cartão | 46 px, 600 | "Cancelamento ativo de ruído" |
| Número grande | 150 px, 800, `tabular-nums`, sempre contando | "78 dB" caindo para "12 dB", "0" a "40 h" |
| Acento | a cor da marca (no exemplo, `#4C8DFF`) | toggle ligado, anel, barra, check, botão |
| Vidro escuro | `rgba(18,18,22,.72)` + `backdrop-filter: blur(24px)`, borda branca 14%, raio 36 px | cartões sobre foto escura |
| Vidro claro | `rgba(255,255,255,.82)` + `backdrop-filter: blur(24px)`, raio 36 px | widgets e chips sobre foto clara |
| Fundo do fecho | gradiente da marca andando (no exemplo, `#CFE2FF` a `#4C8DFF`, com nuvens em CSS) | última cena |

```json
{
  "quadro": { "largura": 1080, "altura": 1920, "fps": 30 },
  "fonte": { "familia": "Inter", "pesos": [400, 600, 800], "impacto": 132, "cartao": 46, "numero": 150, "apoio": 34 },
  "cores": { "acento": "#4C8DFF", "carvao": "#1D1D1F", "alerta": "#FF5A4E", "ceu": ["#CFE2FF", "#7FB0FF", "#4C8DFF"] },
  "ritmo": { "cenaMin": 2.0, "cenaMax": 3.0, "paradoMax": 2.0, "duracaoTotal": 18 },
  "cenas": [
    { "id": "gancho", "inicio": 0, "dura": 2.4, "saida": "flash" },
    { "id": "revelacao", "inicio": 2.4, "dura": 2.6, "entrada": "flash", "saida": "zoom" },
    { "id": "diferencial1", "inicio": 5.0, "dura": 3.0, "entrada": "zoom", "saida": "whip" },
    { "id": "diferencial2", "inicio": 8.0, "dura": 2.8, "entrada": "whip", "saida": "whip" },
    { "id": "diferencial3", "inicio": 10.8, "dura": 2.6, "entrada": "whip", "saida": "whip" },
    { "id": "uso", "inicio": 13.4, "dura": 2.0, "entrada": "whip", "saida": "flash" },
    { "id": "fecho", "inicio": 15.4, "dura": 2.6, "entrada": "flash" }
  ],
  "transicoes": {
    "whip": "palco x 0 -> -220 com blur 0 -> 28 px nos ultimos 0,25 s; a seguinte entra de x 220 com blur 28 -> 0",
    "zoom": "palco escala 1 -> 1,6 com blur ate 24 px; a seguinte entra de escala 0,7",
    "flash": "branco cobre o quadro em 0,15 s e some em 0,25 s na cena seguinte"
  },
  "curvas": { "camera": "sine.inOut ou power1.inOut, cena inteira", "entrada": "power3.out ou back.out(1.4), 0,35 a 0,5 s" }
}
```

## Regras

1. **Etapa 0 primeiro.** Sem o briefing (ou as suposições declaradas), não existe plano de cenas.
2. **Nada parado mais de 2 s.** A câmera de cada cena anda do primeiro ao último quadro (escala e deslocamento), e o que fica na
   tela continua vivo: contador rodando, anel enchendo, chip flutuando, faixa de luz passando.
3. **Um corte a cada 2 a 3 s, cenário e luz mudando.** Estúdio escuro, macro, luz dourada, noite com neon, céu da marca. Duas
   cenas seguidas nunca têm a mesma luz.
4. **O produto gira.** Com 3D, use o modelo. Sem 3D, gere três recortes no GPT Image (perfil, três quartos, frente) e troque um
   pelo outro comprimindo na horizontal (`scaleX` 1 -> 0,15 e o próximo abrindo 0,15 -> 1, 0,18 s cada lado): parece rotação.
5. **Zoom no detalhe, do jeito da Apple.** Um macro do detalhe que importa, com câmera de lado a lado, um ponto pulsando em cima
   dele e uma seta fina se desenhando até o cartão que explica.
6. **Pessoas usando.** Pelo menos duas cenas com gente usando o produto, em lugares diferentes. Texto nunca em cima do rosto.
7. **Interface realista e preenchida.** Toggle, widget, medidor, folha de pareamento e botão com cara de iOS, cheios de cor.
   Ícone só de contorno não vale.
8. **Número conta, não aparece.** "40 h" sobe de 0, "78 dB" desce para "12 dB". O número parado é foto; contando, é vídeo.
9. **Transições com movimento.** Whip, zoom e flash, feitas dentro das cenas (saída nos últimos 0,25 s, entrada nos primeiros
   0,25 s), sempre com um whoosh embaixo.
10. **Várias cenas, vários subagentes.** Planejamento vira um contrato (paleta, fontes, palco, tempo, entrada e saída de cada cena)
    e cada cena é feita por um subagente em paralelo. Antes do render final, uma prancha com um quadro de cada cena.
11. **Render em máquina com bastante CPU** (um servidor alugado por hora serve), cada cena separada e emendada no fim.

## Proibições

- Foto parada com aproximação lenta como única ideia do vídeo.
- Cena com mais de 3 s, ou qualquer elemento parado por mais de 2 s.
- Ícone de contorno, interface vazia, cartão sem conteúdo.
- Texto em cima do produto ou do rosto de quem usa.
- Promessa que o produto não cumpre (bateria, peso, "o melhor") e logotipo de outras marcas.
- Trilha sem batida, música com vocal.

## Som

- **Trilha com pegada**, instrumental, 110 a 125 BPM, batida limpa e graves, começando já no primeiro segundo (sem introdução lenta)
  e com um fim marcado. Gerar na ElevenLabs Music (sem problema de direito autoral).
- **Efeitos analógicos** marcando a imagem: whoosh em cada transição, impacto grave na revelação do produto, clique no toggle e no
  toque, pop no check. O som ambiente do gancho (barulho de metrô, de rua) corta seco no "Silêncio".
- **Mix final em -14 LUFS integrado, pico -1,5 dBTP**, trilha abaixando um pouco (uns 3 dB) sob os efeitos.

## Prompts dos assets

No GPT Image. Os recortes saem com fundo transparente direto no `gpt-image-1.5` (`background: transparent`, PNG), usando a foto real
como referência na edição. As cenas com pessoas e os macros saem no `gpt-image-2`, também com a foto como referência para o produto
não mudar.

**Recorte (um por ângulo: perfil, três quartos, frente)**
```
Product cutout of the exact same [produto] from the reference image (same shape, materials and details). [Ângulo: pure side
profile view | three-quarter front view | straight front view], upright. Isolated product only, fully transparent background,
no shadow, no floor, no text, no extra objects, sharp studio lighting with soft highlights, photorealistic.
```

**Cena de uso**
```
Vertical 9:16 photorealistic commercial photograph. [Pessoa, lugar e luz: a young woman in a packed subway car at rush hour,
eyes closed, serene, cool fluorescent light, blurred crowd]. She is using [produto] from the reference image. Premium tech
brand campaign look, shot on 35mm, shallow depth of field, natural skin texture, no text, no watermark.
```

**Macro do detalhe**
```
Extreme macro close-up commercial photograph of [o detalhe: the outer ear cup with a row of tiny microphone holes] of [produto]
from the reference image. Dramatic dark background, a single sharp rim light, shallow depth of field. Vertical 9:16, no text.
```

**Trilha**
```
Punchy modern tech product launch commercial track, 118 BPM, tight electronic drums with crisp claps, deep sub bass, pulsing
bright synth stabs, confident and energetic. Starts immediately with a strong beat, short accent hits every 2.5 seconds, ends
with a clean final hit and a short tail around 18 seconds. No vocals.
```

## Componente de referência

Giro falso com três recortes e faixa de luz recortada pelo próprio PNG; seta que se desenha até o cartão; número contando.

```css
#cam { position: absolute; inset: 0; }                         /* só a câmera recebe escala e deslocamento */
.recorte { position: absolute; inset: 0; background-size: contain; background-position: center; }
.luz { position: absolute; inset: 0; mix-blend-mode: screen;
  -webkit-mask-image: url("assets/c_34.png"); mask-image: url("assets/c_34.png");
  -webkit-mask-size: contain; mask-size: contain; mask-position: center; mask-repeat: no-repeat; }
.vidro { background: rgba(18,18,22,.72); backdrop-filter: blur(24px); border: 1px solid rgba(255,255,255,.14); border-radius: 36px; }
```

```js
// câmera de lado a lado durante a cena inteira
tl.fromTo('#cam', { x: 90, scale: 1.12 }, { x: -90, scale: 1.22, duration: 3, ease: 'sine.inOut' }, 0);
// giro falso: perfil -> três quartos
tl.to('#lado', { scaleX: 0.15, duration: 0.18, ease: 'power2.in' }, 0.8);
tl.fromTo('#tres-quartos', { scaleX: 0.15, opacity: 1 }, { scaleX: 1, duration: 0.18, ease: 'power2.out' }, 0.98);
// seta se desenhando até o cartão e o número contando
tl.fromTo('#seta path', { strokeDashoffset: 600 }, { strokeDashoffset: 0, duration: 0.4, ease: 'power2.out' }, 0.35);
// contador: use modifiers, não onUpdate (no render quadro a quadro o onUpdate não dispara no seek e o número trava)
const db = { v: 78 };
tl.to(db, { v: 12, duration: 1.4, ease: 'power2.inOut',
  modifiers: { v(val) { document.querySelector('#db').textContent = Math.round(val) + ' dB'; return val; } } }, 1.0);
```

## De onde vem

- **Skills que produzem:** `criacao-edicao-imagem-gpt-image` (recortes, cenas de uso e macros) e `hyperframes` (a animação), com as
  cenas em paralelo como manda a nota de vídeo com várias cenas.
- **Aula:** 4, Vídeo de produto profissional.
- **Exemplo:** `04-produto-nimbo-v2.mp4` (fone Nimbo fictício, 18 s, 7 cenas feitas em paralelo a partir de um contrato comum).
- **Pedido de exemplo:** "Usa a skill de vídeo de produto. Quero um comercial vertical de uns 18 segundos do fone de ouvido sem fio
  Nimbo, branco fosco. Gera com o GPT Image outros ângulos com fundo transparente e cenas de gente usando, e faz bem dinâmico, no
  estilo dos comerciais da Apple: zoom nos detalhes, setinhas explicando o cancelamento de ruído, a bateria de 40 horas contando e
  o nome Nimbo no final."
