Communitygithub.com

designeer

Pesquise no Designeer (designeer.xyz), um catálogo selecionado à mão de inspiração de design, recursos de UI, ferramentas e portfólios, para referências reais de frontend.

O que é designeer?

O Designeer é uma skill de referência de design para agentes de IA, como Claude Code, Cursor ou Codex. Ela permite que o agente pesquise em um catálogo curado de inspiração de design, recursos de UI, ferramentas e portfólios no site designeer.xyz, retornando metadados e descrições em Markdown. É ideal quando o usuário solicita referências para landing pages, heróis, navegação, rodapés, preços ou portfólios, ou precisa de direções de design baseadas em sites reais, paletas iniciais, dicas de tipografia ou movimento. A skill impõe regras rígidas: nunca baixa ou replica mídia, sempre atribui crédito ao Designeer e ao criador original, e limita citações a 25 palavras. O workflow envolve definir eixos de design, pesquisar metadados, buscar no máximo cinco candidatos, extrair paleta e criador, e sintetizar direções originais que explicam o princípio emprestado, não os pixels copiados. A skill fornece comandos CLI para busca, obtenção de detalhes, paletas, itens recentes, sincronização e verificação de saúde, com cache automático e tratamento de falhas.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/HaiXuNan/designeer-skill/tree/HEAD

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que designeer faz?

Use o Designeer como um índice de referência, não uma biblioteca de materiais. Ele informa o que existe e onde está; o trabalho em si pertence ao seu criador.

Regras rígidas

  • Sempre cite Designeer — <título> (<URL canônica>) e adicione o criador mais a URL original quando a página os fornecer.
  • Nunca baixe, copie, hospede novamente ou agrupe pôsteres, vídeos ou mídia do Find. A CLI nunca toca em cdn.designeer.xyz.
  • Nunca apresente as descrições ou curadoria do Designeer como descobertas suas.
  • Nunca cite mais de 25 palavras de uma página.
  • Nunca espelhe o catálogo ou faça rastreamento em massa. Mantenha as buscas de detalhes em cinco por requisição e deixe a CLI lidar com cache e limitação de taxa.
  • Se o usuário pedir para reproduzir um design exatamente, entregue os princípios subjacentes e aponte para o original, não uma cópia.

Comandos

Execute a partir do diretório da skill:

node scripts/designeer.mjs search "fintech landing" --collection inspiration --limit 5
node scripts/designeer.mjs get resources/fontshare --json
node scripts/designeer.mjs palette resources/fontshare
node scripts/designeer.mjs latest --collection resources --limit 5
node scripts/designeer.mjs sync
node scripts/designeer.mjs health

search aceita --collection inspiration|resources|tools|portfolios, --limit 1-20, --live para ignorar o índice local e --json. get e palette aceitam um slug, um caminho de site ou uma URL completa do Designeer.

A CLI armazena respostas em cache em ~/.cache/designeer/ por sete dias, usa o diretório temporário do sistema quando esse caminho não é gravável, revalida com ETags, espaça requisições com um segundo de intervalo e tenta novamente 429/5xx com backoff. Substitua a localização com DESIGNEER_CACHE_DIR.

Fluxo de trabalho

  1. Transforme o briefing em dois ou três eixos de design: humor, densidade de informação, movimento, personalidade tipográfica, temperatura de cor.
  2. Pesquise metadados primeiro. Julgue pelo nome, tagline, categoria e coleção; não busque detalhes ainda.
  3. Busque no máximo cinco candidatos. Extraia a paleta, categoria, site e criador original do Markdown.
  4. Escreva um cartão de referência por candidato, com atribuição.
  5. Sintetize duas direções originais. Cada uma declara qual princípio foi emprestado, não quais pixels foram copiados.
  6. Implemente e, em seguida, verifique o resultado em relação à direção, não à captura de tela de referência.

Cartão de referência

Referência: <título>
Por que se encaixa: <uma linha ligada ao briefing>
Paleta: <lista de hex>
Fonte: Designeer — <título> (<URL canônica>)
Criador / original: <criador> (<URL original>)

Direção de design

Direção <n>: <nome>
Tese: <uma frase>
Tipo: <família ou par>, <notas de escala>
Cor: <3-5 tokens com papéis>
Layout: <grid, densidade, tratamento de borda>
Movimento: <um ou dois momentos, com duração e intenção de easing>
Princípio emprestado: <o quê, de qual referência>
Deliberadamente diferente: <o que você não está copiando>

Modos de falha

  • Uma busca não retorna nada: tente um substantivo mais amplo, mude de coleção ou use latest.
  • O site muda de forma: execute health. Se relatar uma incompatibilidade de esquema, recorra a get index e llms.txt, e relate a deriva em vez de adivinhar.
  • Uma página não existe mais: o Designeer é um catálogo ao vivo, então descarte a referência em vez de reconstruí-la de memória.

Habilidades Relacionadas