O motor anti-slop — Como o Open Design projeta como um sênior, não como um improvisador

A maioria das ferramentas de design com IA cospe de volta uma bagunça genérica, estranhamente cheia de gradientes arroxeados. Este guia explica a maquinaria que faz o Open Design não agir assim — o sistema de qualidade em múltiplas camadas que força o agente a se comportar como um designer sênior em vez de improvisar. Ele segue a explicação que o AI Teaches Better dá em seu passo a passo, reescrita e atualizada para a versão atual. Assista ao vídeo acima ou continue na versão escrita.

A biblioteca de plugins: instale skills direto do registro — incluindo skills de design anti-slop.

O que é o Open Design?

O Open Design é um framework Apache-2.0, local-first — a resposta open source às ferramentas de design fechadas, só na nuvem e presas a um único modelo. A distinção-chave: ele não traz seu próprio agente de IA. É um orquestrador magistral que delega o trabalho de design às CLIs de agentes de codificação que você já tem. Ligue-o e seu daemon local varre sua máquina, detectando CLIs automaticamente — Claude Code, Codex, Cursor, Gemini, Copilot e mais — e transforma a que encontrar em seus motores de design candidatos, acoplando-se via stdio. Sem dependência de fornecedor; troque de motor com um clique. Nenhuma CLI instalada? Há um fallback de proxy compatível com OpenAI — basta inserir qualquer base URL e chave.

Skills × design systems = resultado intencional

Duas bibliotecas fazem o trabalho pesado:

• Skills combináveis — pastas que dizem ao agente o DNA estrutural de um artefato: uma landing page SaaS, um dashboard de dados, uma especificação de PM, um app móvel multitela. Escolha um skill e ele já sabe como aquilo deve ser construído.
• Design systems de nível de marca — regras de design determinísticas extraídas das principais marcas (Linear, Stripe, Vercel, Apple, Notion). Estrutura × estilo se multiplicam em um vasto espaço de combinações de capacidade e aparência, tudo rodando nativamente na sua máquina.

Nenhuma marca específica em mente? Ele recorre a direções visuais curadas (Editorial Monocle, Modern Minimal, Tech Utility, Brutalist, Soft Warm), travando paletas OKLCH determinísticas e pilhas de fontes — removendo a capacidade da IA de improvisar a vibe.

O hub de plugins: navegue pelo registro, importe plugins e prepare-os para sua equipe.

O motor anti-slop (as seis camadas)

Este é o coração da coisa. Antes de você sequer ver um artefato, o Open Design roda uma defesa de seis camadas que o AI Teaches Better apresenta com clareza:

1. Formulário de descoberta — antes de escrever um único pixel, ele pergunta sobre tom, público e marca para travar a direção.
2. Extração de marca — se você der uma URL, ele extrai sistematicamente a especificação da marca.
3. Autocrítica silenciosa — ele executa uma crítica de cinco dimensões sobre o próprio trabalho antes de mostrá-lo.
4. Checklist P0–P2 — o resultado precisa passar por um rigoroso checklist de prioridades.
5. Lista negra codificada — gradientes genéricos e aqueles estranhos cards arredondados com borda à esquerda são literalmente proibidos.
6. Placeholders honestos — blocos cinza em vez de métricas falsas inventadas do tipo “10x mais rápido”.

A frase que captura tudo: “Isso não é uma IA tentando projetar algo — é uma IA treinada para se comportar como um designer sênior.” A pilha de prompts somada à profunda integração com o sistema de arquivos é o que eleva o resultado e evita o slop com gosto de IA do qual todos estão cansados.

Modo slide-deck: escolha uma categoria de apresentação e faça fork de um exemplo como ponto de partida.

Mais que UI: um estúdio criativo local

A mesma superfície de chat conduz mídia rica — geração de imagens (GPT Image), text-to-video cinematográfico curto, motion graphics via hyperframes, até áudio — com modelos de prompts de mídia prontos para replicar, para que você nunca encare uma tela em branco.

Começando (três passos)

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

O daemon local inicializa, detecta automaticamente seus agentes CLI e configura seu armazenamento SQLite sozinho — zero configuração complexa. Abra a URL local que ele imprime (uma porta dinâmica — não fixe nenhuma no código), ou pegue o app de desktop em open-design.ai/download. Graças a esse armazenamento local, feche o notebook e suas abas e arquivos gerados estarão exatamente onde você os deixou. Você pode até arrastar um ZIP de exportação do Claude Design e continuar editando localmente, usar prévias HTML de clicar-para-comentar para ajustes cirúrgicos ou deploys na Vercel com um clique.

Dica: esbarrando nos limites de taxa da API enquanto itera? Como o Open Design usa variáveis de ambiente padrão, você pode apontar a base URL para um proxy compatível com OpenAI e seguir em frente.

Dicas

• Trate o formulário de descoberta como o passo zero — é a primeira camada do motor anti-slop.
• Comece a partir de um design system real (ou de uma direção curada) para que o agente nunca improvise a aparência.
• Deixe a autocrítica e o checklist rodarem — é isso que pega o slop antes de você ver.
• Troque de motor por tarefa — um modelo forte para a aparência, outro para a funcionalidade; um clique.
• Use uma base URL de proxy se esbarrar nos limites de taxa.

Perguntas frequentes

O que de fato impede o resultado de parecer gerado por IA? Um motor de seis camadas: formulário de descoberta, extração de marca, autocrítica de cinco dimensões, checklist P0–P2, uma lista negra codificada de padrões de slop e placeholders honestos em vez de métricas falsas.

O Open Design inclui seu próprio modelo? Não — ele orquestra as CLIs de agentes de codificação já presentes na sua máquina (ou um proxy compatível com OpenAI). Você traz o motor; ele traz a disciplina de design.

Posso personalizar os skills e os design systems? Sim — ambos são arquivos. Adicione sua própria pasta de skill ou seu design system e ele é reconhecido.

É gratuito? O app é open source sob Apache-2.0 e gratuito para rodar localmente. Você paga apenas pelo uso de modelo e mídia do agente e dos provedores que conectar.

---

Este guia escrito é baseado na explicação do AI Teaches Better. Assista ao vídeo completo acima e inscreva-se no AI Teaches Better para mais análises de arquitetura de IA.