harebeats
- 10 skills
- 0 followers
- 11 hours ago last updated
- ▌ Lab · harebeats bundleInstala, inicia, abre, verifica ou encerra o Cannonball 3D Lab local. Use quando o usuário invocar /lab ou pedir para abrir o laboratório 3D do Cannonball em localhost:5555.
- ▌ Kit Cor · harebeats bundleDefine a paleta do site como decisão, não como consequência de ter escolhido um design system. Faz as perguntas que determinam cor (o que a marca promete, o que o setor já usa, para onde o olho tem que ir, o que ela NÃO pode parecer), monta a paleta por papel — fundo, tinta, superfície, acento — mede o contraste de cada par que vai existir na tela, e confere o quanto a escolha é comum dentro do próprio acervo. Use quando o usuário disser "define a paleta", "qual cor usar nesse site", "escolhe as cores", "monta o esquema de cor", "que acento usar", "esse site está sem personalidade de cor", "está tudo muito no automático", ou invocar /kit-cor. Use também, sem esperar o pedido, antes de aplicar um design system a um cliente novo — é ali que a cor costuma passar batida.
- ▌ Kit Tipo · harebeats bundleDefine a tipografia do site como decisão — e, principalmente, resolve se dá para ENTREGAR. Confere licença (site de marca paga por tipo, e acervo montado a partir de site de marca vem cheio de fonte comercial que não se pode servir), propõe substituto livre com critério de desenho, monta o par display + corpo, gera a escala modular em px e rem, e cuida do peso que cada fonte custa no carregamento. Use quando o usuário disser "define a tipografia", "que fonte usar", "monta a escala tipográfica", "qual fonte substitui a X", "posso usar essa fonte?", "essa fonte é paga?", "o texto está sem hierarquia", ou invocar /kit-tipo. Use também, sem esperar o pedido, antes de aplicar um design system a um cliente — design system extraído de site real nomeia a fonte e quase nunca diz onde carregá-la legalmente.
- ▌ Kit Curar · harebeats bundleVerifica a saúde do acervo pessoal de sites — duplicatas, arquivos vazios, fichas mal escritas que a busca nunca vai encontrar, dependências exigidas, imports que quebram quando a peça é copiada para outro projeto, e assets externos que já expiraram. Use quando o usuário perguntar o estado do acervo, reclamar que a busca não acha o que deveria, quiser limpar ou revisar o que está guardado, antes de uma leva grande de ingestão, ou invocar /kit-curar.
- ▌ Kit Buscar · harebeats bundleConsulta o acervo pessoal de sites do usuário — o que ele já guardou: templates rodáveis, design systems com paleta e tipografia, componentes de UI e de IA, animações de scroll, texto e menu, efeitos WebGL, prompts de página inteira e receitas de composição que já deram certo. Responde "o que eu já tenho pronto pra isso?" antes de qualquer coisa ser gerada do zero. O acervo começa vazio e cresce a cada ingestão — esta skill sempre lê o que existe agora, não uma lista fixa. Use quando o usuário perguntar o que tem no acervo, pedir uma peça específica ("que hero eu tenho pra clínica?", "tem algum menu overlay?", "qual design system escuro usar?", "tem carrossel?", "tem agendamento?"), quiser listar por setor, técnica, função ou tipo, ou invocar /kit-buscar. Use TAMBÉM, sem esperar o pedido, antes de construir qualquer hero, seção, menu, componente ou landing page: se existe peça pronta no acervo, ela vem antes de gerar código novo.
- ▌ Kit Montar · harebeats bundleMonta um site novo combinando peças já validadas do acervo pessoal do usuário — templates, design systems, componentes, animações, menus, prompts e receitas — em vez de gerar tudo do zero. Acervo vazio: constrói do zero e oferece guardar. Recebe o briefing, decide cor e tipografia antes da identidade, **pergunta que tipo de hero o usuário quer** (tipográfico, editorial, vídeo de fundo, scroll cinemático, WebGL, carrossel) antes de escrever código, e gera a imagem ou o vídeo do hero pelo Higgsfield quando não há material. Escolhe as peças, porta de Vite para Next.js quando preciso, resolve pré-requisitos, dependências e licença de fonte, e salva a composição como receita. Use quando o usuário pedir um site, landing page, hero, menu ou seção nova — "preciso de uma landing pra clínica", "monta um site de joalheria", "quero uma hero pra imobiliária", "preciso de agendamento no site" — ou invocar /kit-montar. Use também quando ele descrever um projeto novo e quiser começar a construir.
- ▌ Kit Prompt · harebeats bundleEntrevista sobre o site e gera um PROMPT DE CONSTRUÇÃO completo, no padrão dos prompts já validados do acervo — com stack, fontes, paleta, estrutura seção a seção, medidas exatas e proibições explícitas. O resultado é texto para você levar a outra ferramenta (v0, Lovable, Cursor, outro modelo) ou guardar; não é código escrito no projeto. Use quando o usuário pedir "gera um prompt", "monta o prompt pra esse site", "quero um prompt pra clínica", "preciso de um brief pra passar pro v0", ou invocar /kit-prompt. Se ele quiser o site construído aqui e agora, é a kit-montar, não esta.
- ▌ Kit Adaptar · harebeats bundleLê um prompt de site que veio de fora — quase sempre em inglês, quase sempre sem contexto — e devolve em português o que ele é: tipo de site, escopo (hero solto ou landing inteira), seção por seção, técnica usada (hover, cursor, scroll, WebGL, vídeo), stack e dependências, e o mapa de assets com o caminho exato de cada arquivo no projeto. O que você não tiver vira placeholder descrito. Depois adapta o prompt para o seu projeto. Aceita print ou vídeo do site original junto. Use quando o usuário colar um prompt e perguntar "o que é isso", "que site isso constrói", "traduz isso", "adapta esse prompt pra clínica", "que assets eu preciso pra isso", ou invocar /kit-adaptar. Se ele quiser um prompt novo do zero, é kit-prompt.
- ▌ Kit Ingerir · harebeats bundleAlimenta o acervo pessoal de sites com material novo — prompts, componentes, efeitos, design systems, projetos inteiros ou catálogos servidos por MCP — classificando por conteúdo e escrevendo a ficha que torna a peça encontrável depois. Aceita arquivo, texto colado, pasta de projeto, registro shadcn ou servidor MCP. Use quando o usuário disser "guarda isso", "coloquei mais arquivos na pasta", "adicionei uns códigos", "conectei um MCP", "adiciona no acervo", "salva esse componente", "quero indexar esse projeto", mostrar um código ou prompt que queira reaproveitar, ou invocar /kit-ingerir. Use também, proativamente, quando ele criar algo bom durante um projeto e valer a pena guardar para reutilizar.
- ▌ Kit Otimizar 3d · harebeats bundleOtimiza cena three.js, React Three Fiber ou WebGL cru para celular e máquina fraca — tiering de dispositivo, prewarm no loader para nada compilar no meio do scroll, render loop só quando visível, teto de DPR e de partícula/bloom, transformação de scroll na GPU, textura comprimida, e cena fora do bundle para robô. Use quando o usuário disser "otimiza o 3D", "a cena trava no celular", "está engasgando no scroll", "micro travadas", "deixa leve no mobile", "reduz o custo do WebGL", "o hero 3D está pesado", "optimise the 3D", "jank on scroll", ou antes de entregar qualquer projeto que carregue cena WebGL. Use também, sem esperar o pedido, ao montar seção com three.js ou R3F para cliente — máquina de cliente não é máquina de dev. Traz também o método de depurar shader que renderiza ERRADO, e não devagar, extraindo os internos como pixel: use quando disserem "o shader está errado", "a cena aparece torta", "esse efeito não bate com a referência", ou em qualquer bug visual de shader multi-passe.