Hello, recently I have published several XD files to share with our dev team and released that some elements were having broken or missing background (see an example attached).
All these elements have in common:
While not critical, it is unpleasant because we have to check all published pages manually and explain developers how the design should actually look like 😕
Hi, with which browser do you view your prototypes?
Thank you for reporting the issue. Have tried to recreate the issue using your reference images but unable to reproduce it.
Could you please provide clear steps to recreate and reproduce the issue. So we can investigate what is leading to background distortion and resolve it asap.
I created a rectangle with color #F1F1F0 and another bit smaller rectangle over it, with color #FFFFFF and shadow #000000 (16%), x=-2, y=0, blur=6. Similarly I created this for dark colors (#252C33 and #2F3740, same shadow). I tested the published result in current Chrome and Firefox on Windows 10 machine. XD is up to date (35.2).
Please find the published page here: https://xd.adobe.com/view/7329ff0e-f1ad-4a6e-8757-2d24a35e2185-267a/specs/ . It looks like the specs values are correct, just the rendering is broken. I can share also the source cloud XD file if you like, however I think it's easy to reconstruct it.
In provided link , I don't see any distortion. Have tested the link in Firefox and Chrome on Windows 10. Even tried by creating new file with given information in XD 35.2 , i don't know what is getting miss.
Attaching the image of your given link and it works perfectly fine for me.
If its still happening , Please provide the file and Windows 10 OS version.
I haven't experienced this personally, but it is a known issue, at least for the users, don't know if the dev team has taken notice of it to fix it. There are a few threads about this, but they all seem to reach a dead end:
I guess you could try copying elements to a new file and publishing from it, to see if the problem persists. It seems to be some sort of internal translation bug when the prototype is converted to png's for the public prototype.
I remember one user had a problem on 1 device and not on another. Also, some browsers seemed to have the issue, and some not. From the link you shared, I don't see any issues:
I know it's not much help, but it's hard to identify these issues that happen randomly and there's no pattern of why or when it's happening 🙂
@Ansubedi03 Please find the XD file here: https://www.dropbox.com/s/8a78p2yen3tdtge/Background%20test%202.xd?dl=0 . I use Windows 10 Enterprise version 1809 (OS build 17763.1577).
I have tried the idea from @Spas K. to copy the file, with the same result. I also tested with further browsers and it looked broken everywhere (Chrome, Firefox, new IE Edge with Chromium engine) except older IE Edge where it looked OK.