Sketch Art Production Guidelines

Sketch Art Production Guidelines

The working principle is the same as in Photoshop:

the cleaner the layer and group structure is in Sketch, the more predictable the generated Unity hierarchy becomes.

1. Keep the board and naming conventions stable

• Use a fixed artboard size for the project.
• Use English letters, numbers, and underscores in layer names.
• Remove hidden or abandoned layers before delivery.

This is the foundation for every later rule.

2. Treat groups and frames as hierarchy signals

Groups and frames should describe meaningful UI structure, not only visual convenience.

Good candidates for grouped parents:

• modal containers
• tab blocks
• icon + label units
• repeated card structures

If a designer would struggle to explain the hierarchy in the source file, Unity will struggle to inherit it cleanly.

3. Flatten composite visual elements before export

If an element depends on:

• multiple vector paths
• masking stacks
• heavy effects
• blended decorative layers

turn it into a single exportable unit before it enters the generation path.

The point is not to preserve every design-tool trick. The point is to preserve a stable delivery unit.

4. Use slices when transparent bounds matter

Sketch exports often trim transparent space automatically. That is convenient for loose asset export, but dangerous when the transparent area is part of alignment or spacing logic.

Use a dedicated slice when the asset needs:

• shadow padding
• transparent breathing room
• a fixed click area
• alignment space that must survive export

5. Keep text boxes fixed and font mapping realistic

For text-heavy UI:

• prefer fixed-size text boxes for multiline content
• keep font naming close to what the Unity project can actually map
• avoid relying on implicit layout growth

Font mismatches and text overflow issues are usually easier to prevent in the design file than to patch after generation.

6. Prepare stretchable assets for 9-slice handling

For scalable panels and containers:

• leave a clean straight region for stretching
• avoid fine decorative detail in the future stretch zone
• keep the corners visually separate from the center area

This reduces later rework when the Unity side needs 9-slice configuration.

7. Quick pre-delivery checklist

Before sending a Sketch file into the workflow, verify:

• naming is consistent
• groups and frames reflect real UI ownership
• slices preserve the correct bounds
• text boxes are fixed where layout stability matters
• fonts can be mapped inside the Unity project
• complex visuals are flattened into stable assets

8. Why this matters

This guideline is not trying to enforce one visual style.

It exists to make Sketch a reliable production input so the generated UI can be evaluated on real delivery quality instead of getting stuck on preventable structure problems.