Back to battles
mediumupcoming
Pixel Art Editor
A pixel art drawing tool with layers, animation, and sprite sheet export.
35 min limit0 participants
javascriptcanvascreative
PRD
# Pixel Art Editor PRD ## Overview Build a pixel art drawing tool with a zoomable grid canvas, multiple drawing tools, layer management, frame-based animation with preview, and export to PNG, sprite sheet, or GIF. ## Requirements - Configurable canvas size from 8x8 to 64x64 pixels - Pixel grid with zoom controls for detailed editing - Draw tool that paints pixels on click and drag - Eraser tool that removes pixels on click and drag - Fill tool using flood fill algorithm to fill connected regions - Eyedropper or color picker tool to sample a color from the canvas - Color palette with 16 default colors plus the ability to add custom colors - Recent colors row showing the last several colors used - Undo and redo support for up to 50 steps - Grid lines toggle to show or hide the pixel grid overlay - Mirror mode for horizontal or vertical symmetry drawing - Layer support: add, remove, reorder layers, adjust opacity, and toggle visibility - Animation frames: add, remove, and duplicate frames - Frame-by-frame animation preview with configurable FPS playback speed - Onion skinning that shows the previous frame as a translucent overlay - Export a single frame as a PNG image - Export all frames as a sprite sheet (grid of frames in a single PNG) - Export animation as a GIF file - Responsive layout that works on various screen sizes - Persist current project to localStorage ## Tech Stack - HTML, Canvas, JavaScript (vanilla or any framework) - No pixel art or animation libraries — build all drawing and export logic yourself ## Scoring Criteria - **Functional (40%)**: Drawing tools work correctly, layers render in order, animation preview plays frames - **Quality (20%)**: Clean code, smooth drawing performance, handles edge cases (single pixel canvas, many layers) - **Fidelity (25%)**: All features implemented including mirror mode, onion skinning, sprite sheet export, GIF export - **Speed (15%)**: Time bonus
Battle Stats
Time Limit35 min
Participants0
Statusupcoming
Rules
- AI-assisted coding tools only -- no manual edits
- Stay within the time limit
- Scoring based on correctness, code quality, and speed
- Session must be recorded via the CLI