Highlighted

Artboards are enlarged when shared for review

New Here ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi,

 

I am working on a 1900x1000px artboard. Everything looks fine when I export images at 1x size manually. However, when I share for review, for some reason Adobe XD tend to enlarge artboards to 2x and this cause different anti-aliasing when viewing in a browser. Fonts are bolder and looking very weird, thin lines are larger, borders are not looking good etc... I'm assuming it is due to viewing at 50% since an image is enlarged, but you can't view it at 100% in a browser at 1080p.

 

This cause a lot of stress for me while working, especially because my clients are asking for a pixel perfect design. I have to export each artboard manually for them to look at, and then we use online specs for feedback.

 

I'm wondering why is that? It just doesn't make sense for me.

 

Cheers,

Deni

TOPICS
Product performance

Views

319

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

Artboards are enlarged when shared for review

New Here ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi,

 

I am working on a 1900x1000px artboard. Everything looks fine when I export images at 1x size manually. However, when I share for review, for some reason Adobe XD tend to enlarge artboards to 2x and this cause different anti-aliasing when viewing in a browser. Fonts are bolder and looking very weird, thin lines are larger, borders are not looking good etc... I'm assuming it is due to viewing at 50% since an image is enlarged, but you can't view it at 100% in a browser at 1080p.

 

This cause a lot of stress for me while working, especially because my clients are asking for a pixel perfect design. I have to export each artboard manually for them to look at, and then we use online specs for feedback.

 

I'm wondering why is that? It just doesn't make sense for me.

 

Cheers,

Deni

TOPICS
Product performance

Views

320

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
Jul 05, 2019 0
Adobe Employee ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi Deni,

Thank you for reaching out. I understand how you feel. I have tried to reproduce the same at my end. Yes, you are correct this is due to viewing at 50%. I would suggest trying to view using share for development and let us know if that helps.

Thanks,

Harshika

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 05, 2019 1
Adobe Community Professional ,
Jul 05, 2019

Copy link to clipboard

Copied

Is this a known bug? Is there a difference in how a prototype will be represented when using share for development versus share for review?

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 05, 2019 1
New Here ,
Jul 05, 2019

Copy link to clipboard

Copied

cmgap  wrote

Is this a known bug? Is there a difference in how a prototype will be represented when using share for development versus share for review?

The difference between is that in 'share for development' you can click on elements to see styles, also you can export assets.

In 'share for review' you have only an image and clients can pin/point comment on it. For instance, it's the same thing if you manually export an artboard, but unfortunately for some reason Adobe XD double up the size of artboards and this makes it awful looking at 50% on normal displays.

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 05, 2019 0
Adobe Community Professional ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi - thanks for answering that - I meant why is there a difference in the way Xd exports the artboards in the first place? I understand that the share for developer allows for details and downloads.

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 05, 2019 0
Adobe Employee ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi Denise,

If both the artboard and browser are at 100%, they both look similar. So, we just need to make sure we are viewing the design at 100% on the browser as well and let us know if that works for you.

Thanks,

Harshika

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 05, 2019 0
Adobe Employee ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi Celeste,

There is no difference. We asked to check for share for development because we wanted to make sure that the dimension is correct in design specs. It looks similar when viewing at 100% on both browser and the artboard.

Thanks,

Harshika

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 05, 2019 0
New Here ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi Harshika,

I really don't want to be rude, it is not my intention, however, I'm not sure why are you avoiding my question.

It is quite simply, why does Adobe XD enlarge artboards when sharing for review? It really doesn't makes sense.

Also, your suggestions are not what I'm looking for, this sounds to me like avoiding the obvious issue. I gave my explanation why, also I've explained everything. Quite sure for everyone it is a natural behavior if you have an artboard of 1900x1000px to review it at that exact same size, not at 3800x2000px. Since the image is reduced to 50% while reviewing. it makes a lot of weird issues to work on.

Please fix this so we can easily work with out clients. Thank you in advance.

Cheers,

Deni

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 05, 2019 0
Adobe Employee ,
Jul 08, 2019

Copy link to clipboard

Copied

Hi Deni,

When you publish and share a link for review, the artboard size should be the same, and not 2x or enlarged.
The design content might appear to be fit in, but it should definitely not show up enlarged than its original size.

To make sure I am seeing the correct problem that you are describing here, is it possible for you to share a link where I can see this issue? You can also choose to share the link with only me in private, by clicking on my profile name and sending me a message.

Thanks!  

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 08, 2019 1
New Here ,
Jul 08, 2019

Copy link to clipboard

Copied

Hi Arunk,

Well, I'm afraid it is not. For instance, if I right click and download the image through a browser I get 3800x2000px instead of 1900x1000px. So this means viewing at a regular HD resolution makes it 50% which makes all kinds of distortion, especially on fonts, borders and lines.

I'm sorry, but I am obligated by contract, so I can't share the link. However, you can easily test it by yourself. Make an 1900x1000px artboard, put some content on it, share for review, look carefully at fonts and you'll see what I'm talking about. Download the image to see the size.

Cheers,

Deni

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 08, 2019 0
New Here ,
Jul 05, 2019

Copy link to clipboard

Copied

Hi Harshika,

