By Howard Pinsky
Designing for various screens shouldn't feel like pulling teeth.
Adobe XD makes the process painless with responsive resize. When you're at the phase where you'd like to explore additional screen sizes, take a few moments to group any elements you wish to stick together. This will help avoid wandering layers.
Once your layers are in a good place, make a duplicate of your current artboard and then turn on responsive resize within the properties inspector. Once enabled shrinking or enlarging your artboard will intelligently shift and resize your elements to bring you immediately closer to your vision.
From there, you can also use responsive resize to adjust layers or groups to finalize your new screen. And if you want to ensure that elements remain pinned as you're transforming, you can enable constraints to keep your designs looking as accurate as possible.
So, whether you're going from desktop to mobile or mobile to desktop, give yourself a jump start using responsive resize in Adobe XD.
Designing for various screens shouldn't have to feel like pulling teeth. Adobe XD makes the process painless with Responsive Resize. Whether you're transitioning a design from mobile to tablet, or from desktop to a phone, Responsive Resize helps you do that with a simple click and drag. By default Responsive Resize is set to automatic, and will intelligently predict the positioning of elements. When you need to manually override constraints, switching to Manual mode will let you pin elements to the top left right and bottom, or fix the width and height of an object to get the resize just right.
