direction-picker
Ajuda seu agente a decidir a direção visual do design automaticamente. Ele usa as regras do projeto para fazer isso sem perguntar.
O que ela faz
Esta ferramenta decide qual será o estilo visual de um projeto (cores, fontes, etc.) antes de começar a construir. Ela escolhe o estilo com base nas regras já existentes ou no que foi fornecido, sem precisar perguntar para você.
Quando usar
- ✓Quando você quer que a IA decida o estilo visual de um site.
- ✓Ao iniciar um novo projeto de design ou desenvolvimento.
- ✓Para garantir que todos sigam um mesmo estilo visual.
Exemplo do que pedir para a IA
“IA, defina o estilo visual para este projeto com base nas diretrizes de design.”
Quer saber mais? Abra as seções abaixo.
Como usar
O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.
Link da skill
Mensagem pronta para colar
Como funciona
A ferramenta primeiro verifica se existe um sistema de design definido. Se não, ela analisa as informações fornecidas pelo usuário, como um site de referência ou especificações da marca. Se ainda assim não for suficiente, ela usa o contexto do projeto para adivinhar o melhor estilo.
Instalação
Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.
No terminal (Claude Code, Codex, Cursor), na pasta do projeto:
npx skills add nexu-io/open-design --skill direction-pickerOu baixe só o arquivo:
curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/_official/atoms/direction-picker/SKILL.md -o SKILL.mdConteúdo técnico (SKILL.md)
Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.
Seletor de Direção
O trabalho convergente precisa de uma direção visual definida antes do início da construção.
Este átomo é responsável por esse momento na fase plan: decida a direção, declare-a
em uma linha e fixe-a.
Resolva a direção a partir do que você já tem, nesta ordem:
- Um sistema de design ativo — sua paleta, tipografia, espaçamento e regras de componentes no DESIGN.md são a direção. Vincule seus tokens e pare aqui.
- Uma especificação de marca, URL de referência ou captura de tela fornecida pelo usuário — analise essa fonte diretamente.
- Caso contrário, infira a direção que melhor corresponde a partir do
domínio, público e tom do briefing, e então vincule seus tokens visuais. Se o tempo de execução
fornecer apenas um índice de IDs e nomes de direção, execute
"$OD_NODE_BIN" "$OD_BIN" tools directions --id <id>para recuperar a especificação completa — nunca infira cores ou fontes apenas pelo nome.
Não peça ao usuário para escolher uma direção visual. Nem como uma pergunta, nem como uma lista de opções em markdown, nem como um acompanhamento de "qual destes parece certo?". A direção é sua para resolver; perguntar gasta o turno do usuário em uma decisão que eles contrataram o agente para tomar.
Convergência
O átomo é concluído quando o plano declara a direção escolhida. O próximo turno do agente deve construir contra essa direção — retroceder força uma nova iteração do ciclo de desenvolvimento da fase de planejamento.
Antí-padrões que o fragmento de prompt proíbe
- Pedir ao usuário para escolher, comparar ou confirmar uma direção visual.
- Prender o usuário a uma única direção com alternativas cosméticas (uma direção declarada deve ser uma aposta defensável e independente).
- Inferir paleta ou tipografia do nome de uma direção em vez de resolver sua especificação.
Perguntas frequentes
Por que a IA não me pergunta qual estilo eu prefiro?
A ideia é que a IA tome essa decisão por você, já que você a contratou para isso. Perguntar tiraria o seu tempo e atrasaria o projeto.
O que acontece depois que a IA decide o estilo?
Assim que o estilo é decidido e registrado, a IA deve continuar o trabalho baseada nesse estilo. Mudar de ideia depois exigiria refazer o planejamento.
A IA pode inventar cores ou fontes se não encontrar informações?
Não, a IA não deve inventar cores ou fontes apenas pelo nome do estilo. Ela precisa encontrar as especificações corretas ou usar as informações que você forneceu.
Detalhes
Descrição original do autor
Resolves the visual direction at the plan stage from the brief and design system, without asking the user.
repo: nexu-io/open-design
Popularidade
- Estrelas no GitHub
- 101 mil
- Posição no ranking
- #523
- Licença
- Apache-2.0
- Atualizada em
- 16/10/2026
Comentários
- …
Mais skills deste repositório
sample-plugin
Faz seu agente criar um arquivo de metadados para testes. Ele ajuda a garantir que o código funcione corretamente em diferentes situações.
nexu-io/open-design
aster-atelier
Ajuda seu agente a criar um site artístico com visual clássico. Ele usa imagens elegantes, céus azuis e fontes serifadas para um visual cinematográfico.
nexu-io/open-design
audio-jingle
Faz seu agente gerar áudio como jingles e efeitos sonoros. Ele pode criar músicas e vozes, salvando o resultado em um arquivo de áudio.
nexu-io/open-design
blog-post
Ajuda seu agente a escrever artigos longos ou posts de blog. Ele inclui espaços para imagens, citações e informações do autor.
nexu-io/open-design
Skills parecidas
accessibility
Ajuda seu agente a criar interfaces que todos possam usar. Garante que sites e aplicativos funcionem bem para pessoas com deficiência, como cegos ou com mobilidade reduzida.
affaan-m/ECC
design-system
Ajuda seu agente a criar um sistema de design a partir de um código existente. Ele extrai informações visuais e verifica a consistência, gerando um relatório e uma prévia interativa.
affaan-m/ECC
liquid-glass-design
Ajuda seu agente a criar interfaces de usuário com efeito 'Liquid Glass' para iOS. Permite adicionar efeitos visuais dinâmicos e interativos em SwiftUI e UIKit.
affaan-m/ECC