Sprite Generation Pipeline

Overview

This skill covers the complete pipeline for generating fighting game sprites using AI image generation tools, specifically ComfyUI and HuggingFace models. The pipeline takes a character or stage concept and produces SFF-ready sprites suitable for IKEMEN Go.

Pipeline: Concept to SFF

1. CONCEPT       -> Character description, art style, reference images
2. GENERATION    -> ComfyUI/HuggingFace AI generates raw pixel art
3. POST-PROCESS  -> Background removal, palette reduction, axis alignment
4. ORGANIZATION  -> Sort by group/image numbers per IKEMEN convention
5. COMPILATION   -> Compile into .sff file for engine use

IKEMEN Go Sprite Requirements

Format

• •Indexed PNG (256 colors max) for classic style, or 32-bit PNG (true color) for HD
• •Transparency: Color index 0 = transparent (indexed), or alpha channel (32-bit)
• •Axis point: The registration point where the character's feet/center is
• •Consistent size: All sprites for a character should have similar dimensions
• •Facing: Characters face RIGHT by default; engine mirrors for left-facing

Resolution Guidelines

• •SD (classic): 50-80px tall characters, 320x240 game resolution
• •HD (modern): 100-200px tall characters, 1280x720 game resolution
• •Portraits: 9000,0 sprite -- typically 200-300px for select screen

Standard Sprite Groups

Minimum Viable Sprite Count

A basic character needs approximately 80-120 sprites for essential animations:

• •Idle (6) + Walk (8) + Crouch (3) + Jump (6) + Run (6) = 29 movement
• •6 standing attacks x 5 frames = 30 attack frames
• •3 crouch attacks x 4 frames = 12 crouch attacks
• •3 air attacks x 4 frames = 12 air attacks
• •Guard (4) + Hit reactions (8) + KO (6) + Get up (4) = 22 reaction
• •Turn (3) + Taunt (4) + Portrait (1) = 8 misc
• •Total: ~113 sprites minimum

ComfyUI Integration

API Basics

ComfyUI exposes a REST API at http://localhost:8188:

# Queue a prompt (workflow)
curl -X POST http://localhost:8188/prompt \
  -H "Content-Type: application/json" \
  -d '{"prompt": {...workflow json...}}'

# Check queue status
curl http://localhost:8188/queue

# Get generation history
curl http://localhost:8188/history

# Download generated image
curl http://localhost:8188/view?filename=ComfyUI_00001_.png&subfolder=&type=output

Workflow Structure

A ComfyUI workflow is a JSON object mapping node IDs to node configurations:

{
  "1": {
    "class_type": "CheckpointLoaderSimple",
    "inputs": {
      "ckpt_name": "pixelArt_v1.safetensors"
    }
  },
  "2": {
    "class_type": "CLIPTextEncode",
    "inputs": {
      "text": "pixel art, fighting game character sprite, ...",
      "clip": ["1", 1]
    }
  },
  "3": {
    "class_type": "KSampler",
    "inputs": {
      "model": ["1", 0],
      "positive": ["2", 0],
      "negative": ["4", 0],
      "seed": 42,
      "steps": 20,
      "cfg": 7.0,
      "sampler_name": "euler_ancestral",
      "scheduler": "normal",
      "denoise": 1.0,
      "latent_image": ["5", 0]
    }
  }
}

Recommended Models

• •Checkpoint: Pixel art focused models (e.g., pixelArt_v1, pixel-art-xl)
• •LoRAs: Fighting game sprite LoRAs, pixel art style LoRAs
• •ControlNet: OpenPose for consistent character poses across frames
• •VAE: Standard VAE for clean output

Pose-Guided Generation (Critical for Consistency)

Using ControlNet with OpenPose ensures consistent character proportions:

1. •Create reference pose images for each animation state
2. •Feed pose + character description to ControlNet pipeline
3. •Generate multiple frames with same seed base but different poses
4. •Result: Consistent character appearance across all animation frames

Prompting for Fighting Game Sprites

Base Prompt Template

pixel art, fighting game character sprite, {pose_description},
{character_description}, transparent background, 2D side view,
clean lines, {style_modifiers}, {resolution_hint}

Pose-Specific Prompts

