Photoshop Art Production Guidelines
Keep layer structure, naming, slicing, and font mapping predictable so generated Unity UI stays close to the Photoshop source.
Photoshop Art Production Guidelines
The core rule is simple:
what the layer structure looks like in Photoshop is very close to what the node structure will look like in Unity.
If the source file is inconsistent, VectoUI cannot reliably “guess” the project intent later.
1. Basic file rules
- Keep one agreed canvas size for the project.
- Use English letters, numbers, and underscores in layer and group names.
- Remove hidden draft layers before delivery.
These are small rules, but they prevent a large amount of noisy output.
2. Treat groups as structural parents
A Photoshop group maps naturally to a parent node in Unity.
Use grouping intentionally for:
- panels
- dialog containers
- button blocks
- icon + text clusters
If the group boundary is unclear in the source file, the generated UI hierarchy will also be unclear.
3. Flatten visually complex elements
When a badge, button, or decorative element relies on:
- multiple clipped layers
- heavy compositing
- mixed masks
- unsupported blend modes
convert it into a smart object or a single exportable image unit first.
VectoUI is much better at honoring a clear visual asset boundary than trying to infer a complicated Photoshop effect stack at runtime.
4. Preserve transparent bounds on purpose
One common production issue is that export tools trim transparent pixels automatically. That can make the final Unity size and alignment feel “wrong” even when the visible graphic looks correct.
When an asset depends on:
- glow
- shadow
- fixed padding
- transparent alignment space
define the export bounds manually so the generated asset keeps the intended size.
5. Keep text and fonts predictable
For text:
- prefer stable text boxes for multi-line content
- keep font naming aligned with Unity font assets whenever possible
- do not rely on loose, auto-growing text blocks for critical layout
If text rules are inconsistent in the source file, the output usually fails first in alignment and overflow handling.
6. Prepare stretchable assets explicitly
For panels, backgrounds, and boxes that will be stretched later:
- leave clear straight edges
- avoid messy decorative borders in the stretch zone
- keep the center area predictable for later 9-slice handling
The cleaner the stretch region is, the easier it becomes to finish the Unity-side configuration.
7. What to check before delivery
Before handing a Photoshop file into the generation workflow, confirm:
- naming is clean and consistent
- groups reflect UI hierarchy
- hidden scrap layers are removed
- composite elements are flattened intentionally
- transparent bounds are preserved where needed
- fonts can be mapped on the Unity side
8. What this guideline is really for
The goal is not visual taste alone.
It is to make the design source a reliable delivery input, not just a visually correct mockup. Once these rules are stable, the rest of the integration and troubleshooting path gets much easier.
Next Step
After this design-guidelines article, the next question usually moves into workflow or comparison
Input-quality articles should connect to published workflow and evaluation pages once the guideline itself is clear.
Open the broader game UI pipeline page
Use the pipeline page when the team needs to place these rules into a larger delivery workflow.
Open pipeline pageCompare manual delivery against automation
Use the comparison page when the team is still judging whether automation is worth adopting.
Open comparisonUse community for project-specific exceptions
Project-specific guideline exceptions should continue in public support.
Open community