Highlighted

Export not on the same size that the component

Community Beginner ,
Jun 29, 2020

Copy link to clipboard

Copied

Hi everyone 🙂

I have an issue regarding exports.
When I export some components, the file is not on the same size (few pixels more) than the original.
For example, you can see that this component is 512*512
Capture d’écran 2020-06-29 à 15.53.43.png

 

When I export it, it is 513*519:
Capture d’écran 2020-06-29 à 15.54.50.png
It's a big issue for me as it is a visual used for the App Store / Android. So it must be pixel-perfect 😕

Thanks for your help!

Damien

Adobe Community Professional
Correct answer by Spas K. | Adobe Community Professional

Okay, so I exported as is, and I got 512 x 519, same as you.

The problem were indeed the shadows of the cards, apparently they extend beyond the purple square.

Once I moved the King and the Z card up a bit, I managed to export 512x512. Reducing their shadows to Y:1 Blur: 3 also does the job.

 

Here's the file, so you can check it out: https://we.tl/t-zGer6nuVi9

 

dstoic_0-1593530819206.png

 

Views

93

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Export not on the same size that the component

Community Beginner ,
Jun 29, 2020

Copy link to clipboard

Copied

Hi everyone 🙂

I have an issue regarding exports.
When I export some components, the file is not on the same size (few pixels more) than the original.
For example, you can see that this component is 512*512
Capture d’écran 2020-06-29 à 15.53.43.png

 

When I export it, it is 513*519:
Capture d’écran 2020-06-29 à 15.54.50.png
It's a big issue for me as it is a visual used for the App Store / Android. So it must be pixel-perfect 😕

Thanks for your help!

Damien

Adobe Community Professional
Correct answer by Spas K. | Adobe Community Professional

Okay, so I exported as is, and I got 512 x 519, same as you.

The problem were indeed the shadows of the cards, apparently they extend beyond the purple square.

Once I moved the King and the Z card up a bit, I managed to export 512x512. Reducing their shadows to Y:1 Blur: 3 also does the job.

 

Here's the file, so you can check it out: https://we.tl/t-zGer6nuVi9

 

dstoic_0-1593530819206.png

 

Views

94

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jun 29, 2020 0
Adobe Employee ,
Jun 29, 2020

Copy link to clipboard

Copied

Hi there,

 

Thanks for reaching out. We will need to test this on our end, so could you please confirm what preset you selected in Export For and Designed At? Also please confirm the version of Adobe XD, we'll try our best to help you with it.

 

Regards

Rishabh

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 29, 2020 0
Community Beginner ,
Jun 30, 2020

Copy link to clipboard

Copied

Hi Rishabh,

Thanks for your reply!

Well actually this problem is on every export of a lot / selection that I do: PNG / Design or Android, JPG, etc.
Capture d’écran 2020-06-30 à 10.56.54.pngCapture d’écran 2020-06-30 à 10.55.06.png

 

And as you can see, there is a layer around the export, I don't know why =>
MicrosoftTeams-image (4).pngAppLaunchIcon-512x512.jpg

 

I  checked every layer of the component (pattern, color, AppIcone-Spades_img, etc.), there is nothing that is more than 512*512 or going outside the artboard.

Capture d’écran 2020-06-30 à 10.55.52.pngCapture d’écran 2020-06-30 à 10.55.34.png

 

For now, the only solution that  I found is to export the artboard, instead of the composent. But it is not convenient at all for my developers as they use to export all the components of this XD files when they need to upgrade our app files. So it makes them do a special process only for those ones...

Thanks a lot for your kind help,

Damien

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 0
Adobe Community Professional ,
Jun 30, 2020

Copy link to clipboard

Copied

One possible theory is that your artboards and/or elements are not placed on a whole pixel position - I see the Y location is 904.99 in your screen shots - can you try fixing that and see if it helps?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 0
Adobe Community Professional ,
Jun 30, 2020

Copy link to clipboard

Copied

The only thing I can think of is that you probably have a shadow applied on one of these elements that extends outside the bounds of the selection.

 

It isn't included in the bounding box when you select the group/component, but it is probably included in the export. Select all elements and make sure you don't have any shadows applied on anything, and see if its still happening.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 0
Community Beginner ,
Jun 30, 2020

Copy link to clipboard

Copied

Hi @kenneth and @dstoic, thanks for your replies!
I tried both of your solutions, but unfortunately nothing worked 😞 Putting the X / Y oon a whole pixel position + checking for  shadows (there is one but is less than the artboard).
I have made a file with the component, if you want to  try on your side => https://wetransfer.com/linkcomponentspades 
For information my Adobe XD is up-to-date, on Mac (30.2.12.3).

Thanks again for your kind help 🙂

Damien

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 0
Adobe Community Professional ,
Jun 30, 2020

Copy link to clipboard

Copied

Screen Shot 2020-06-30 at 15.55.36.png

My XD creates 512 x 512 (px) PNG/JPEG. I'm on High Sierra 10.13.6 though.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 1
Community Beginner ,
Jun 30, 2020

Copy link to clipboard

Copied

When you export the assets by itself?
When you select the artboard export mode?

I know that on artboard export mode it works, but not when I choose the "Batch" or "Selected" mode. And the problem is that my XD libraries has assets that developpers export on Batch. So I can't make a special process only for those assets 😕

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 0
Adobe Community Professional ,
Jun 30, 2020

Copy link to clipboard

Copied

Okay, so I exported as is, and I got 512 x 519, same as you.

The problem were indeed the shadows of the cards, apparently they extend beyond the purple square.

Once I moved the King and the Z card up a bit, I managed to export 512x512. Reducing their shadows to Y:1 Blur: 3 also does the job.

 

Here's the file, so you can check it out: https://we.tl/t-zGer6nuVi9

 

dstoic_0-1593530819206.png

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 2
Adobe Community Professional ,
Jun 30, 2020

Copy link to clipboard

Copied

Try this: create a 512 x 512 (px) rectangle and place above two groups (Img & Bgd), then select three items and create a masked group (Cmd +Shift + M). Then Batch Export. You'll get 512 x 512 (px) image 😄

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 30, 2020 1
Community Beginner ,
Jul 02, 2020

Copy link to clipboard

Copied

THANKS a lot dstoic!!
Indeed, I didnt' see the XD Shadow on this layer :-//// You were right from the beginning 🙂
There too many issues with XD shadow (not compatible with Unity, etc.) lol.

Thanks again for your help and your time to help me on this issue!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 02, 2020 0
DamienS LATEST
Community Beginner ,
Jul 02, 2020

Copy link to clipboard

Copied

Thanks Kenneth for your kind help 🙂 Dstoic was right, it was because of a XD shadow on one of my layer 😕
But I did your MacGyver solution just before that 😄
Thanks again!!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 02, 2020 0