Idle: "standing idle pose, relaxed fighting stance, weight balanced" Walk Frame 1: "walking forward, left foot forward, arms natural" Walk Frame 2: "walking forward, mid-stride, both feet close" Walk Frame 3: "walking forward, right foot forward, arms natural" Punch Startup: "pulling fist back, preparing to punch, slight lean back" Punch Active: "extending punch forward, arm fully extended, leaning forward" Punch Recovery: "retracting fist, returning to stance" Kick: "executing high kick, leg extended forward, standing leg planted" Jump Rise: "jumping upward, legs tucked, arms up" Jump Fall: "falling down, legs extending, arms out for balance" Crouch: "crouching low, defensive stance, knees bent" Hit Reaction: "recoiling from hit, head snapping back, body staggering" Block: "blocking stance, arms raised defensively, braced" KO/Fall: "falling backward, unconscious, limp body"

Style Modifiers

• •Classic: "16-bit style, snes era, limited palette"
• •Modern pixel: "detailed pixel art, anti-aliased, rich colors"
• •Anime: "anime style pixel art, expressive, dynamic"
• •Realistic: "realistic proportions pixel art, detailed shading"

Negative Prompts

3D, 3d render, realistic photograph, blurry, low quality,
background clutter, multiple characters, text, watermark,
deformed, extra limbs, bad anatomy, disfigured, poorly drawn

Post-Processing Pipeline

Step 1: Background Removal

from PIL import Image
import numpy as np

img = Image.open("generated_sprite.png").convert("RGBA")
data = np.array(img)

# Remove near-white/near-transparent backgrounds
# Set fully transparent where alpha < threshold or background color detected
mask = data[:, :, 3] < 128  # Simple alpha threshold
data[mask] = [0, 0, 0, 0]

result = Image.fromarray(data)
result.save("sprite_clean.png")

Step 2: Palette Reduction (for indexed mode)

from PIL import Image

img = Image.open("sprite_clean.png").convert("RGBA")
# Quantize to 255 colors (index 0 reserved for transparency)
img_indexed = img.quantize(colors=255, method=Image.MEDIANCUT)
# Set transparent color to index 0
# Save as indexed PNG
img_indexed.save("sprite_indexed.png")

Step 3: Axis Alignment

The axis point should be at the character's feet, horizontally centered:

# Find character bounding box
bbox = img.getbbox()
# Center X = (bbox.left + bbox.right) / 2
# Axis Y = bbox.bottom (feet)
axis_x = (bbox[0] + bbox[2]) // 2
axis_y = bbox[3]

Step 4: Consistent Sizing

All sprites should be padded/cropped to consistent dimensions:

# Target: 200px wide, 250px tall for HD character
target_w, target_h = 200, 250
# Center character in canvas with axis at bottom-center

Stage Background Generation

Stage backgrounds require wider canvases and layer separation:

Layer Approach

Generate each parallax layer separately:

1. •Sky layer: Wide panoramic, simple gradients/clouds (2000+ px wide)
2. •Far background: Mountains, cityscape (1500+ px wide, delta=0.2)
3. •Mid ground: Trees, buildings (1200+ px wide, delta=0.5)
4. •Near ground: Fences, debris (1000+ px wide, delta=0.8)
5. •Floor: Ground texture (tileable, delta=1.0)
6. •Foreground: Overlay elements (rain, fog, leaves, delta=1.2)

Stage Prompt Template

pixel art, fighting game stage background, {scene_description},
{layer_description}, side-scrolling view, {style}, {mood}

Tiling for Infinite Scroll

Ground and sky layers often need horizontal tiling:

seamless tile, horizontally tileable, pixel art ground texture,
{surface_type}, fighting game floor

SFF Compilation

Using Loose PNGs (Development)

IKEMEN Go can load sprites from individual PNG files during development. Place PNGs in the character folder and reference them in a sprite list file.

SFF v2 Compilation

For distribution, compile PNGs into an SFF v2 file:

1. •Create a sprite definition list mapping group,image to PNG files
2. •Set axis points for each sprite
3. •Choose compression (RLE8, LZ5, or uncompressed)
4. •Use sffmake tool or Fighter Factory to compile

Sprite Definition Format (for sffmake)

; Group, Image, AxisX, AxisY, filepath
0, 0, 100, 200, sprites/idle_0.png
0, 1, 100, 200, sprites/idle_1.png
0, 2, 100, 200, sprites/idle_2.png
200, 0, 100, 200, sprites/lpunch_0.png
200, 1, 100, 200, sprites/lpunch_1.png
9000, 0, 0, 0, sprites/portrait.png