Pixelbolt - Pixel Art (Arte em Pixel)

Pixelbolt - Arte em Pixel

Use isto ao criar sprites em pixel, tiles, ícones, efeitos ou animações curtas. O Pixelbolt está na raiz do projeto, dois diretórios acima deste diretório de skill. Execute sua CLI com Node.js, ou use suas ferramentas MCP se configuradas.

Em uma cópia deste arquivo sozinha, como npx skills add skulitom/Pixelbolt o instala, o Pixelbolt ainda não precisa de instalação: execute cada comando abaixo como npx -y pixelbolt@latest <comando> (Node.js 20 ou mais novo) no lugar de node bin/pixelbolt.js <comando>, por exemplo npx -y pixelbolt@latest validate <receita>, e use-o em vez de desenhar pixels com outra biblioteca. Leia os arquivos que ele nomeia do GitHub: o guia rápido está em https://raw.githubusercontent.com/skulitom/Pixelbolt/main/docs/agent-quick-start.md, e qualquer outro caminho docs/, esquema ou examples/ funciona da mesma forma após https://raw.githubusercontent.com/skulitom/Pixelbolt/main/. Essa cópia vem do branch principal do Pixelbolt, que pode estar alguns dias à frente do lançamento npm. Se a CLI chamar um comando, opção ou campo desconhecido, verifique sua ortografia e onde ele se encaixa (npx -y pixelbolt@latest help lista os comandos e opções, npx -y pixelbolt@latest schema os campos da receita); um escrito onde e como este arquivo ou a documentação GitHub o fornece é mais novo que o lançamento, então deixe-o de fora. Pule este parágrafo onde bin/pixelbolt.js está dois diretórios acima deste arquivo, como em um checkout, no pacote npm, no plugin Claude Code e no Pixelbolt Studio, que carregam o Pixelbolt consigo.

No plugin Claude Code, as ferramentas MCP (pixel_help, pixel_validate, pixel_inspect, pixel_patch, pixel_render e as demais) vêm com este skill. Se estiverem faltando, o servidor do plugin não iniciou: ele precisa do Node.js 20 ou posterior no PATH (node --version). Instale Node.js em https://nodejs.org e reinicie o Claude Code.

Na build portátil do Pixelbolt Studio, execute ./pixelbolt no Windows ou ./pixelbolt em outros sistemas a partir da pasta de build, em vez de node bin/pixelbolt.js.

Comece pelo guia rápido. Leia docs/agent-quick-start.md (MCP: pixel_help sem tópico) antes da primeira receita: uma receita completa, cada operação e ferramenta, e o loop de trabalho. Ele cobre a maioria das tarefas. Abra uma referência apenas quando a tarefa precisar, e então apenas a seção que você precisa: docs/agent-guide.md para cada campo, operação, opção de inspeção, caminho de patch e exportação; docs/art-workflow.md para personagens, cenas, tiles, efeitos e iluminação; schema.json para nomes exatos de campos. Ambos os guias são longos (o workflow tem mais de 160 KB), então liste suas seções com node bin/pixelbolt.js help workflow (ou help guide) e imprima uma com node bin/pixelbolt.js help workflow "Efeitos de partículas" (MCP: pixel_help com topic e name). Comece a partir de um arquivo em examples/ quando um estiver próximo.

