Skip to main content
joaosp
Inspiring
January 3, 2019
Answered

How to adapt text and/or elements size while designing to smaller screens?

  • January 3, 2019
  • 1 reply
  • 20568 views

I have a layout I made some time ago on Adobe XD (that was just a personal project) and now I wanna put it on Behance. To do so, I need to duplicate/adapt that layout (designed for desktop) to smaller screens, iPad and mobile.

Since I'm not used to design for smaller screens, after I started I've got a doubt: how do I know for example how much I need to decrease both text and UI elements' sizes? To explain better: I have a text with 40px. How should I calculate to properly decrease that size? Is there like a default percentage to reduce from those values? Maybe some visual "default" rules that every design follows?

I always design for Bootstrap, however I'm not sure if I'm thinking the right way.

Thanks for all your thoughts and advices you could tell me. I worked most of time only for desktops, a traditional web designer, and now I'm trying to migrate to UI/UX.

This topic has been closed for replies.
Correct answer fahad_dexter

So, to increase text, I need to convert them to point texts instead of area texts? Are you sure?


Yes joaogdesigner​,

Convert them to point texts and they will resize collectively with all other elements.

Regards.

1 reply

Atul_Saini
Community Manager
Community Manager
January 4, 2019

Hi Joaogdesigner,

Thanks for using Adobe XD and sharing your feedback about switching to a smaller device. Please take a look a the responsive properties which might help in this situation: - Responsive resize and constraints

Please update this discussion in case you need further assistance.

Thanks,

Atul_Saini

joaosp
joaospAuthor
Inspiring
January 4, 2019

I took a look at that page about the responsive resize resource, but actually you didn't understand what I need. I need to create other 2 artboards (ipad 768x1024 and mobile 375x667) and "transpose" my desktop layout to those new artboards, but I don't know how to resize texts and elements properly.

fahad_dexter
fahad_dexterCorrect answer
Participating Frequently
January 6, 2019

So, to increase text, I need to convert them to point texts instead of area texts? Are you sure?


Yes joaogdesigner​,

Convert them to point texts and they will resize collectively with all other elements.

Regards.