I am trying to export layers from an ai file, but when I export the pngs they all come out centered. I need to export the layers so that I can assemble the layers randomly for example several different hats. I have searched around and tried to import into photoshop and export from there, but that hasn't turned out well. Appreciate any advice.
-
Welcome to GD.SE! Can you explain your issue better, for example with screenshot(s)?– MenschCommented Nov 29, 2021 at 23:43
-
Hi. Welcome to GDSE. How are you exporting the layers, and what are your export settings?– Billy KerrCommented Nov 30, 2021 at 0:16
-
I have a character that has a body, eyes, hat, arms and a shirt, but I have many versions of each item like top hat, baseball hat etc... When I export each layer from ai the transparent PNGs have the hat (for example) centered on the canvas. I need the hat to stay in its original position so I can randomly merge different traits with code. If the layers are all centered the code generates an image with all items stacked in the center. How can I export layers so that each piece of the character stays in its respective spot?– Mr BrimmCommented Nov 30, 2021 at 0:48
-
@BillyKerr I am exporting layers by selecting each layer, left click, collect for export as single asset and when all assets have been added to the panel I hit the export button as 1x PNG.– Mr BrimmCommented Nov 30, 2021 at 1:04
-
Yeah, that's likely your problem then. You are just exporting the objects themselves without any background element. Scott has given the answer. I'd also suggest the same.– Billy KerrCommented Nov 30, 2021 at 11:22
1 Answer
Draw no-fill, no-stroke, rectangle at the size of the final PNG. Add that, in the same position, to each asset so they are all the same size upon export.
Or, use the artboard as the export dimensions.
Basically, you want all the PNGs to be the same width and height... regardless of the dimensions of the specific contents.
You can't have any sort of "placement" of objects unless the area of visibility is the same across all assets.
You essentially want the "hollow" rectangle to remain consistent across all assets, while what is inside the rectangle will change position. This way, everything will be in the correct position when the PNGs are stacked.