Files
2026-04-25 12:37:38 +03:00

2.1 KiB

Parte 2: Frontend Design-First

← Parte 1


Agora que engenheiramos o contexto do repo, vamos ser criativos.


Tarefa 1: Deixe a Sua Cara

Plan mode para começar qualquer trabalho maior — itere no plano (2+ vezes!) com ajustes e esclarecimentos.

Passos:

  1. Mude para Plan mode
  2. Vamos fazer um redesign completo. Faça algo…
  3. Revise o plano e comece a Implementação

Ideias de Temas:

  • Minimalist Mono
  • Grotesque Type Grid
  • Retro Terminal Green
  • Vaporwave Sunset
  • Cyberpunk Neon
  • Brutalist Blocks
  • Soft Pastel Clouds
  • Skeuomorphic Stickers
  • Dark Mode Noir
  • Playful Candy Pop
  • Pixel Arcade Style
  • Scandinavian Calm
  • Corporate Clean Blue
  • Gradient Glass UI
  • Notebook Doodle Sketch
  • Space Galaxy Glow
  • Paper Card Cutouts
  • Geometric Memphis
  • Cozy Coffee Shop
  • Metallic Chrome UI
  • Bold Constructivist
  • Eco Leafy Green
  • Anime Bubble Aesthetic
  • Monochrome Newspaper
  • Chalkboard Classroom
  • Yacht Club Nautical
  • Desert Sand Minimal
  • Bold Serif Vintage
  • Toybox Primary Colors

✅ Resultado: As instruções de frontend e Tailwind são usadas para criar um design bonito.


Tarefa 2: Mantenha as Instruções Atualizadas

Mantenha as instruções atualizadas com mudanças importantes de arquitetura/design/dependências.

Passos:

  1. Follow-up: /create-instructions design guide
  2. Confirme, faça commit e push

Bônus: Verifique se o GitHub Pages está atualizando.


Tarefa 3: Teste o Redesign

Re-execute a skill de dogfooding da Parte 1 para validar seu novo design.

Passos:

  1. Prompt: "Faça dogfooding do app — foque no novo design"
  2. Compare o feedback com o relatório de dogfooding anterior
  3. Opcional: Resolva quaisquer problemas que o agente apontar

✅ Resultado: O agente joga o app redesenhado e dá feedback crítico atualizado.


✅ Parte 2 Completa!

Você aprendeu como:

  • Usar Plan Mode para tarefas complexas de design
  • Iterar nos planos antes de implementar
  • Manter instruções atualizadas com mudanças
  • Re-executar dogfooding para validar mudanças de design