Frontend & UI
design-taste-frontend
Lê o briefing, escolhe uma direção e entrega interfaces que fogem do template.
O que é
Uma skill de frontend anti-genérico para landing pages, portfólios e redesigns. Ela declara uma leitura de design, ajusta os índices de variação, movimento e densidade, e depois roda uma checagem de pré-voo longa.
Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, a
Por que isso importa para design
- Briefings corporativos recebem o pacote oficial de design system, em vez de um CSS artesanal parecido.
- A checagem de pré-voo proíbe travessões, eyebrows numerando seções, indicações de scroll e CTAs repetidos.
- A repetição de layout tem limite, então oito seções usam ao menos quatro famílias diferentes.
O que cobre
- Brief inference
- The three dials
- Brief to design system map
- Design engineering directives
- AI tells
- Final pre-flight check
Como instalar
design-taste-frontend
-
Clone o repositório.
git clone https://github.com/Leonxlnx/taste-skill -
Aponte o Codex para o arquivo da skill.
skills/taste-skill/SKILL.md -
Depois descreva a UI que você quer. O Codex segue a skill.
Como rodar com o Codex
-
O agente declara uma leitura de design em uma linha antes de escrever qualquer código.
-
Ele ajusta três índices: variação de design, intensidade de movimento e densidade visual.
-
Todo item da checagem de pré-voo precisa passar, ou a página não está pronta.
Todo plugin aqui é gratuito, open source e leva até a sua fonte original.
Mais na lista codex-design ↗Mais plugins de design para o Codex
Frontend & UI O que ele faz gpt-taste Cria landing pages estilo premiado com movimento de scroll em GSAP e grids bento sem falhas. 
Design Systems O que ele faz Stitch Design Taste Escreve um DESIGN.md que guia o Google Stitch para telas que fogem do genérico. 
Frontend & UI O que ele faz image-to-code Gera imagens de design primeiro, analisa cada uma e só depois constrói o código de frontend correspondente. 
Frontend & UI O que ele faz imagegen-frontend-mobile Gera fluxos de telas de app mobile em nível premium, como imagens, não como código. Próximo passo
Projete com o Open Design, sem a configuração
Instale este plugin por conta própria ou rode uma camada de design curada em volta do Codex com o Open Design. Use sua própria chave e seja dono do resultado.