design-taste-frontend

Ensina a IA a projetar como uma agência de alto padrão. Define as fontes exatas, espaçamentos, sombras, estruturas de cartão e animações que fazem um site parecer caro. Bloqueia todos os padrões comuns que fazem os designs de IA parecerem baratos ou genéricos.

Atualiza sites e aplicativos existentes para qualidade premium. Audita o design atual, identifica padrões genéricos de IA e aplica padrões de design de alto nível sem quebrar a funcionalidade. Funciona com qualquer framework CSS ou CSS puro.

Interfaces limpas em estilo editorial. Paleta monocromática quente, contraste tipográfico, grids bento planos, pastéis suaves. Sem gradientes, sem sombras pesadas.

Engenheiro(a) especialista em UX/UI de elite e Motion Graphics Avançados com GSAP. Aplica randomização verdadeira orientada por Python para variação de layout, estrutura de página rigorosa seguindo o modelo AIDA, tipografia editorial ampla (proíbe quebras de linha com 6 linhas), grids bento sem espaçamentos, ScrollTriggers estritos do GSAP (pinning, stacking, scrubbing), microimagens inline e espaçamento generoso entre seções.

Habilidade premium de geração de imagens de brand-kit para criar painéis de diretrizes de marca de alto padrão, sistemas de logotipo, decks de identidade e apresentações de mundo visual. Treinada para sistemas de marca minimalistas, cinematográficos, editoriais, dark-tech, luxo, culturais, segurança, jogos, ferramentas de desenvolvedor e aplicativos de consumo. Otimizada para conceituação intencional de logotipos, composição refinada, tipografia enxuta, forte significado simbólico, mockups premium, imagens com direção de arte e layouts de grade flexíveis.

Habilidade de frontend de elite para direcionamento de imagens, gerando referências premium de design de sites com foco em conversão. REGRA CRÍTICA DE SAÍDA — gere UMA imagem horizontal separada PARA CADA seção. Uma landing page com 8 seções produz 8 imagens. Nunca comprima várias seções em uma única imagem. Impõe variedade de composição (nem sempre texto à esquerda / imagem à direita), liberdade de imagem de fundo, CTAs variados, escalas de herói variadas (gigante / médio / minimalista pequeno), espinha dorsal conceitual narrativa, momentos de segunda leitura e um...

Substitui o comportamento padrão de truncamento do LLM. Garante a geração completa de código, proíbe padrões de placeholder e lida corretamente com divisões por limite de tokens. Aplicável a qualquer tarefa que exija saída exaustiva e sem abreviações.

Habilidade elite de image-to-code para sites no Codex. Para tarefas web visualmente importantes, deve primeiro gerar as próprias imagens de design, analisá-las profundamente e, em seguida, implementar o site para corresponder a elas o mais fielmente possível. No Codex, deve preferir imagens grandes, legíveis e específicas de cada seção, em vez de pequenos quadros compactados, gerar novas imagens independentes para seções ou visualizações de detalhes em vez de recortar as antigas, evitar subgeração preguiçosa, evitar UI de cartões dentro de cartões dentro de cartões e manter o...