Efeitos rápidos primeiro. Quando alguém pedir um efeito de loop pronto (uma fogueira, tocha, sopro de fumaça, jato de vapor, explosão, redemoinho mágico, gotejamento, respingo, cascata, poção borbulhante, mel, neve escorrendo do telhado, uma barragem quebrando, uma onda de poeira, slime estourando ou mel escorrendo de uma colher) como um arquivo para usar ou compartilhar, comece pelo preset correspondente (pixel_help tópico presets os lista e pixel_compile com preset compila um), cujos arquivos são examples/*.fluid.json (na pasta Pixelbolt dois diretórios acima deste diretório de skill), mude apenas o que foi pedido (para um arquivo maior, use gif.scale do pixel_render; um tamanho de tela diferente também significa mover os obstáculos e emissores do efeito, que usam coordenadas absolutas), compile com pixel_compile, veja uma vez com pixel_inspect e exporte a revisão compilada com pixel_render (gif para um GIF postar). Entregue esse arquivo primeiro, depois ofereça para ajustar a aparência ou adicionar adereços como troncos ou pedras. Não construa uma nova receita em torno do efeito, nem execute o fluxo de arte completo abaixo, antes da primeira exportação.

Para interações de loop ou interiores de portal, comece de examples/interference.wave.json ou examples/portal.wave.json e compile (controles). Mantenha bordas em uma sobreposição e evite faixas estreitas e rastejantes; use anéis de partículas para impactos únicos.

Para cristais que crescem de sementes (um aglomerado de quartzo, uma geodo de ametista, cubos de pirita, flocos de neve), comece de examples/quartz-cluster.crystal.json, examples/geode.crystal.json, examples/pyrite.crystal.json ou examples/snowflakes.crystal.json e compile (crescimento de cristal). Desenhe a rocha da qual eles crescem como subcamada da fonte, e sua borda frontal como a sobreposição para que seus pés cresçam para fora dela.

Para cenas de areia caindo (coisas queimando e colapsando, lava encontrando água, uma explosão jogando areia, chuva apagando fogo), comece de examples/hut-fire.powder.json, examples/lava-falls.powder.json, examples/quarry-blast.powder.json ou examples/rain-on-fire.powder.json (areia caindo): base: "sandbox" fornece os materiais iniciais, a cena e entradas roteirizadas iniciam, e clipes os amostram.

Direção de arte

Para trabalhos de arte finalizados, leia também as seções de docs/art-workflow.md que se encaixam na tarefa, começando com "Escreva um brief fora da receita" e "Pontos de verificação de qualidade". Estabeleça um pequeno brief de arte fora da receita: tamanho nativo/exibição, três marcos de silhueta, funções da paleta, direção da luz, projeção (lateral, 3/4 de cima para baixo, isométrica 2:1 ou de cima para baixo, uma para todo o conjunto) e planos de profundidade, regras de material, tratamento de contorno, intenção de ação, contato/origem e função na cena. Registre os pontos fortes e fracos reais de cada revisão. Um arquivo renderizado, contagem de quadros ou teste aprovado não é evidência de qualidade artística. Esses pontos de verificação não exigem permissão do usuário.

Trabalhe nesta ordem: silhueta → grandes formas de cores conectadas → acentos de material → poses de ação autoradas → temporização → integração na cena. Não gere variantes em massa antes que a silhueta de repouso e uma ação sejam legíveis. Use geometria primitiva como um bloqueio; revise contornos e grupos de cores conectados deliberadamente. Ruído e brilho extra não podem consertar estrutura fraca. Projete comportamentos diferentes para água, fogo e cristal em vez de recolorir geometria idêntica.

Evite gradientes, geometria subpixel e antialiasing. Respeite as dimensões de pixel solicitadas pelo projeto. Preserve a fonte editável. Exporte na escala 1 para ativos de jogo, a menos que o usuário peça pixels maiores embutidos nos arquivos.

O loop

1. Escolha uma tela pequena e uma paleta coesa apropriada ao ativo solicitado.
2. Escreva uma receita JSON em um local de saída apropriado ao usuário. Use grades de texto e símbolos reutilizáveis; reutilize quadros para pequenas alterações.
3. Valide com node bin/pixelbolt.js validate <receita>. Cada erro nomeia seu caminho, e operações quebradas se reúnem em errors: corrija todas antes de validar novamente.
4. Inspecione cada quadro com node bin/pixelbolt.js inspect <receita> --out <frames.png> --native --diagnostics e olhe para ambos os tamanhos. Revise --view silhouette e --view grayscale contra o fundo pretendido, e --animation <nome> --view onion para poses anteriores e posteriores. Assista ao estúdio ou APNG também: uma folha estática não é revisão de movimento. Antes de mudar pixels exatos, leia-os com --grid --region x,y,w,h. node bin/pixelbolt.js patch <receita> --changes <changes.json> pré-visualiza uma edição direcionada e lista cada pixel que altera, incluindo poses herdadas; adicione --out <nova receita> para salvá-la. Escolha scope: "frame" quando outras poses devem manter seus pixels (opções de inspeção, correções).
5. Renderize com node bin/pixelbolt.js render <receita> --out <diretório> --expect '{"width":32,"height":32,"frames":8}', dando --expect o que o usuário pediu (width, height, frames, colors, transparent, loop; frames conta o que cada animação reproduz, então para várias animações forneça {"idle": 4, "walk": 8}); corrija cada problema que sua check listar, então renderize novamente, antes de entregar qualquer coisa. Escolha um diretório de saída novo para cada iteração. Para um arquivo postar ou incorporar, adicione node bin/pixelbolt.js gif <receita> --out <novo.gif> (--scale apenas para ampliá-lo para postagem) e relate suas notes. Para palavras na tela, use a operação text. Para um editor de vídeo, sequence escreve quadros PNG numerados a uma taxa de quadros, e gif-frames transforma uma pasta de quadros em um GIF de cor exata (exportações).
6. Retorne links para a receita fonte, folha, JSON do atlas e pré-visualização, com uma breve nota de integração para o aplicativo web ou engine pretendido (para Godot 4, o .tres da exportação ao lado de sua folha é um Sprite Frames de AnimatedSprite2D, e o .tileset.tres de um conjunto de autotile é um TileSet de TileMapLayer com um terreno para pintar; para Tiled, seu .tsx é um tileset com um conjunto de terreno para o Pincel de Terreno).

Para MCP, chame pixel_help, depois pixel_inspect com { "project": receita }, adicionando animation, region ou grid: true conforme necessário. Chamadas posteriores usam a revision retornada em vez da receita completa; revisões persistem no diretório de saída configurado entre reinicializações. Resolva problemas com pixel_patch e verifique se apenas os pixels pretendidos mudaram. Chame pixel_render com a revisão final e expect para exportar (quando o usuário nomeou arquivos, adicione saveAs, como { "sheet": "assets/hero.png", "gif": "assets/hero.gif" }). A resposta lista arquivos e contagens chave; passe listFiles para cada arquivo. pixel_compile transforma um formato fonte em uma revisão, pixel_scene revisa ou exporta uma cena, e pixel_import converte um PNG nativo em uma receita sem perdas. As requisições são limitadas a 16 MiB: envie uma receita grande uma vez e reutilize sua revisão.

Personagens

Para figuras em movimento, use pixelforge-poses com membros bone, corpos mass e cabeças, mãos e adereços em grade. Comece de examples/hero.poses.json (na pasta Pixelbolt dois diretórios acima deste diretório de skill), uma figura de vista lateral riggada com cada modelo de movimento; uma parte sem attach fica na origin da pose mais seu at, um deslocamento em vez de uma posição na tela.

• Atribua funções de rig e use os modelos idle, walk, run, jump, attack e hurt como pontos de partida editáveis. Defina velocidade, passada, elevação, balanço e temporização de quadro para o corpo específico, e corrija avisos de compilação (uma pose fora da tela, um pé fora de alcance) antes de adicionar detalhes.
• Em uma vista lateral, desenhe os membros distantes um degrau de rampa mais escuro (não o degrau mais escuro, que se funde com o contorno) e dê às pernas pareadas os mesmos ângulos de descanso; os membros próximos permanecem na frente durante todo o ciclo, e swapDepth: true é apenas para vistas frontais ou traseiras. Para rolar os pés, dê a cada bota um desenho views com dedo para cima e dedo para baixo (330 e 30 para uma bota apontando para a direita), ancorado no tornozelo; as botas do herói mostram como. Comece qualquer vista (botas, mãos, armas seguradas, uma cabeça inclinada) de um rascunho, nunca do zero: compile source.poses.json --draft-views boot:15,345 --preview drafts.png (MCP pixel_compile com draftViews) imprime as linhas giradas, âncora e pontos para corrigir a olho e colar em parts.<nome>.views; partes pequenas são melhores quando giradas menos do que sua chave.
• Para um animal de quatro patas (cachorro, raposa, lobo ou cavalo), comece de examples/fox.poses.json: rig.fore e rig.hind em vez de legs, um osso de peito em uma massa de quadril que o galope dobra, e walk (três pés no chão), trot (pares diagonais) e run (um galope com dois voos). Dê às articulações do corpo e pernas superiores caps socket para que nenhuma linha cruze o pelo.
• Um adereço em uma mão (uma espada no end do antebraço próximo) precisa de um angle relativo, como -45, para girar com o braço; rotate é absoluto, então com ele, ou nenhum, a lâmina mantém um ângulo durante o ataque. examples/hero-sword.poses.json é o herói segurando uma espada.
• Revise silhueta, diferenças de pose chave adjacentes, contatos plantados, a junção do loop e, em uma caminhada ou corrida, a marcha (braços contra pernas, pernas longas onde ambos os pés estão no chão, nenhum joelho marchado) com inspect source.poses.json --motion run --speed 48 (MCP pixel_inspect com source, view: "motion"), e olhe para seus arcos: o anel de cada pé na frente de seu loop, sua mão na parte de trás de seu arco. --view parts nomeia a parte atrás de um pixel solto. Não infira qualidade de contato de uma folha estática nem reivindique arte melhor apenas por passar verificações numéricas.
• Espelhos, views de grade, rotate e tween, marcadores exportados como pontos de atlas, e sobreposições com impressão digital para correções que sobrevivem a uma reconstrução estão em membros estruturais e poses autoradas.

Tiles, paletas e cenas

• Para tiles, revise --view tile (uma repetição 3×3) e defina wrap em quadros cujo desenho continua nas bordas. Para terreno, descreva um terrain de autotile em vez de digitar o modelo 2×3-tile (comece de examples/meadow.autotile.json ou ground.autotile.json, ou shore.autotile.json para transições entre terrenos; um conjunto de vista lateral leva slopes), compile-o em 47 blocos blob, 16 cardinais ou 16 de canto (grade dupla), e verifique seu mapa de teste e avisos de costura; dê às lendas do tilemap rules, weights e variantes em vez de computar mapas em um script (modelos de autotile, revisão de cena e tile).
• Compartilhe uma paleta com "palette": { "$ref": "palette.json" }, declare ramps e sombreie com shade para que a luz nunca saia da paleta, ciclo água ou luzes com substituições de palette de quadro ou camada, e use remap para variantes de cor e flashes de acerto.
• Quando muitas coisas estão no chão, coloque-as em uma camada ou grupo com sort: "ground", e dê a posicionamentos de cena anchor: "frame". Use lift para pulos, shadow: true com uma luz ou um sun, haze para planos distantes, o box para colisão de cena guiada, bg para fundos e parallax para profundidade. setup corta a cena para materiais no início. pixel_scene revisa ou exporta uma cena composta sem renderizar cada tile: lista o que cada referência scene faz e, com --weigh, conta o uso de material para detectar excesso. Veja montagem de cena e troca de material.
• Em vez de recolorir tiles, defina tilesets recoloridos com remap e troque com map.remap por camada e posição. Coloque uma sombra em seu próprio tile e troque-os como um par separado. Dê a tiles de terreno shade: true para mostrar seu target ramp; crie com a paleta nas configurações de tile para que shade funcione nos tiles certos.

Receitas de exportação

Para fazer um pequeno ícone de recurso de fato, crie uma receita com pixel_import e ajuste-a manualmente em vez de redimensionar. Para usar a saída no Godot 4, defina godot: true na exportação ou macro; para Tiled, defina tiled: true. Para compor uma cena para uma partida, coloque action: "scene" em pixel_scene com um grupo de objetos e um theme tilemap. Listas completas de opções de exportação estão em exportações.

Referência

• docs/agent-quick-start.md — Primeira receita, loop de trabalho, operações e ferramentas.
• docs/agent-guide.md — Todos os campos, operações, opções de inspeção, caminhos de patch e exportações.
• docs/art-workflow.md — Fluxo de arte completo: silhueta, cor, materiais, poses, animação, tiles, efeitos, iluminação e integração de cena.
• schema.json — Esquema completo de receita JSON.
• examples/ — Receitas de exemplo para personagens, efeitos, tilesets e cenas.
• docs/wave-effects.md — Efeitos de onda e portal.
• docs/art-workflow.md#crystal-growth — Receitas de crescimento de cristal.
• docs/art-workflow.md#falling-sand — Cenas de areia caindo.
• docs/art-workflow.md#inspection-options — Opções de inspeção e patch.
• docs/art-workflow.md#exports — Exportações: PNG, GIF, APNG, Godot 4, Tiled.
• docs/art-workflow.md#structural-limbs-and-bodies — Membros estruturais para animação de poses.
• docs/art-workflow.md#authored-poses-attachments-and-cues — Poses autoradas, anexos e dicas.
• docs/art-workflow.md#autotile-templates — Modelos de autotile e terreno.
• docs/art-workflow.md#scene-and-tile-review — Revisão de cena e tile.
• docs/art-workflow.md#scene-assembly-and-material-swap — Montagem de cena e troca de material.