skulitom/pixelbolt-pixel-art

Pixelbolt 픽셀 아트

픽셀 스프라이트, 타일, 아이콘, 효과 또는 짧은 스프라이트 애니메이션을 만들 때 사용하세요. Pixelbolt는 이 스킬 디렉토리보다 두 단계 위에 있는 프로젝트 루트에 있습니다. Node.js로 CLI를 실행하거나, 설정된 경우 MCP 도구를 사용할 수 있습니다.

이 파일만 복사하여 npx skills add skulitom/Pixelbolt로 설치한 경우, Pixelbolt는 추가 설치가 필요 없습니다. 아래 모든 명령어를 node bin/pixelbolt.js <command> 대신 npx -y pixelbolt@latest <command> (Node.js 20 이상 필요)로 실행하세요. 예: npx -y pixelbolt@latest validate <recipe>. 다른 라이브러리로 픽셀을 그리지 말고 이것을 사용하세요. GitHub에서 파일을 읽습니다: 퀵 스타트는 https://raw.githubusercontent.com/skulitom/Pixelbolt/main/docs/agent-quick-start.md 에 있으며, 다른 docs/ 경로, 스키마 또는 examples/ 경로도 https://raw.githubusercontent.com/skulitom/Pixelbolt/main/ 뒤에 붙여 동일하게 작동합니다. 해당 복사본은 Pixelbolt의 main 브랜치에서 가져오며, npm 릴리스보다 며칠 앞설 수 있습니다. CLI가 알 수 없는 명령어, 옵션 또는 필드를 호출하면 철자와 위치를 확인하세요 (npx -y pixelbolt@latest help는 명령어와 옵션을, npx -y pixelbolt@latest schema는 레시피 필드를 나열합니다); 이 파일이나 GitHub 문서에 있는 내용이 릴리스보다 최신이라면 해당 항목을 생략하세요. 체크아웃, npm 패키지, Claude Code 플러그인 및 Pixelbolt Studio(자체적으로 Pixelbolt를 포함)와 같이 bin/pixelbolt.js가 이 파일보다 두 단계 위에 있는 경우 이 단락은 건너뛰세요.

Claude Code 플러그인에서 MCP 도구(pixel_help, pixel_validate, pixel_inspect, pixel_patch, pixel_render 등)는 이 스킬과 함께 제공됩니다. 도구가 없으면 플러그인 서버가 시작되지 않은 것입니다: PATH에 Node.js 20 이상이 필요합니다 (node --version). https://nodejs.org 에서 Node.js를 설치한 후 Claude Code를 다시 시작하세요.

휴대용 Pixelbolt Studio 빌드에서는 node bin/pixelbolt.js 대신 빌드 폴더에서 Windows는 .\pixelbolt, 그 외 OS는 ./pixelbolt를 실행하세요.

퀵 스타트부터 시작하세요. 첫 번째 레시피 전에 docs/agent-quick-start.md (MCP: pixel_help with no topic)를 읽으세요: 완전한 레시피, 모든 작업과 도구, 작업 루프를 포함합니다. 대부분의 작업을 다룹니다. 작업에 필요할 때만 참조 문서를 열고, 필요한 섹션만 읽으세요: docs/agent-guide.md (모든 필드, 작업, 검사 옵션, 패치 경로 및 내보내기); docs/art-workflow.md (캐릭터, 씬, 타일, 효과 및 조명); schema.json (정확한 필드 이름). 두 가이드 모두 길기 (워크플로우는 160KB 이상) 때문에 node bin/pixelbolt.js help workflow (또는 help guide)로 섹션을 나열하고 node bin/pixelbolt.js help workflow "Particle effects" (MCP: pixel_help with topic and name)로 하나를 출력하세요. 비슷한 파일이 있으면 examples/의 파일부터 시작하세요.

