Skip to main content
elvencat11
elvencat11
Participating Frequently
November 12, 2020
Answered

When developing a website in Adobe XD measurements are bigger than expected in the design

  • November 12, 2020
  • 2 replies
  • 1040 views

Hi! I have a huge problem. I had to design a website based in another one, so I made a screenshot of this other web so I can have it as a base, (my screen is 1920x1080). I made a 1920x1080 document in adobe XD and pasted the screenshot there. Then I designed my website following the sizes of the elements of the screenshot and everything seemed fine. BUT. When I sent the developers link to the programmer, and he began coding it, we had the surprise that everything seemed MUCH BIGGER that expected, around 25% bigger. He followed all the measurements in the prototype so it was not his fault. I am new to adobe XD and I really don't understand what had happened and what should I do to solve it. Can anyone help, please?

    This topic has been closed for replies.
    Correct answer Harshika Verma

    Hi there,

     

    Sorry for the delay in response. We had a similar discussion that happened in past here: https://community.adobe.com/t5/adobe-xd/which-unit-does-adobe-xd-use-for-pixel-sizing/td-p/8228778#:~:text=Hi!-,XD,%2C%20incidentally%2C%20a%20point).

     

    Please check and see if that helps.

     

    Thanks,

    Harshika

    2 replies

    Chris W. Griffith
    Community Expert
    Chris W. GriffithCommunity Expert
    Community Expert
    November 12, 2020

    A lot of variables in play here. Double check that the dev's browser is not zoomed it. I have seen issues where they have it zoomed in and forget about it. Then look at one element, a title or something. Use the browser's devtools to see the entire CSS that is being applied. That might be the clue you need to solve this.

    elvencat11
    elvencat11Author
    Participating Frequently
    November 26, 2020

    Hi! thanks so much for the reply.
    I am afraid its not that developer's browser was zoomed, the problem was with the prototype itself. I don't know why but doing it at 1920x1080 makes everything 20% bigger than expected. So, in order to solve it, I had to make everything again (fonts, icons, elements and even the canvas) 20% smaller, this way they the development prototype had the correct parameters.

     

    I am afraid this is a huge bug of adobe xd. Another problem we faced is that developers needed the parameters in % but the prototype only showed them in px/pt/dp. It's a shame because I really liked the program, but with all this stuff I am seriously considering moving to Sketch or another prototyping software...

    Harshika Verma
    Community Manager
    Harshika VermaCommunity ManagerCorrect answer
    Community Manager
    December 2, 2020

    Hi there,

     

    Sorry for the delay in response. We had a similar discussion that happened in past here: https://community.adobe.com/t5/adobe-xd/which-unit-does-adobe-xd-use-for-pixel-sizing/td-p/8228778#:~:text=Hi!-,XD,%2C%20incidentally%2C%20a%20point).

     

    Please check and see if that helps.

     

    Thanks,

    Harshika

    C
    chris.griffith
    Inspiring
    November 12, 2020

    A lot of variables in play here. Double check that the dev's browser is not zoomed it. I have seen issues where they have it zoomed in and forget about it. Then look at one element, a title or something. Use the browser's devtools to see the entire CSS that is being applied. That might be the clue you need to solve this.

    Firefly Community Gallery
    Adobe Firefly

    Remix with Firefly Community Gallery

    Thousands of free creations to fall in love with and remix in Firefly.

    Explore now
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices