Ui asset pipeline

Skill MRCalderon3D/everything-game-dev-code/skills/art-audio-content/ui-asset-pipeline

Define import, 9-slice, atlas packing, theming, and naming rules for UI visual assets (buttons, panels, icons, bars).From its SKILL.md

Install

npx -y skills add MRCalderon3D/everything-game-dev-code --skill ui-asset-pipeline

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

SKILL.md

3.5 KB, as published. Nobody here has run it

UI Asset Pipeline

Purpose

Define import, 9-slice configuration, atlas packing, theming, and naming rules for UI visual assets so they scale correctly across resolutions, remain consistent with the visual theme, and are replaceable without code changes.

Use When

the project needs UI visual assets (buttons, panels, icons, progress bars, backgrounds)
placeholder UI rectangles are being replaced with styled assets
a UI theme or skin system needs standardization
new UI screens are being added and need visual assets that follow project conventions

Inputs

art bible or UI style guide (palette, typography, spacing, border radius)
target resolutions and aspect ratios
UI element inventory (buttons, panels, icons, bars, dividers, tooltips)
9-slice requirements per element type
atlas packing strategy (single UI atlas vs per-screen)

Process

define UI asset categories, naming convention, and folder structure
set resolution, format, and import settings per category (sprites vs raw textures)
establish 9-slice borders for scalable elements (buttons, panels, dialogs)
configure UI atlas packing groups and max atlas size
define theme structure (base palette, variant overrides, font pairing)
validate that all UI assets render correctly at min and max supported resolutions

Outputs

UI asset naming and folder convention document
import settings template per UI asset category
9-slice border specification per scalable element
UI atlas packing configuration
theme definition (palette, fonts, spacing, variants)
validation checklist for new UI asset submissions

Quality Bar

every UI asset follows the naming convention and lives in the correct folder
9-slice borders are correct — no stretching artifacts at any supported resolution
UI atlas does not exceed platform texture memory budget
theme is applied consistently — no one-off color or font overrides in individual screens
all UI elements are legible at the smallest supported resolution

Common Failure Modes

9-slice borders set incorrectly, causing visual distortion on resize
inconsistent padding or margin between UI elements across screens
UI atlas too large because high-res assets were used where 9-slice would suffice
theme colors hardcoded per element instead of referenced from a central palette
icons rendered at wrong resolution, appearing blurry or oversized

Related Agents

2d-artist
ui-ux-designer
ui-programmer

Related Commands

ui-asset-pass
ui-flow-review
perf-budget

Related Skills

generated-raster-asset-pipeline

Notes

Keep this skill aligned with the relevant rules layer and current project documentation.
If engine-specific constraints materially change the workflow, hand off to the matching engine skill or engine-specific reviewer.
UI assets can be generated programmatically via the engine's editor-scripting or pixel-buffer APIs — this skill's conventions apply equally to hand-drawn and code-generated assets. The concrete API belongs to the active engine layer.
If UI skins or icons are generated with an image model, pair this skill with generated-raster-asset-pipeline so transparency, crop cleanliness, 9-slice readiness, and declared display-size expectations are validated before acceptance.