MÓDULO 2.6

🔀 Variações: pedir 5 em vez de 3

A escada de variação default (3), como forçar mais opções, nomear axis explicitamente, usar design_canvas para comparação, e variantes como Tweaks.

6
Tópicos
30
Minutos
Inter.
Nível
Técnica
Tipo

🪜 A escada de variação: do safe ao novel

Conservador Ousado V1 Safe V2 V3 V4 V5 Novel by-the-book DS + twist balanced arrojado experimento "Start safe, progress novel"
1

🪜 Default: 3 variações (safe/balanced/novel)

System prompt: "Try to give 3+ variations across several dimensions. Start your variations basic and get more advanced and creative as you go."

O que Claude faz por padrão

  • V1 Safe: aplica DS à risca, sem liberdade criativa
  • V2 Balanced: DS + pequenas decisões próprias
  • V3 Novel: ousadia controlada, experimenta 1-2 elementos
2

🎯 Pedir N variações explicitamente

Quer 5, 6 ou 7? Fale. User prompt > system prompt. Sem pedido explícito, você nunca recebe mais de 3.

"Me dê 6 variações desta landing.
Start safe (V1 = by-the-book do meu DS),
progress novel (V6 = experimento arrojado)."
3

📊 Axis de variação nomeados

Sem axis, Claude varia coisas aleatórias — algumas relevantes, outras não. Nomear os eixos foca a exploração.

✗ Sem axis

"Me dê 5 variações"

Claude varia aleatoriamente — cor aqui, tipo ali, layout acolá. Difícil comparar.

✓ Com axis

"Me dê 6 variações:
- 2 de paleta (quente vs frio)
- 2 de tipografia (serif vs sans)
- 2 de densidade (arejado vs compacto)"

Ortogonal — você sabe exatamente o que está comparando.

4

🎪 "Start safe, progress novel" — a ordem importa

V1 conservador ancora o tom. V6 ousado mostra a fronteira. Sua decisão fica fácil: escolhe o ponto da curva que te agrada.

💡 Hack

Se você é do tipo "quero ver tudo possível", peça 5-7 variações. Se é pragmático, 3 bastam. Se está apresentando a cliente, 3 — cliente-com-paradoxo-da-escolha rejeita 5+.

5

🖼️ design_canvas.jsx para apresentar

Para comparar variações estáticas lado a lado, use o starter design_canvas.jsx. Grid rotulado com N células. Otimizado para decisão.

Prompt de uso

"Gere 6 variações em design_canvas.jsx.
 Cada célula labelled V1, V2... V6.
 Subtítulos com axis explorado em cada."
6

🔄 Variações como Tweaks (alternar ao vivo)

Para variantes de um único elemento dentro do design (ex: 2 estilos de hero, 3 tipos de CTA, A/B de copy), exponha como Tweak — alternar ao vivo > multiplicar telas.

Decisão

Variar…Como expor
Landing inteira (estilos distintos)design_canvas grid
Hero (2 layouts, mesmo estilo)Tweak variant
CTA (3 textos diferentes)Tweak text
Tema completo (dark/light/warm)Tweak theme

Resumo do Módulo

Default é 3 — safe/balanced/novel.
Peça N explícito — user prompt sempre ganha.
Axis nomeados — cor, tipo, layout, motion. Ortogonal > aleatório.
Safe → novel — ordem progressiva facilita decisão.
design_canvas.jsx — grid rotulado para apresentar comparação.
Variantes de elemento — expose como Tweak, não multiplique telas.

Próximo Módulo:

2.7 — 🧩 Múltiplos design systems