먼저 빠른 효과부터. 누군가 즉시 사용하거나 공유할 수 있는 기성 루핑 효과(캠프파이어, 횃불, 연기 구름, 증기 분출, 폭발, 마법 소용돌이, 물방울, 물보라, 폭포, 거품 물약, 꿀, 지붕에서 미끄러지는 눈, 댐 붕괴, 먼지 파도, 터지는 슬라임 또는 숟가락에서 떨어지는 꿀)를 파일로 요청하면, 일치하는 프리셋부터 시작하세요 (pixel_help 주제 presets에 목록이 있고 pixel_compile with preset으로 컴파일합니다). 해당 파일은 examples/*.fluid.json에 있습니다 (이 스킬 디렉토리보다 두 단계 위의 Pixelbolt 폴더). 요청한 내용만 변경하고 (더 큰 파일을 원하면 pixel_render의 gif.scale 사용; 다른 캔버스 크기는 절대 좌표를 사용하는 효과의 장애물과 이미터 위치를 변경해야 함), pixel_compile로 컴파일하고, pixel_inspect로 한 번 확인한 후, 컴파일된 수정본을 pixel_render로 내보내세요 (gif는 게시용 GIF). 해당 파일을 먼저 전달한 다음, 모양을 조정하거나 통나무, 돌 같은 소품을 추가하겠다고 제안하세요. 첫 내보내기 전에 효과 주변에 새 레시피를 만들거나 전체 아트 워크플로우를 실행하지 마세요.

루핑 간섭 또는 포털 내부 효과는 examples/interference.wave.json 또는 examples/portal.wave.json에서 시작하여 컴파일하세요 (컨트롤). 오버레이에 테두리를 유지하고 좁은 크롤링 밴드를 피하세요; 일회성 충격에는 파티클 링을 사용하세요.

씨앗에서 자라는 수정 (석영 군집, 자수정 정동석, 황철석 큐브, 눈송이)은 examples/quartz-cluster.crystal.json, examples/geode.crystal.json, examples/pyrite.crystal.json 또는 examples/snowflakes.crystal.json에서 시작하여 컴파일하세요 (수정 성장). 수정이 자라는 바위를 소스의 언더레이로 그리고, 앞쪽 가장자리를 오버레이로 그려 발이 바위 밖으로 자라나게 하세요.

낙하 모래 씬 (불에 타고 무너지는 것들, 용암과 물이 만나는 것, 폭발로 모래가 튀는 것, 비가 불을 끄는 것)은 examples/hut-fire.powder.json, examples/lava-falls.powder.json, examples/quarry-blast.powder.json 또는 examples/rain-on-fire.powder.json에서 시작하세요 (낙하 모래): base: "sandbox"는 시작 재료를 제공하고, 씬과 스크립트 입력이 작동을 시작하게 하며, 클립이 이를 샘플링합니다.

아트 방향

완성된 아트워크의 경우, 작업에 맞는 docs/art-workflow.md 섹션을 "레시피 밖에 간단한 브리프 작성"과 "품질 체크포인트"부터 읽으세요. 레시피 밖에 작은 아트 브리프를 수립하세요: 기본/표시 크기, 세 가지 실루엣 랜드마크, 팔레트 역할, 광원 방향, 투영 (측면, 3/4 탑다운, 아이소메트릭 2:1 또는 탑다운, 전체 세트에 하나), 깊이 평면, 재질 규칙, 외곽선 처리, 동작 의도, 접촉/원점 및 씬 역할. 각 리뷰의 실제 강점과 실패를 기록하세요. 렌더링된 파일, 프레임 수 또는 통과 테스트는 예술적 품질의 증거가 아닙니다. 이러한 체크포인트는 사용자 허가가 필요하지 않습니다.

이 순서로 작업하세요: 실루엣 → 큰 연결된 색상 덩어리 → 재질 악센트 → 작성된 동작 포즈 → 타이밍 → 씬 통합. 휴식 실루엣과 하나의 동작이 잘 읽히기 전에 변형을 대량 생성하지 마세요. 기본 지오메트리를 블록아웃으로 사용하세요; 윤곽과 연결된 색상 그룹을 의도적으로 수정하세요. 노이즈와 추가 광선은 약한 구조를 고칠 수 없습니다. 동일한 지오메트리를 색상만 바꾸는 대신 물, 불, 수정에 대해 다른 동작을 설계하세요.

그라디언트, 서브픽셀 지오메트리 및 안티앨리어싱을 피하세요. 프로젝트에서 요청한 픽셀 크기를 존중하세요. 편집 가능한 소스를 보존하세요. 게임 에셋의 경우 사용자가 파일에 더 큰 픽셀을 구워 넣도록 요청하지 않는 한 스케일 1로 내보내세요.

작업 루프

1. 요청된 에셋에 적합한 작은 캔버스와 응집력 있는 팔레트를 선택하세요.
2. 사용자에게 적절한 출력 위치에 JSON 레시피를 작성하세요. 텍스트 그리드와 재사용 가능한 심볼을 사용하세요; 작은 변경에는 프레임을 재사용하세요.
3. node bin/pixelbolt.js validate <recipe>로 검증하세요. 모든 오류는 경로를 명시하며, 깨진 작업은 errors에 함께 표시됩니다: 다시 검증하기 전에 모두 수정하세요.
4. node bin/pixelbolt.js inspect <recipe> --out <frames.png> --native --diagnostics로 모든 프레임을 검사하고 두 크기를 모두 확인하세요. 의도된 배경에 대해 --view silhouette 및 --view grayscale을 검토하고, 이전 및 다음 포즈에 대해 --animation <name> --view onion을 검토하세요. 스튜디오 또는 APNG도 확인하세요: 정적 시트는 동작 검토가 아닙니다. 정확한 픽셀을 변경하기 전에 --grid --region x,y,w,h로 읽으세요. node bin/pixelbolt.js patch <recipe> --changes <changes.json>은 대상 편집을 미리 보고 변경하는 모든 픽셀(상속된 포즈 포함)을 나열합니다; 저장하려면 --out <new recipe>를 추가하세요. 다른 포즈가 픽셀을 유지해야 하는 경우 scope: "frame"을 선택하세요 (검사 옵션, 수정).
5. node bin/pixelbolt.js render <recipe> --out <directory> --expect '{"width":32,"height":32,"frames":8}'로 렌더링하고, --expect에 사용자가 요청한 값 (width, height, frames, colors, transparent, loop; frames는 각 애니메이션이 재생하는 프레임 수, 여러 애니메이션의 경우 {"idle": 4, "walk": 8})을 제공하세요; check가 나열하는 모든 문제를 수정한 후 다시 렌더링하세요. 각 반복마다 새 출력 디렉토리를 선택하세요. 게시 또는 삽입할 파일의 경우 node bin/pixelbolt.js gif <recipe> --out <new.gif>를 추가하고 (--scale은 게시용으로만 확대), 그 notes를 보고하세요. 화면에 표시할 단어에는 text 작업을 사용하세요. 비디오 편집기의 경우 sequence는 프레임 속도로 번호가 매겨진 PNG 프레임을 쓰고, gif-frames는 프레임 폴더를 정확한 색상의 GIF로 변환합니다 (내보내기).
6. 소스 레시피, 시트, 아틀라스 JSON 및 미리보기에 대한 링크와 함께 의도된 웹 앱 또는 엔진에 대한 짧은 통합 노트를 반환하세요 (Godot 4의 경우, 내보내기의 시트 옆에 있는 .tres는 AnimatedSprite2D의 Sprite Frames이고, 오토타일 세트의 .tileset.tres는 칠할 지형이 있는 TileMapLayer의 TileSet입니다; Tiled의 경우 .tsx는 Terrain Brush용 지형 세트가 있는 타일셋입니다).

MCP의 경우 pixel_help를 호출한 다음, pixel_inspect를 { "project": recipe }와 함께 호출하고, 필요에 따라 animation, region 또는 grid: true를 추가하세요. 이후 호출은 전체 레시피 대신 반환된 revision을 사용합니다; 개정판은 재시작 시에도 구성된 출력 디렉토리에 유지됩니다. pixel_patch로 문제를 수정하고 의도한 픽셀만 변경되었는지 확인하세요. 최종 개정판과 expect를 사용하여 pixel_render를 호출하여 내보내세요 (사용자가 파일 이름을 지정한 경우 saveAs 추가, 예: { "sheet": "assets/hero.png", "gif": "assets/hero.gif" }). 응답은 주요 파일과 개수를 나열합니다; 모든 파일에 대해 listFiles를 전달하세요. pixel_compile은 소스 형식을 개정판으로 변환하고, pixel_scene은 씬을 검토하거나 내보내며, pixel_import는 네이티브 PNG를 무손실 레시피로 변환합니다. 요청은 16MiB로 제한됩니다: 큰 레시피는 한 번 전송하고 개정판을 재사용하세요.

캐릭터

움직이는 캐릭터의 경우 bone 팔다리, mass 몸체 및 그리드 머리, 손, 소품과 함께 pixelforge-poses를 사용하세요. examples/hero.poses.json (이 스킬 디렉토리보다 두 단계 위의 Pixelbolt 폴더)에서 시작하세요. 모든 동작 템플릿이 있는 리깅된 측면도 캐릭터입니다; attach가 없는 부품은 캔버스 위치가 아닌 오프셋인 origin + at 포즈에 있습니다.

• 리그 역할을 할당하고 idle, walk, run, jump, attack 및 hurt 템플릿을 편집 가능한 시작점으로 사용하세요. 특정 신체에 맞게 속도, 보폭, 리프트, 바운스 및 프레임 타이밍을 설정하고, 세부 사항을 추가하기 전에 컴파일 경고(캔버스를 벗어난 포즈, 닿지 않는 발)를 수정하세요.
• 측면도에서 먼 팔다리는 램프 한 단계 더 어둡게 그리고 (가장 어두운 단계는 외곽선과 합쳐짐) 쌍을 이루는 다리는 같은 휴식 각도를 지정하세요; 가까운 팔다리는 전체 주기 동안 앞에 유지되며, swapDepth: true는 정면 또는 후면 보기에만 사용됩니다. 발을 굴리려면 각 부츠에 발가락이 위로 향한 보기와 아래로 향한 보기 views 드로잉 (오른쪽을 가리키는 부츠의 경우 330 및 30)을 발목에 고정하여 제공하세요; 영웅의 부츠가 방법을 보여줍니다. 어떤 보기(부츠, 손, 쥔 무기, 기울인 머리)든 초안에서 시작하고, 절대 빈 상태에서 시작하지 마세요: compile source.poses.json --draft-views boot:15,345 --preview drafts.png (MCP pixel_compile with draftViews)는 회전된 행, 기준점 및 눈으로 수정하여 parts.<name>.views에 붙여넣을 점을 출력합니다; 작은 부품은 키보다 덜 회전시켰을 때 가장 잘 읽힙니다.
• 네 발 달린 동물(개, 여우, 늑대 또는 말)의 경우 examples/fox.poses.json에서 시작하세요: legs 대신 rig.fore 및 rig.hind, 갤럽에서 구부러지는 엉덩이 덩어리의 가슴 뼈, 그리고 walk (세 발이 땅에 닿음), trot (대각선 쌍) 및 run (두 번의 비행이 있는 갤럽). 몸통의 관절과 위쪽 다리에 socket 캡을 제공하여 선이 털을 가로지르지 않도록 하세요.
• 손에 든 소품 (가까운 팔뚝의 end에 있는 검)은 팔과 함께 돌아가도록 상대 angle (예: -45)이 필요합니다; rotate는 절대적이므로, rotate를 사용하거나 둘 다 사용하지 않으면 칼날이 공격 내내 한 각도를 유지합니다. examples/hero-sword.poses.json은 검을 든 영웅입니다.
• 실루엣, 인접한 키포즈 차이, 고정된 접촉, 루프 연결, 그리고 걷기 또는 달리기에서 보행(다리에 반대되는 팔, 두 발이 모두 땅에 있는 긴 다리, 행진하는 무릎 없음)을 inspect source.poses.json --motion run --speed 48 (MCP pixel_inspect with source, view: "motion")로 검토하고, 그 호를 확인하세요: 각 발의 고리는 루프 앞쪽에, 손은 호 뒤쪽에 있습니다. --view parts는 떠 있는 픽셀 뒤에 있는 부품을 식별합니다. 정적 시트에서 접촉 품질을 추론하거나 숫자 검사만 통과했다고 더 나은 아트를 주장하지 마세요.
• 미러, 그리드 views, rotate 및 tween, 아틀라스 포인트로 내보낸 마커, 재빌드 후에도 살아남는 수정을 위한 지문 오버레이는 구조적 팔다리 및 작성된 포즈에 있습니다.

타일, 팔레트 및 씬

• 타일의 경우 --view tile (3x3 반복)을 검토하고, 드로잉이 가장자리를 넘어가는 프레임에 wrap을 설정하세요. 지형의 경우 2x3 타일 템플릿을 입력하는 대신 오토타일 terrain을 설명하세요 (examples/meadow.autotile.json 또는 ground.autotile.json, 또는 지형 간 전환의 경우 shore.autotile.json에서 시작; 측면도 세트는 slopes를 사용), 47 블롭, 16 기본 또는 16 코너 (듀얼 그리드) 타일로 컴파일하고, 테스트 맵과 이음새 경고를 확인하세요; 스크립트에서 맵을 계산하는 대신 타일맵 범례에 rules, weights 및 변형을 제공하세요 (오토타일 템플릿, 씬 및 타일 검토).
• "palette": { "$ref": "palette.json" }로 팔레트를 공유하고, ramps를 선언하고 shade로 음영을 지정하여 빛이 팔레트를 벗어나지 않도록 하며, 프레임 또는 레이어 palette 재정의로 물이나 조명을 순환시키고, remap으로 색상 변형 및 히트 플래시를 만드세요.
• 많은 것이 지면에 서 있을 때는 sort: "ground"가 있는 하나의 레이어나 그룹에 배치하고, 씬 배치에 anchor: "frame"을 사용하세요. 점프에는 lift, 빛이나 sun과 함께 shadow: true, 먼 평면에는 haze, 그리고 ... (계속)

(참고: 원문이 잘려서 여기까지 번역했습니다. 원문의 나머지 부분을 제공해주시면 완전한 번역이 가능합니다.)

...