Indie dev efficiency4 min read

A PSD Panel Gets Thicker Borders When Enlarged? Define the 9-Slice Handoff

Deliver the border agreement alongside the panel image instead of expecting the PNG to determine its own resizing behavior.

A PSD Panel Gets Thicker Borders When Enlarged? Define the 9-Slice Handoff

The AI-generated cover shows a badge and separate decoration, not a nine-slice panel or resizing test. Its important center artwork is also a reason not to assume that any framed image is suitable for nine-slicing.

An elegant PSD panel becomes a PNG, then enlarging the whole image makes its border thicker too. Clarify whether the requirement is larger artwork or more room inside a panel. The latter needs an agreement about borders and center behavior; a PNG extension does not provide that behavior.

Exported pixels and nine-slice settings are separate

The public PSD Layer Exporter description supports pixel-layer images and ZIP packages. It does not promise arbitrary engine nine-slice configuration in that description.

For example, the official Godot NinePatchRect reference source separately documents four patch margins and center stretch or tile modes. This illustrates the distinction between image data and component settings, not identical field names across engines.

A pixel model without additional scaling

Assume a 128×64 image with 12-pixel left and right borders and 10-pixel top and bottom borders. Its center is 104×44. If the layout size becomes 256×96 while those pixel margins remain fixed, the center becomes 232×76.

This changes layout dimensions without extra node-transform or device UI scaling. It is not a measured engine result or a promise about arbitrarily small sizes. When a target is smaller than the margin totals, inspect the receiving component's rules instead of assuming one universal compression behavior.

Judge center artwork and corner decoration separately

A resizable background center is different from a badge, text, or character that must retain its proportions. Where necessary, plan separate decorative elements and position them through the UI layout. Do not claim that the exporter automatically identifies and separates those objects.

Tiling and stretching are also different choices. Repeating textures need seam checks, while stretching can change their appearance. Decide from the actual artwork and component rather than applying one preset to every panel.

Preserve the reference space during export

Keep the source PSD and approved preview, then export the intended pixel layers. If later processing trims transparent borders or changes canvas size, revisit margins defined relative to the image boundary. Replacing an image does not validate old settings.

Record the document, layer, image dimensions, four margins, and center treatment. Derive those values from the actual design, not the example's 12 and 10.

Accept the result at real UI sizes

  • Inspect corners, borders, and center artwork at the planned small and large sizes.
  • Separate layout resizing from whole-object scaling.
  • Check text and decoration against the background; content padding is not automatically the border width.
  • Retain the actual settings and observations, marking untested devices or sizes as unverified.

For basic export steps, see the PSD UI handoff workflow. Downloading a PNG is file delivery, not proof of correct resizing across resolutions.

Recommended tools

Ready to try "A PSD Panel Gets Thicker Borders When Enlarged? Define the 9-Slice Handoff"?

Use our online tools to apply this tutorial to your indie game project right away.