Pixel Art Exporter by willibrandon/pixel-plugin
npx skills add https://github.com/willibrandon/pixel-plugin --skill 'Pixel Art Exporter'像素画导出器技能支持将 Aseprite 中的像素画精灵导出为针对不同使用场景优化的各种格式。这包括单张图像(PNG)、动画 GIF、精灵表以及用于游戏引擎的 JSON 元数据。
核心功能:
支持的导出格式:
此技能与 pixel-mcp 服务器工具配合使用,为网页、游戏和应用程序生成可用于生产的资源。
当用户出现以下情况时,调用此技能:
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
触发示例:
针对静态精灵或单帧:
首先获取精灵信息
使用 mcp__aseprite__get_sprite_info 来了解: - 当前尺寸 - 帧数 - 可用图层 - 颜色模式和透明度设置
导出带透明度的 PNG
使用 mcp__aseprite__export_png: - file_path: 绝对路径(例如,"/path/to/output/sprite.png") - frame_number: 特定帧(从 0 开始索引)或省略以使用当前帧 - layer: 特定图层名称或省略以输出合并结果 - scale: 缩放因子(1、2、4 等)- 默认为 1
导出选项
工作流程示例:
1. 获取精灵信息以确认尺寸和帧数
2. 导出 PNG:使用 mcp__aseprite__export_png 并指定所需的帧和缩放比例
3. 确认文件创建并向用户报告尺寸
针对用于网页或演示的动画:
验证动画设置
使用 mcp__aseprite__get_sprite_info 检查: - 帧数(需要 2 帧以上) - 帧持续时间(时间信息) - 动画标签(如果请求了特定标签) - 精灵尺寸
导出 GIF
使用 mcp__aseprite__export_gif: - file_path: 输出路径(例如,"/path/to/animation.gif") - animation_tag: 可选 - 要导出的特定标签名称 - loop: true(无限循环)或 false(播放一次) - scale: 如果需要,指定放大因子
GIF 优化注意事项
工作流程示例:
1. 验证精灵有多个帧
2. 使用适当的循环设置导出 GIF
3. 向用户报告文件大小和帧数
4. 如果文件过大(>1MB),建议优化
针对游戏引擎和纹理图集:
布局类型:
* **水平** :所有帧排成一行(适用于滚动动画)
* **垂直** :所有帧排成一列(适用于 CSS 动画)
* **网格** :帧按行和列排列(尺寸均衡)
* **打包** :优化打包以最小化纹理尺寸(引擎特定)
2. 导出精灵表
使用 mcp__aseprite__export_spritesheet:
- file_path: 输出 PNG 路径(例如,"/path/to/spritesheet.png")
- layout: "horizontal"、"vertical"、"grid" 或 "packed"
- animation_tag: 可选 - 仅导出特定动画
- scale: 放大因子
- padding: 帧之间的像素数(默认 0,常用:1-2)
- include_json: true 以生成元数据文件
3. JSON 元数据结构
当 include_json: true 时,创建一个包含以下内容的 .json 文件:
{
"frames": [
{
"filename": "frame_0.png",
"frame": {"x": 0, "y": 0, "w": 32, "h": 32},
"spriteSourceSize": {"x": 0, "y": 0, "w": 32, "h": 32},
"sourceSize": {"w": 32, "h": 32},
"duration": 100
}
],
"meta": {
"app": "Aseprite",
"version": "1.3.x",
"format": "RGBA8888",
"size": {"w": 256, "h": 32},
"scale": "1"
}
}
4. 布局选择指南
* **水平** :最适合网页/CSS 精灵动画,简单的滚动
* **垂直** :移动端友好,垂直滚动动画
* **网格** :Unity、Godot - 均衡的纹理尺寸(2 的幂次方)
* **打包** :支持图集的高级引擎(Phaser、LibGDX)
工作流程示例:
1. 如果用户未指定,询问目标平台
2. 根据使用场景推荐布局
3. 导出带有 JSON 元数据的精灵表
4. 报告纹理尺寸和帧数
5. 为其引擎提供集成代码示例
针对游戏引擎集成:
Unity:
* 为 Unity 的 Sprite Editor 使用 "grid" 布局
* JSON 提供用于切片的帧坐标
* 包含填充以防止纹理渗色
Godot:
* 使用 "horizontal" 或 "grid" 布局
* JSON 映射到 AnimatedSprite 帧
* 帧持续时间转换为 FPS
Phaser:
* 为获得最佳性能使用 "packed" 布局
* JSON 遵循 Texture Packer 格式
* 支持修剪过的精灵和旋转
通用/自定义:
* 带有 x、y、w、h 坐标的标准帧数组
* 每帧持续时间(毫秒)
* 动画标签分组
2. 导出带元数据
为游戏引擎导出时始终包含 JSON:
- 在 export_spritesheet 中设置 include_json: true
- JSON 文件创建时与 PNG 同名(扩展名不同)
- 包含帧位置、持续时间和精灵元数据
3. 元数据使用示例
在 JavaScript 中解析 (Phaser):
this.load.atlas('sprite', 'spritesheet.png', 'spritesheet.json');
this.add.sprite(x, y, 'sprite', 'frame_0.png');
在 C# 中解析 (Unity):
// 以 Multiple sprite mode 导入 spritesheet.png
// 在 Sprite Editor 中使用 JSON 设置精灵矩形
为高分辨率显示屏进行像素完美放大:
何时缩放
缩放最佳实践
应用缩放
在任何导出中添加 scale 参数: - mcp__aseprite__export_png: scale: 2 - mcp__aseprite__export_gif: scale: 4 - mcp__aseprite__export_spritesheet: scale: 2
分辨率建议
1. 获取精灵信息以确认是单帧
2. 以 2 倍缩放导出带透明度的 PNG
3. 如果需要,使用压缩工具优化 PNG
4. 提供用于显示的 HTML/CSS 示例
1. 验证动画有多个帧和标签
2. 使用 "grid" 布局导出精灵表
3. 包含 JSON 元数据 (include_json: true)
4. 设置适当的填充(1-2 像素)
5. 如果需要则缩放(引擎通常为 1x)
6. 为目标引擎提供代码片段
1. 如果有多个图层,分别导出每个图层
2. 使用带透明度的 PNG 格式
3. 缩放到多种尺寸(16x16、32x32、64x64)
4. 批量导出所有尺寸
5. 在输出目录结构中组织文件
1. 验证帧时间是否合适(典型 100-200ms)
2. 使用 loop: true 导出 GIF
3. 缩放到 2x 或 4x 以提高可见性
4. 检查文件大小(如果 >2MB 则优化)
5. 如果需要,建议托管平台
1. 验证图块尺寸是否统一(例如 16x16、32x32)
2. 导出为网格精灵表
3. 设置填充为 0 或 1(取决于引擎)
4. 包含用于图块坐标的 JSON
5. 提供图块尺寸和网格维度
导出设置:
导入步骤:
代码示例:
SpriteRenderer renderer = GetComponent<SpriteRenderer>();
renderer.sprite = sprites[frameIndex];
导出设置:
导入步骤:
代码示例:
$AnimatedSprite.play("run")
$AnimatedSprite.speed_scale = 1.0
导出设置:
导入步骤:
代码示例:
this.load.atlas('player', 'spritesheet.png', 'spritesheet.json');
this.anims.create({
key: 'run',
frames: this.anims.generateFrameNames('player', {
prefix: 'frame_',
suffix: '.png',
start: 0,
end: 7
}),
frameRate: 10,
repeat: -1
});
导出设置:
JSON 结构:
{
"frames": [
{"x": 0, "y": 0, "w": 32, "h": 32, "duration": 100}
],
"meta": {
"frameWidth": 32,
"frameHeight": 32,
"frameCount": 8
}
}
集成模式:
规格:
何时使用:
规格:
限制:
何时使用:
水平布局:
[Frame0][Frame1][Frame2][Frame3]...
垂直布局:
[Frame0]
[Frame1]
[Frame2]
[Frame3]
...
网格布局:
[Frame0][Frame1][Frame2][Frame3]
[Frame4][Frame5][Frame6][Frame7]
[Frame8][Frame9][Frame10][Frame11]
打包布局:
[Frame0][Frame2][Frame5]
[Frame1][Frame3][Frame6]
[Frame4][Frame7]
标准帧格式:
{
"filename": "frame_0.png",
"frame": {"x": 0, "y": 0, "w": 32, "h": 32},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x": 0, "y": 0, "w": 32, "h": 32},
"sourceSize": {"w": 32, "h": 32},
"duration": 100
}
字段解释:
filename: 逻辑帧标识符frame: 在精灵表中的位置和尺寸(像素)rotated: 帧是否旋转了 90°(打包布局)trimmed: 是否移除了透明像素spriteSourceSize: 如果经过修剪,在原画布中的位置sourceSize: 修剪前的原始画布尺寸duration: 帧持续时间(毫秒)元信息:
{
"app": "Aseprite",
"version": "1.3.x",
"format": "RGBA8888",
"size": {"w": 256, "h": 128},
"scale": "1",
"frameTags": [
{"name": "idle", "from": 0, "to": 3, "direction": "forward"},
{"name": "run", "from": 4, "to": 11, "direction": "forward"}
]
}
场景: 用户只想要一帧作为 PNG
1. mcp__aseprite__get_sprite_info(验证帧存在)
2. mcp__aseprite__export_png:
- file_path: "/output/frame.png"
- frame_number: 0(或用户指定)
- scale: 1(或用户指定)
3. 确认导出并报告尺寸
场景: 用户想要整个精灵的动画 GIF
1. mcp__aseprite__get_sprite_info(验证帧数 > 1)
2. mcp__aseprite__export_gif:
- file_path: "/output/animation.gif"
- loop: true
- scale: 2
3. 报告帧数和文件大小
场景: 用户想要用于 Unity/Godot 的精灵表
1. mcp__aseprite__get_sprite_info(检查尺寸和帧数)
2. 如果未指定,询问目标引擎
3. mcp__aseprite__export_spritesheet:
- file_path: "/output/spritesheet.png"
- layout: "grid"
- include_json: true
- padding: 1
- scale: 1
4. 为目标引擎提供集成说明
场景: 用户只想导出一个动画(例如,“奔跑”)
1. mcp__aseprite__get_sprite_info(验证标签存在)
2. mcp__aseprite__export_spritesheet 或 export_gif:
- animation_tag: "run"
- 其他设置视情况而定
3. 确认仅导出了带标签的帧
场景: 用户想要多种缩放比例(1x、2x、4x)
1. 以 scale: 1 导出 PNG/精灵表
2. 以 scale: 2 导出 PNG/精灵表
3. 以 scale: 4 导出 PNG/精灵表
4. 组织文件:sprite_1x.png、sprite_2x.png、sprite_4x.png
5. 报告所有输出及其尺寸
场景: 用户想要将各个图层作为单独文件
1. mcp__aseprite__get_sprite_info(获取图层名称)
2. 对于每个图层:
- mcp__aseprite__export_png:
- layer: "LayerName"
- file_path: "/output/layerName.png"
3. 报告所有导出的图层
工作流程: 创建 → 导出
1. 用户使用像素画创建器技能创建精灵
2. 创建完成后自动提供导出选项
3. 根据精灵类型(静态 vs 动画)建议适当的格式
4. 使用此技能处理导出
工作流程: 制作动画 → 导出
1. 用户使用像素画动画师技能创建动画
2. 动画完成后,提供导出格式:
- 用于网页/社交媒体的 GIF
- 用于游戏的精灵表
3. 使用此技能导出并附带动画元数据
工作流程: 优化 → 导出
1. 用户应用专业技术(抖动、调色板优化)
2. 使用优化设置导出:
- 为 GIF 导出保留调色板
- 为 PNG 使用适当的压缩
3. 此技能处理特定格式的优化
问题: 无效或无法访问的输出路径
解决方案:
1. 验证目录是否存在(如果需要,使用 Bash 创建)
2. 检查写入权限
3. 使用绝对路径,而非相对路径
4. 如果用户提供无效路径,建议有效路径
问题: 用户请求不存在的帧/标签
解决方案:
1. 使用 get_sprite_info 验证可用的帧和标签
2. 向用户列出可用选项
3. 请用户明确他们想要哪一帧/标签
4. 在做出有效选择之前不尝试导出
问题: 导出将创建非常大的文件(GIF >5MB,PNG >10MB)
解决方案:
1. 根据尺寸和帧数计算近似大小
2. 如果大小超过阈值,在导出前警告用户
3. 建议替代方案:
- 减小缩放因子
- 导出更少的帧
- 使用精灵表代替 GIF
- 优化调色板
问题: 用户请求格式不支持的功能(例如,GIF 透明度)
解决方案:
1. 清楚地解释格式限制
2. 建议替代格式或方法
3. 继续进行导出并注明限制
4. 示例:
- GIF 二进制透明度 → 建议使用 PNG 以获得部分 Alpha
- GIF 256 色限制 → 建议先进行调色板优化
问题: 非整数缩放或过度缩放
解决方案:
1. 只接受整数缩放因子(1、2、3、4 等)
2. 如果缩放 >4 则警告(可能创建非常大的文件)
3. 解释像素完美缩放的好处
4. 为用户的使用场景建议适当的缩放比例
导出成功完成时:
向用户报告:
✓ 导出完成:/path/to/output.png
- 格式:带透明度的 PNG
- 尺寸:64x64(从 32x32 原始尺寸 2 倍放大)
- 帧数:1(静态图像)
- 文件大小:~8KB
[对于精灵表,还包括:]
- 布局:网格 (4x2)
- 每帧尺寸:32x32
- 总帧数:8
- JSON 元数据:/path/to/output.json
- 集成:已准备好导入 Unity/Godot
[如果适用,提供相关的集成代码片段]
导出后指导:
每周安装次数
–
代码仓库
GitHub 星标数
109
首次出现时间
–
安全审计
The Pixel Art Exporter Skill enables exporting pixel art sprites from Aseprite to various formats optimized for different use cases. This includes single images (PNG), animated GIFs, spritesheets, and JSON metadata for game engines.
Core Capabilities:
Export Formats Supported:
This Skill works with the pixel-mcp server tools to produce production-ready assets for web, games, and applications.
Invoke this Skill when the user:
Example Triggers:
For static sprites or single frames:
Get Sprite Information First
Use mcp__aseprite__get_sprite_info to understand: - Current dimensions - Number of frames - Available layers - Color mode and transparency settings
Export PNG with Transparency
Use mcp__aseprite__export_png: - file_path: Absolute path (e.g., "/path/to/output/sprite.png") - frame_number: Specific frame (0-indexed) or omit for current frame - layer: Specific layer name or omit for merged output - scale: Scaling factor (1, 2, 4, etc.) - default is 1
Export Options
Example Workflow:
1. Get sprite info to verify dimensions and frame count
2. Export PNG: mcp__aseprite__export_png with desired frame and scale
3. Confirm file creation and report dimensions to user
For animations intended for web or presentations:
Verify Animation Setup
Use mcp__aseprite__get_sprite_info to check: - Frame count (needs 2+ frames) - Frame durations (timing information) - Animation tags (if specific tag requested) - Sprite dimensions
Export GIF
Use mcp__aseprite__export_gif: - file_path: Output path (e.g., "/path/to/animation.gif") - animation_tag: Optional - specific tag name to export - loop: true (infinite loop) or false (play once) - scale: Upscaling factor if needed
GIF Optimization Considerations
Example Workflow:
1. Verify sprite has multiple frames
2. Export GIF with appropriate loop setting
3. Report file size and frame count to user
4. Suggest optimization if file is large (>1MB)
For game engines and texture atlases:
Layout Types:
* **Horizontal** : All frames in a single row (good for scrolling animations)
* **Vertical** : All frames in a single column (good for CSS animations)
* **Grid** : Frames arranged in rows and columns (balanced dimensions)
* **Packed** : Optimized packing to minimize texture size (engine-specific)
2. Export Spritesheet
Use mcp__aseprite__export_spritesheet:
- file_path: Output PNG path (e.g., "/path/to/spritesheet.png")
- layout: "horizontal", "vertical", "grid", or "packed"
- animation_tag: Optional - export specific animation only
- scale: Upscaling factor
- padding: Pixels between frames (default 0, common: 1-2)
- include_json: true to generate metadata file
3. JSON Metadata Structure
When include_json: true, creates a .json file with:
{
"frames": [
{
"filename": "frame_0.png",
"frame": {"x": 0, "y": 0, "w": 32, "h": 32},
"spriteSourceSize": {"x": 0, "y": 0, "w": 32, "h": 32},
"sourceSize": {"w": 32, "h": 32},
"duration": 100
}
],
"meta": {
"app": "Aseprite",
"version": "1.3.x",
"format": "RGBA8888",
"size": {"w": 256, "h": 32},
"scale": "1"
}
}
4. Layout Selection Guidelines
* **Horizontal** : Best for web/CSS sprite animations, simple scrolling
* **Vertical** : Mobile-friendly, vertical scrolling animations
* **Grid** : Unity, Godot - balanced texture dimensions (power-of-2)
* **Packed** : Advanced engines with atlas support (Phaser, LibGDX)
Example Workflow:
1. Ask user about target platform if not specified
2. Recommend layout based on use case
3. Export spritesheet with JSON metadata
4. Report texture dimensions and frame count
5. Provide integration code sample for their engine
For game engine integration:
Unity:
* Use "grid" layout for Unity's Sprite Editor
* JSON provides frame coordinates for slicing
* Include padding to prevent texture bleeding
Godot:
* Use "horizontal" or "grid" layout
* JSON maps to AnimatedSprite frames
* Frame duration converts to FPS
Phaser:
* Use "packed" layout for optimal performance
* JSON follows Texture Packer format
* Supports trimmed sprites and rotation
Generic/Custom:
* Standard frame array with x, y, w, h coordinates
* Duration in milliseconds per frame
* Animation tag groupings
2. Export with Metadata
Always include JSON when exporting for game engines:
- Set include_json: true in export_spritesheet
- JSON file created with same name as PNG (different extension)
- Contains frame positions, durations, and sprite metadata
3. Metadata Usage Examples
Parsing in JavaScript (Phaser):
this.load.atlas('sprite', 'spritesheet.png', 'spritesheet.json');
this.add.sprite(x, y, 'sprite', 'frame_0.png');
Parsing in C# (Unity):
// Import spritesheet.png with Multiple sprite mode
// Use JSON to set sprite rectangles in Sprite Editor
Pixel-perfect upscaling for high-resolution displays:
When to Scale
Scaling Best Practices
Apply Scaling
Add scale parameter to any export: - mcp__aseprite__export_png: scale: 2 - mcp__aseprite__export_gif: scale: 4 - mcp__aseprite__export_spritesheet: scale: 2
Resolution Recommendations
1. Get sprite info to verify single frame
2. Export PNG at 2x scale with transparency
3. Optimize PNG with compression tools if needed
4. Provide HTML/CSS example for display
1. Verify animation has multiple frames and tags
2. Export spritesheet with "grid" layout
3. Include JSON metadata (include_json: true)
4. Set appropriate padding (1-2 pixels)
5. Scale if needed (typically 1x for engines)
6. Provide code snippet for target engine
1. If multiple layers, export each separately
2. Use PNG format with transparency
3. Scale to multiple sizes (16x16, 32x32, 64x64)
4. Batch export all sizes
5. Organize in output directory structure
1. Verify frame timing is appropriate (100-200ms typical)
2. Export GIF with loop: true
3. Scale to 2x or 4x for visibility
4. Check file size (optimize if >2MB)
5. Suggest hosting platforms if needed
1. Verify tiles are uniform size (e.g., 16x16, 32x32)
2. Export as grid spritesheet
3. Set padding to 0 or 1 (depends on engine)
4. Include JSON for tile coordinates
5. Provide tile size and grid dimensions
Export Settings:
Import Steps:
Code Example:
SpriteRenderer renderer = GetComponent<SpriteRenderer>();
renderer.sprite = sprites[frameIndex];
Export Settings:
Import Steps:
Code Example:
$AnimatedSprite.play("run")
$AnimatedSprite.speed_scale = 1.0
Export Settings:
Import Steps:
Code Example:
this.load.atlas('player', 'spritesheet.png', 'spritesheet.json');
this.anims.create({
key: 'run',
frames: this.anims.generateFrameNames('player', {
prefix: 'frame_',
suffix: '.png',
start: 0,
end: 7
}),
frameRate: 10,
repeat: -1
});
Export Settings:
JSON Structure:
{
"frames": [
{"x": 0, "y": 0, "w": 32, "h": 32, "duration": 100}
],
"meta": {
"frameWidth": 32,
"frameHeight": 32,
"frameCount": 8
}
}
Integration Pattern:
Specifications:
When to Use:
Specifications:
Limitations:
When to Use:
Horizontal Layout:
[Frame0][Frame1][Frame2][Frame3]...
Vertical Layout:
[Frame0]
[Frame1]
[Frame2]
[Frame3]
...
Grid Layout:
[Frame0][Frame1][Frame2][Frame3]
[Frame4][Frame5][Frame6][Frame7]
[Frame8][Frame9][Frame10][Frame11]
Packed Layout:
[Frame0][Frame2][Frame5]
[Frame1][Frame3][Frame6]
[Frame4][Frame7]
Standard Frame Format:
{
"filename": "frame_0.png",
"frame": {"x": 0, "y": 0, "w": 32, "h": 32},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x": 0, "y": 0, "w": 32, "h": 32},
"sourceSize": {"w": 32, "h": 32},
"duration": 100
}
Fields Explained:
filename: Logical frame identifierframe: Position and size in spritesheet (pixels)rotated: Whether frame is rotated 90° (packed layouts)trimmed: Whether transparent pixels were removedspriteSourceSize: Position within original canvas if trimmedsourceSize: Original canvas size before trimmingduration: Frame duration in millisecondsMeta Information:
{
"app": "Aseprite",
"version": "1.3.x",
"format": "RGBA8888",
"size": {"w": 256, "h": 128},
"scale": "1",
"frameTags": [
{"name": "idle", "from": 0, "to": 3, "direction": "forward"},
{"name": "run", "from": 4, "to": 11, "direction": "forward"}
]
}
Scenario: User wants just one frame as PNG
1. mcp__aseprite__get_sprite_info (verify frame exists)
2. mcp__aseprite__export_png:
- file_path: "/output/frame.png"
- frame_number: 0 (or user-specified)
- scale: 1 (or user-specified)
3. Confirm export with dimensions
Scenario: User wants animated GIF of entire sprite
1. mcp__aseprite__get_sprite_info (verify frames > 1)
2. mcp__aseprite__export_gif:
- file_path: "/output/animation.gif"
- loop: true
- scale: 2
3. Report frame count and file size
Scenario: User wants spritesheet for Unity/Godot
1. mcp__aseprite__get_sprite_info (check dimensions and frames)
2. Ask about target engine if not specified
3. mcp__aseprite__export_spritesheet:
- file_path: "/output/spritesheet.png"
- layout: "grid"
- include_json: true
- padding: 1
- scale: 1
4. Provide integration instructions for target engine
Scenario: User wants to export just one animation (e.g., "run")
1. mcp__aseprite__get_sprite_info (verify tag exists)
2. mcp__aseprite__export_spritesheet or export_gif:
- animation_tag: "run"
- Other settings as appropriate
3. Confirm only tagged frames exported
Scenario: User wants multiple scales (1x, 2x, 4x)
1. Export PNG/spritesheet at scale: 1
2. Export PNG/spritesheet at scale: 2
3. Export PNG/spritesheet at scale: 4
4. Organize files: sprite_1x.png, sprite_2x.png, sprite_4x.png
5. Report all outputs with dimensions
Scenario: User wants individual layers as separate files
1. mcp__aseprite__get_sprite_info (get layer names)
2. For each layer:
- mcp__aseprite__export_png:
- layer: "LayerName"
- file_path: "/output/layerName.png"
3. Report all exported layers
Workflow: Create → Export
1. User creates sprite with Pixel Art Creator Skill
2. Automatically offer export options when creation complete
3. Suggest appropriate format based on sprite type (static vs animated)
4. Use this Skill to handle export
Workflow: Animate → Export
1. User creates animation with Pixel Art Animator Skill
2. When animation complete, offer export formats:
- GIF for web/social
- Spritesheet for games
3. Use this Skill for export with animation metadata
Workflow: Optimize → Export
1. User applies professional techniques (dithering, palette optimization)
2. Export with optimized settings:
- Preserve palette for GIF export
- Use appropriate compression for PNG
3. This Skill handles format-specific optimization
Problem: Invalid or inaccessible output path
Solution:
1. Verify directory exists (create if needed using Bash)
2. Check write permissions
3. Use absolute paths, not relative
4. Suggest valid path if user provides invalid one
Problem: User requests frame/tag that doesn't exist
Solution:
1. Use get_sprite_info to verify available frames and tags
2. List available options to user
3. Ask user to clarify which frame/tag they want
4. Don't attempt export until valid selection made
Problem: Export will create very large file (GIF >5MB, PNG >10MB)
Solution:
1. Calculate approximate size based on dimensions and frame count
2. Warn user before export if size exceeds thresholds
3. Suggest alternatives:
- Reduce scale factor
- Export fewer frames
- Use spritesheet instead of GIF
- Optimize palette
Problem: User requests feature not supported by format (e.g., GIF transparency)
Solution:
1. Explain format limitation clearly
2. Suggest alternative format or approach
3. Proceed with export noting the limitation
4. Examples:
- GIF binary transparency → suggest PNG for partial alpha
- GIF 256-color limit → suggest palette optimization first
Problem: Non-integer scale or excessive scaling
Solution:
1. Only accept integer scale factors (1, 2, 3, 4, etc.)
2. Warn if scale >4 (may create very large files)
3. Explain pixel-perfect scaling benefits
4. Suggest appropriate scale for user's use case
Export completed successfully when:
Report to User:
✓ Export complete: /path/to/output.png
- Format: PNG with transparency
- Dimensions: 64x64 (2x scale from 32x32 original)
- Frames: 1 (static image)
- File size: ~8KB
[For spritesheets, also include:]
- Layout: Grid (4x2)
- Frame dimensions: 32x32 each
- Total frames: 8
- JSON metadata: /path/to/output.json
- Integration: Ready for Unity/Godot import
[Provide relevant integration code snippet if applicable]
Post-Export Guidance:
Weekly Installs
–
Repository
GitHub Stars
109
First Seen
–
Security Audits
shadcn/ui 框架:React 组件库与 UI 设计系统,Tailwind CSS 最佳实践
56,500 周安装