Thank you for your quick response, I appreciate it a lot.

I'm afraid this is not a solution to the problem. For instance, sometimes I have to change things on the fly while video conferencing and upload it quickly for my clients. Upload for 'share for development' takes to much time, keep in mind I'm working on 30+ artboards in one file. Also, I would have to educate clients what not to use, which is like adding oil to the fire.

If I may ask a question, why do you double up the size of an artboard in 'share for preview', what's the reason behind it?

It would be nice to choose to go with the actual size, which is more natural.

Cheers,

Deni

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 05, 2019 0
Community Beginner ,
Jul 08, 2019

Copy link to clipboard

Copied

Hi Deni,

In order to render images properly without distortion at 1x displays (lower resolution), we let the browser handle appropriate scaling. But looks like it is not happening in your case. For us to investigate further, can you please share the following details ?

1. Browser

2. Browser version

3. OS

4. Monitor details and the display resolution.

Regards,

Aasma (Adobe)

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 08, 2019 1
New Here ,
Jul 09, 2019

Copy link to clipboard

Copied

Hi Aasma,

Sure, no problem.

Not sure how this will help, and why do you think it is related, but okay, here it is. It behaves the same in all major browsers. Clearly it's an issue on your part.

1. 'Google Chrome Version' and 'Firefox Quantum'

2. '75.0.3770.100 (Official Build) (64-bit)' and '67.0.4 (64-bit)'

3. Windows 10 Pro (64-bit)

4. Dell U2412M

Here's even inspected element with the developer's tool.

<canvas width="3840" height="2174" id="canvas-1" style="width: 100%; height: 100%; display: block; touch-action: pinch-zoom;"></canvas>

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 09, 2019 0
Adobe Community Professional ,
Jul 09, 2019

Copy link to clipboard

Copied

The artboard scales with  the size of the browser window. If I follow your steps  and create an  artboard at 1900 x 1000, add content, share for review, open the link in a browser (firefox in this instance) the image size is indeed variable as it  scales  to the size  of  the  browser window as I expand or contract it. I would expect that behavior. Are you describing and instance where you don't  want the  art board  to scale accordingly?

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 09, 2019 1
New Here ,
Jul 09, 2019

Copy link to clipboard

Copied

I really don't want to be rude, but I'm quite sure that I've explained everything in my previous posts.

The artboard scales with  the size of the browser window.

This is not an issue, this is a normal behavior. Again, I don't want to be rude, but I'm quite sure more experienced designers understand what I'm talking about.

Okay, let's do it again like this:

Working Artboard locally in Adobe XD

100% = 1900x1000px

Sharing for review

100% = 3800x2000px

Viewing in a browser (this is where it looks weird because it is shrunken down)

50% = 1900x1000px

So let's add another variable. You can mimic this even with a normal photo preview software of any choice. Everything that's below 100% size it will distort an image. Quite sure this is known to all designers out there.

For instance, desktop preview works as it should, and it must work like that in a browser, as well. 1900x1000px works (100%) in full screen on any given browser.

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 09, 2019 0
New Here ,
Jul 09, 2019

Copy link to clipboard

Copied

One additional thing to my previous comment.

It is very easy to check it, I even mentioned it above in comments.

1. Make an 1900x1000px artboard

2. Put some fonts/content (You can even leave it blank)

3. Share for review

4. Open the link in browser

5. Right click and save the image on your computer

You'll see that the resolution of downloaded image is 3800x2000px.

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 09, 2019 0
Adobe Community Professional ,
Jul 10, 2019

Copy link to clipboard

Copied

That's a normal outcome if you are on Mac's retina display - everything displayed is double density (not just XD, any web page is double size). But you're on PC - not sure if things are the same on Windows.

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 10, 2019 1
New Here ,
Jul 10, 2019

Copy link to clipboard

Copied

Again, this doesn't make sense. It is not a normal outcome nor it is natural. You can't make your software only for a specific device, it has to work properly on any device and resolution out there.

With that being said, I can't force my clients to use a specific device, it is ridiculous. I should have used Adobe's competitors, because this is very stressful, especially when you have clients that needs a pixel perfect design.

If I can export artboards manually at 1x and 2x size, I should be able to choose it when sharing for review. Not sure why 2x size is the only option.

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 10, 2019 0
New Here ,
Aug 06, 2019

Copy link to clipboard

Copied

As expected!

Perfect example of how big companies don't give a crap about their customers. Probably going to move on to competitors. SHAME!

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...
Aug 06, 2019 0
New Here ,
Feb 24, 2020

Copy link to clipboard

Copied

It is truly unfortunate that this can't be resolved someway. I was excited to learn that Xd had this feature and have been wrestling with trying to get the share for review to show to scale in the browser as it should. This was always a problem as a designer showing clients layouts and having to explain that 'it will be a different size when it is built'. Then i discovered Invision. They get it and Adobe should take note from what they have created. Upload a 1x or 2x design and it isn't scaled for the user. This would seem like a no brainer when it comes to reviewing pixel-perfect layouts... Anyways, long story short you can't depend on this feature from Adobe... you'll just have to utilize Invision for your client interfacing. 

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...
Feb 24, 2020 0