# Skill Aula Imagens

> Gera um ativo visual solicitado para a landing page com o gerador de imagens embutido do ChatGPT/Codex, seguindo o DESIGN.md e salvando o arquivo no projeto. Use somente quando o usuário invocar $skill-aula-imagens. Não cria direção visual, não redesenha a página e não gera lotes não solicitados.

- Skill: `nitroxinteligence/skill-aula-imagens` (Agent Skill, multi-file: 5 files)
- Install (CLI): `npx skillmds@latest add nitroxinteligence/skill-aula-imagens`
- Raw SKILL.md: https://api.skillmd.com/api/skills/nitroxinteligence/skill-aula-imagens/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: nitroxinteligence (https://skillmd.com/u/nitroxinteligence)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/nitroxinteligence/skill-aula-imagens

---


# Skill Aula Imagens

Crie a imagem pedida pelo usuário e entregue um arquivo utilizável pelo site. Não pare na escrita de um prompt.

## Escopo

Esta skill é apropriada para fotografia, ilustração, mockup de produto digital, capa, textura, fundo, recorte ou imagem social. Não a use para:

- redesenhar a landing page;
- gerar um comp visual de cada seção;
- fabricar screenshot de um produto que deveria ser real;
- inventar logos de clientes, gráficos, dados ou provas;
- substituir ícones e vetores que devem vir de uma biblioteca ou arquivo SVG real;
- criar um logo final como único master da marca.

## Preparação

1. Leia `references/contrato-projeto.md`.
2. Leia `DESIGN.md`, `.aula-site/design.md`, `.aula-site/wireframe.md`, `.aula-site/copy.md` e `.aula-site/imagens.md` quando existirem.
3. Inspecione o slot e o componente de destino se o usuário indicou uma seção.
4. Identifique o que o usuário já informou: uso, assunto, estilo, composição, proporção, referências e restrições.
5. Faça no máximo uma pergunta curta somente quando uma lacuna impedir um resultado correto. Caso contrário, infira do projeto e prossiga.

## Geração

Leia `references/prompt-e-qualidade.md`.

1. Estruture internamente o pedido em: uso, cena, sujeito, composição, proporção, safe area, estilo, luz, paleta, materiais, referências, texto exato e itens a evitar.
2. Use o gerador de imagens embutido disponível no ChatGPT/Codex, preferencialmente pela skill de sistema `$imagegen` quando ela estiver disponível.
3. Use a experiência atual do ChatGPT Images 2.5. Não peça chave de API para o caminho normal e não troque silenciosamente para um script de API.
4. Gere somente o ativo solicitado. Variações ou ativos adicionais exigem pedido explícito.
5. Inspecione o resultado: mensagem, anatomia, artefatos, texto acidental, logos indevidos, crop, safe area, coerência com a direção e legibilidade no slot.
6. Faça uma única iteração direcionada quando houver um defeito claro. Em edição, mude uma coisa por vez e repita o que deve permanecer.

## Salvamento

Leia `references/handoff-vite.md`.

- Preserve o arquivo original gerado em `.aula-site/image-sources/`.
- Para imagem usada por componente React, salve a versão final em `src/assets/images/` com nome semântico em kebab-case.
- Use `public/` apenas quando o nome e a URL precisarem ser fixos, como favicon, Open Graph ou arquivo referenciado fora do grafo do Vite.
- Nunca sobrescreva silenciosamente. Crie `-v2`, `-v3` ou outro sufixo.
- Não deixe um ativo consumido pelo site apenas na pasta padrão de imagens geradas do Codex.
- Não altere o código por padrão. Quando o usuário pedir “crie e insira”, atualize somente o slot correspondente e preserve o restante da página.

## Manifesto

Crie ou atualize `.aula-site/imagens.md` com:

- id do ativo e seção;
- objetivo;
- ferramenta e data;
- resumo do prompt final;
- referências usadas;
- caminho da fonte e do derivado;
- dimensões, proporção, formato e bytes;
- safe area, foco e `object-position` sugerido;
- texto alternativo ou indicação de decorativa;
- componente consumidor;
- status: gerado, integrado, aprovado ou pendente.

Marque `images` como `complete` quando os ativos explicitamente pedidos estiverem prontos. Não marque todos os slots como completos por inferência.

## Entrega

Informe:

1. uma frase sobre o ativo criado;
2. o caminho final no projeto;
3. a proporção e o uso previsto;
4. o prompt final resumido;
5. se o ativo foi somente criado ou também inserido.

Próximo comando padrão:

```text
$skill-aula-site-completo Continue, integre os ativos aprovados e execute o site localmente.
```

