// Generate complete character sprite sheets for the Claude Office Visualizer agents. Creates all animation frames (idle, walking, typing, handoff, coffee) with consistent character design across all sheets. Uses iterative approval workflow and reference-based generation for consistency.
Generate desk accessories for the Claude Office Visualizer. Creates small office items (mugs, staplers, plants, etc.) that sit on agent desks. Items are made grayscale/white by default so they can be tinted different colors for variety.
Generate game-ready sprites for the Claude Office Visualizer using Nano Banana MCP and ImageMagick. Uses 45-degree front/top-down perspective (NOT isometric) with retro 16-bit pixel art style. Includes validation step before processing and helper scripts for background removal.
| name | character-sprite |
| description | Generate complete character sprite sheets for the Claude Office Visualizer agents. Creates all animation frames (idle, walking, typing, handoff, coffee) with consistent character design across all sheets. Uses iterative approval workflow and reference-based generation for consistency. |
| triggers | ["create agent sprite","create character sprite","new office character","generate agent animations","make character for office"] |
Create complete, animated character sprite sheets for Claude Office Visualizer agents using Nano Banana MCP and ImageMagick.
Characters are office workers rendered in retro 16-bit pixel art style. Each character requires multiple animation sprite sheets for different actions and directions.
Art Style: Retro 16-bit pixel art (SNES/Genesis era), clean pixels, limited colors.
CRITICAL - NO ANTI-ALIASING: All sprites must have sharp, crisp pixel edges with NO anti-aliasing, NO smoothing, NO blending between pixels. Each pixel should be a solid color with hard edges. Anti-aliased sprites look blurry and muddy in the game.
Character Constraints:
The game engine parses sprite sheets by dividing the total image into a fixed grid. All cells must be uniform with ZERO padding/spacing between them.
┌──────────────────────────────────────────────────────────────────────────────┐
│ NO gaps, borders, or padding between cells. Cells are calculated as: │
│ cell_width = sheet_width / columns │
│ cell_height = sheet_height / rows │
│ Frame at (col, row) starts at pixel (col × cell_width, row × cell_height) │
└──────────────────────────────────────────────────────────────────────────────┘
DO NOT:
| Sheet Type | Total Size | Grid | Cell Size | Frames |
|---|---|---|---|---|
| Idle | 928 × 1152 px | 8 cols × 8 rows | 116 × 144 px | 64 total |
| Walking | 928 × 1152 px | 8 cols × 8 rows | 116 × 144 px | 64 total |
| Typing | 928 × 144 px | 8 cols × 1 row | 116 × 144 px | 8 frames |
| Handoff | 928 × 1152 px | 4 cols × 1 row | 232 × 411 px* | 4 frames |
| Coffee | 928 × 1152 px | 4 cols × 1 row | 232 × 699 px* | 4 frames |
*Handoff/coffee sheets have content offset - see Frame Location Map below.
Grid Sheets (Idle/Walk) - 8 columns × 8 rows:
Row 0 (y=0-143): South (front-facing) - Frames 0-7 at x: 0, 116, 232, 348, 464, 580, 696, 812
Row 1 (y=144-287): South-West - Frames 0-7
Row 2 (y=288-431): West (left profile) - Frames 0-7
Row 3 (y=432-575): North-West - Frames 0-7
Row 4 (y=576-719): North (back view) - Frames 0-7
Row 5 (y=720-863): North-East - Frames 0-7
Row 6 (y=864-1007): East (right profile) - Frames 0-7
Row 7 (y=1008-1151): South-East - Frames 0-7
Strip Sheets (Single row):
Typing: Row 0, 8 frames at x: 0, 116, 232, 348, 464, 580, 696, 812 (y=0-143)
Handoff: Row 0, 4 frames at x: 0, 232, 464, 696 (content y=343-753)
Coffee: Row 0, 4 frames at x: 0, 232, 464, 696 (content y=0-698)
| Animation | Frames | Duration | Looped | Notes |
|---|---|---|---|---|
| Idle | 8 frames × 8 directions | 2000ms | Yes | Subtle breathing/weight shift |
| Walking | 8 frames × 8 directions | 800ms | Yes | Full walk cycle with arm swing |
| Typing | 8 frames | 400ms | Yes | Back view, hands on keyboard |
| Handoff | 4 frames | 600ms | No | Side view, handing folder |
| Coffee | 4 frames | 400ms | Yes | Front view, drinking motion |
8 Directions (row order): S, SW, W, NW, N, NE, E, SE
Create a front-facing idle pose to establish the character's look:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art game sprite of a [CHARACTER DESCRIPTION], front view facing camera, [CLOTHING DESCRIPTION], simple friendly face, small character suitable for top-down office game, retro SNES/Genesis style pixel art, standing idle pose with arms at sides, isolated on solid magenta background #FF00FF, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, centered composition, no text, no shadows on background, 64x80 pixels scale",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"model_tier": "pro"
}'
Prompt Variables:
[CHARACTER DESCRIPTION]: e.g., "male office worker", "female developer", "robot assistant"[CLOTHING DESCRIPTION]: e.g., "wearing blue dress shirt and tie, brown pants, black shoes, short brown hair"[NAME]: Character identifier (e.g., "agent1", "agent2", "boss")CRITICAL: Get user approval before generating all sprite sheets.
Copy the generated image:
cp "/Users/probello/nanobanana-images/[FILENAME].png" \
"/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png"
View the image using the Read tool and present to user
Ask user to validate:
If rejected: Regenerate with adjusted prompt based on feedback
If approved: Proceed to Step 3
Use BOTH reference images for each generation:
Technical Requirements:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art sprite sheet, EXACTLY 928x1152 pixels total, divided into 8 columns and 8 rows grid, each cell is EXACTLY 116x144 pixels with NO borders NO padding NO gaps between cells, character is [CHARACTER DESCRIPTION] (EXACTLY as shown in first reference image), 8 DIRECTIONS IN EXACT ORDER from top to bottom: ROW 0 south facing toward camera, ROW 1 south-west diagonal, ROW 2 west facing left profile, ROW 3 north-west diagonal, ROW 4 north facing away back view, ROW 5 north-east diagonal, ROW 6 east facing right profile, ROW 7 south-east diagonal, each row has 8 frames of subtle idle breathing animation, cells touch edge-to-edge with no visible grid lines, retro SNES Genesis 16-bit pixel art, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, consistent character in every cell matching reference, solid magenta #FF00FF background fills all empty space in each cell, game sprite sheet asset, no text no watermarks",
"input_image_path_1": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"input_image_path_2": "/Users/probello/Repos/claude-office/frontend/public/sprites/agent1_idle_sheet.png",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_idle_sheet_raw.png",
"model_tier": "pro",
"aspect_ratio": "4:5",
"negative_prompt": "blurry, 3D, realistic, anti-aliasing, anti-aliased edges, smoothing, blending, soft edges, gradients, shadows on background, inconsistent character, different characters, text, watermark, grid lines, cell borders, padding between frames, gaps between cells"
}'
Technical Requirements:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art sprite sheet for WALKING animation, EXACTLY 928x1152 pixels total, divided into 8 columns and 8 rows grid, each cell is EXACTLY 116x144 pixels with NO borders NO padding NO gaps between cells, character is [CHARACTER DESCRIPTION] (EXACTLY as shown in first reference image), 8 DIRECTIONS IN EXACT ORDER from top to bottom: ROW 0 walking south toward camera, ROW 1 walking south-west diagonal, ROW 2 walking west left profile, ROW 3 walking north-west diagonal, ROW 4 walking north away back view, ROW 5 walking north-east diagonal, ROW 6 walking east right profile, ROW 7 walking south-east diagonal, each row has 8 frames of walk cycle with alternating legs and natural arm swing, cells touch edge-to-edge with no visible grid lines, retro SNES Genesis 16-bit pixel art, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, consistent character in every cell matching reference, solid magenta #FF00FF background fills all empty space in each cell, game sprite sheet asset, no text no watermarks",
"input_image_path_1": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"input_image_path_2": "/Users/probello/Repos/claude-office/frontend/public/sprites/agent1_walk_sheet.png",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_walk_sheet_raw.png",
"model_tier": "pro",
"aspect_ratio": "4:5",
"negative_prompt": "blurry, 3D, realistic, anti-aliasing, anti-aliased edges, smoothing, blending, soft edges, gradients, shadows on background, inconsistent character, different characters, text, watermark, standing still, static pose, grid lines, cell borders, padding between frames, gaps between cells"
}'
Technical Requirements:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art sprite sheet for TYPING animation, EXACTLY 928x144 pixels total, horizontal strip with 8 equal cells of EXACTLY 116x144 pixels each with NO borders NO padding NO gaps between cells, character is [CHARACTER DESCRIPTION] (EXACTLY as shown in first reference image), character seen from behind (back view) in seated typing pose with arms extended forward making typing motions, CHARACTER ONLY no desk no chair no keyboard no furniture, 8 frame typing animation showing hands and arms making typing movements, frames show subtle arm position changes as if typing, cells touch edge-to-edge with no visible grid lines, retro SNES Genesis 16-bit pixel art, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, consistent character across all 8 frames matching reference, solid magenta #FF00FF background fills all empty space in each cell, game sprite sheet asset, no text no watermarks",
"input_image_path_1": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"input_image_path_2": "/Users/probello/Repos/claude-office/frontend/public/sprites/agent1_typing_sheet.png",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_typing_sheet_raw.png",
"model_tier": "pro",
"aspect_ratio": "21:9",
"negative_prompt": "blurry, 3D, realistic, anti-aliasing, anti-aliased edges, smoothing, blending, soft edges, gradients, shadows on background, inconsistent character, different characters, text, watermark, front view, standing, grid lines, cell borders, padding between frames, gaps between cells, desk, chair, keyboard, furniture, computer, monitor"
}'
Technical Requirements:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art sprite sheet for HANDING FOLDER animation, EXACTLY 928 pixels wide, horizontal strip with 4 equal cells of EXACTLY 232 pixels wide each with NO borders NO padding NO gaps between cells, character is [CHARACTER DESCRIPTION] (EXACTLY as shown in first reference image), character seen from side profile holding and handing over a manila folder document, 4 frame animation sequence: frame 1 holding folder at waist, frame 2 extending arm with folder, frame 3 arm fully extended offering folder, frame 4 releasing folder hand open, cells touch edge-to-edge with no visible grid lines, retro SNES Genesis 16-bit pixel art, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, consistent character across all 4 frames matching reference, solid magenta #FF00FF background fills all empty space in each cell, game sprite sheet asset, no text no watermarks",
"input_image_path_1": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"input_image_path_2": "/Users/probello/Repos/claude-office/frontend/public/sprites/agent1_handoff_sheet.png",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_handoff_sheet_raw.png",
"model_tier": "pro",
"aspect_ratio": "21:9",
"negative_prompt": "blurry, 3D, realistic, anti-aliasing, anti-aliased edges, smoothing, blending, soft edges, gradients, shadows on background, inconsistent character, different characters, text, watermark, back view, grid lines, cell borders, padding between frames, gaps between cells"
}'
Technical Requirements:
mcpl call nanobanana generate_image '{
"prompt": "16-bit pixel art sprite sheet for DRINKING COFFEE animation, EXACTLY 928 pixels wide, horizontal strip with 4 equal cells of EXACTLY 232 pixels wide each with NO borders NO padding NO gaps between cells, character is [CHARACTER DESCRIPTION] (EXACTLY as shown in first reference image), character seen from front holding and drinking from a coffee cup mug, 4 frame animation sequence: frame 1 holding coffee cup at chest, frame 2 raising cup toward face, frame 3 cup at lips drinking, frame 4 lowering cup with satisfied expression, cells touch edge-to-edge with no visible grid lines, retro SNES Genesis 16-bit pixel art, SHARP CRISP PIXEL EDGES WITH ABSOLUTELY NO ANTI-ALIASING NO SMOOTHING NO BLENDING, each pixel is a solid color with hard edges, consistent character across all 4 frames matching reference, solid magenta #FF00FF background fills all empty space in each cell, game sprite sheet asset, no text no watermarks",
"input_image_path_1": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_front_idle_raw.png",
"input_image_path_2": "/Users/probello/Repos/claude-office/frontend/public/sprites/agent1_coffee_sheet.png",
"output_path": "/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_coffee_sheet_raw.png",
"model_tier": "pro",
"aspect_ratio": "21:9",
"negative_prompt": "blurry, 3D, realistic, anti-aliasing, anti-aliased edges, smoothing, blending, soft edges, gradients, shadows on background, inconsistent character, different characters, text, watermark, back view, sitting, grid lines, cell borders, padding between frames, gaps between cells"
}'
CRITICAL: After generating each sprite sheet:
Copy to sprites folder:
cp "/Users/probello/nanobanana-images/[FILENAME].png" \
"/Users/probello/Repos/claude-office/frontend/public/sprites/[NAME]_[TYPE]_sheet_raw.png"
Verify dimensions match specifications:
cd /Users/probello/Repos/claude-office/frontend/public/sprites
# Check sheet dimensions
magick "[NAME]_[TYPE]_sheet_raw.png" -format "Size: %wx%h" info:
# Expected dimensions:
# idle/walk sheets: 928x1152
# typing sheet: 928x144 (after cropping) or 928x1152 (full generation)
# handoff/coffee sheets: 928x1152
View using Read tool to verify:
Check for common issues:
If issues found, regenerate that specific sheet
Remove magenta backgrounds from all sheets using the improved multi-pass workflow:
cd /Users/probello/Repos/claude-office/frontend/public/sprites
# Process all sheets using the shared script
SCRIPT="/Users/probello/Repos/claude-office/.claude/skills/shared/scripts/remove_magenta.sh"
for sheet in [NAME]_idle_sheet [NAME]_walk_sheet [NAME]_typing_sheet [NAME]_handoff_sheet [NAME]_coffee_sheet; do
INPUT="${sheet}_raw.png"
OUTPUT="${sheet}.png"
# Use multi-pass removal (--skip-trim preserves sprite sheet dimensions)
"$SCRIPT" "$INPUT" "$OUTPUT" --skip-trim
echo "Processed: $OUTPUT"
magick "$OUTPUT" -format " Size: %wx%h, Opaque: %[opaque]" info:
done
The multi-pass workflow:
Also process the base character sprite:
INPUT="[NAME]_front_idle_raw.png"
OUTPUT="[NAME]_front_idle.png"
"$SCRIPT" "$INPUT" "$OUTPUT"
Fallback (if script unavailable):
magick "$INPUT" \
-fuzz 40% -transparent "#FF00FF" \
-fuzz 15% -transparent "#CC00CC" \
-fuzz 15% -transparent "#880088" \
-strip \
"$OUTPUT"
View each processed sprite sheet to confirm:
If pink edges remain after processing:
-fuzz 45% or -fuzz 50% (but watch for character edge erosion above 50%)The following Agent #1 sprite sheets serve as layout references:
| Sheet | Location |
|---|---|
| Idle | /frontend/public/sprites/agent1_idle_sheet.png |
| Walking | /frontend/public/sprites/agent1_walk_sheet.png |
| Typing | /frontend/public/sprites/agent1_typing_sheet.png |
| Handoff | /frontend/public/sprites/agent1_handoff_sheet.png |
| Coffee | /frontend/public/sprites/agent1_coffee_sheet.png |
All sprites go to: /Users/probello/Repos/claude-office/frontend/public/sprites/
[name]_front_idle_raw.png - Original character design (keep as reference)[name]_front_idle.png - Processed character design with transparency[name]_[type]_sheet_raw.png - Raw sprite sheets (keep as backup)[name]_[type]_sheet.png - Processed sprite sheets ready for gameExample character descriptions for variety:
| Character | Description |
|---|---|
| Agent 2 | Female developer with purple blouse, black pants, glasses, ponytail |
| Agent 3 | Male senior dev with gray sweater, khakis, beard, receding hairline |
| Agent 4 | Non-binary intern with green hoodie, jeans, colorful hair |
| Boss/Claude | Distinguished figure with orange/tan color scheme (matches Claude branding) |
DO NOT:
Common Generation Mistakes to Reject:
DO NOT:
How to Detect Anti-Aliasing:
Common Anti-Aliasing Mistakes to Reject:
DO NOT:
-transparent for sprite sheets)DO: