It would be great to see this in a similar way to the component states, e.g. select the whole art board, add a new state (mobile) and setup the page design for the new viewport there.

Then have the prototype default to the state that best fits the viewport it is being viewed on?

Right now I would have both mobile and desktop designs in the same file (which is cluttered when viewers are cycling through the pages) or have them in two separate files, which doesn't work well either.

Would be useful to have a way of pulling these into one space intuitively.

Found a plugin that does this but I also really think it should be a feature.

https://www.animaapp.com/

Nothing has happend with this request since 5 years. Every prototyping app has it, Adobe of course NOT. For example prototype is prepared for most popular resolution and some users have it bigger, and XD shows cut screen on left, right and bottom side. Result? Users think that page doesn't have more content than first view above the fold, nothing to scroll down. That couse erroneous test results, that is serious problem because we pay for researches.

That would be sooooooooo amazing !

In case its unclear, and this is as far back as the start of 2019???

Derek Rudel commented · May 7, 2019
Adobe needs to make some big strides in competing with other tools like InVision or this one: https://www.justinmind.com/support/liquid-layouts-and-breakpoints/ which supports exactly what this request is for. I'm beyond surprised this isn't in active development as it would be SO valuable for users that are needing to create responsive designs for multiple devices/breakpoints.

Ability to demonstrate flex box like reflow would be helpful working with developers but also liberate designers to DIY. I hear Anima and Dogma can do this.

Agreed, I've shown designs to clients and they will say things like the text is too small when really it's because they are viewing it on a smaller screen so are seeing it at a reduced % size. It would be good to share a link that will display an artboard based on their screensize (or even just displayed a warning to say that this artboard was designed for 1336 and your screen is 1024 so it has been reduced in size).

Perhaps a setting in prototype mode would be useful so you can say "on resize" go to this "artboard" instead?

I just created a new feature request along similar lines, but not exactly, and more dev-centric: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/39981817-responsive-layout-rules-and-layer-navigation-for-d

TL:DR; I want to make it easier for designers to share with devs how a design's responsive layout is supposed to work, and to share share with devs what UI components are reusable.

Feel free to upvote and share.

Having prototypes restricted to canvas size designed to, and not respond to the device previewed on, makes it less than optimal to conduct effective User Testing. Specially when unmoderated. Other prototype tools are responsive to the device being used. Seems logical in todays world with infinite aspect ratios.

I'm a BIG advocate for XD at work, but can not justify the use of an XD prototype for user testing unfortunately.

Similar to the Chrome dev tools, it would be great to have responsive device viewing options toolbar in the Preview window that would allow me to pick or type viewport/device sizes and resolutions in order to automatically resize the viewport to the selected size. See attached image.

At the very least, some indicator text or flyout that shows the active viewport H x W which would change as you resize.

From the home screen, need to select multiple artboards, there you can give any dropdown or checkboxes to choose 4 or 5 artboards at the same time. After selection file opens with selected artboards.

Once I create one "repeat group" in the first artboard and it will create its "responsive view" automatically in other artboards. Other artboards will show recommended option, as which alignment is fit to that screen.

Requirement:- If I created 4 boxes in one row, this group of 4 automatically show its responsive view in other artboards.
( Tab - 2 box in one row
Mobile - 1 box in one row )

If a user wants to change alignment they can choose other options. If they don't want "repeat group" in one specific screen, Either they can choose custom or delete the whole group.

I would like to allow the percentage to the width/height properties (ie, width: 45%). Also, the following from CSS:
max-width, min-width, max-height, min-height.

As you can see these properties will give the artboards, elements, and components a more flexible framework. People will be able to see my mockups regardless of which smartphone/tablet they are using.

There are other properties which could be added, I guess you get the picture.

It would be nice to allow the width & height of artboard, objects, images, and components to be set to auto. This would work like CSS so that one can create a site for any phone, tablet or desktop and those items (ie, component) would fill the screen accordingly. Currently, the artboard is width/height are hardcoded and only works for one size (ie, iPhone 6/7/8). A true responsive design would make XD very useful. I can send a mobile portrait (ie, URL) to allow one to see my design regardless if the phone is a iPhone SE, iPhone 10, and any Android vendor.

Adobe needs to make some big strides in competing with other tools like InVision or this one: https://www.justinmind.com/support/liquid-layouts-and-breakpoints/ which supports exactly what this request is for. I'm beyond surprised this isn't in active development as it would be SO valuable for users that are needing to create responsive designs for multiple devices/breakpoints.

Spend all this time making it responsive in Design view, but it's not responsive in Shared view... kind of defeats the purpose in my opinion to have done all the responsive work for yourself and not have anything to show the clients or the developers...

So there will 3 conflicts. Viewing on web with a desktop machine(Design1).... Viewing on mobile (Design2)....Viewing on XD player (Design3). We can not know which platform will be used when viewing prototype. Fixed Bottom menu development is not a real big issue for Adobe. Thank you very much

Helle Elaine, what i mean is that just like instagram if you have a fixed bottom menu; the menu should accomodate itself to the browsing area. The bottom fixed menu on XD does not fix itself to the browser but to the bottom of the XD project. So this is a challenging but very important to make it view on mobile.

Request preface
Looked through 4 pages (+ i dont know how many others) on "responsive columns" but was unable to find a request that mirrored my own. Also, perhaps I don't fully understand the "responsive resize" feature that currently exists.

Problem
If I have two boxes (text or images) next to each other on my desktop artboard. I want to have them stack vertically on a smaller artboard. Currently they are being resized, a.k.a. squished together which works for somethings but not all.

So I have two boxes/columns which are both divided into two columns for a price box display. Using the current "responsive resize" feature on a smaller artboard the two boxes are made less wide when I just want them to both be 100% width and stacked on top of each other vertically.

Feature suggestion
Add a media query type feature, after a certain width the boxes no longer resize and instead the second box is pushed below the first box and both are made to be 100% width.

It would be great to be able to scale the browser/preview window to engage with the a responsive web prototype or experience accurate orientations for different devices.

Many of my designs are for websites, and being able to view a fully responsive prototype would be game changing.

Also being able to limit which objects are shown at different break points would be super helpful.

Thank you all, but when we share it on mobile that time we face missing fonts issues. As far as i see it is not like Flash, embed fonts & go. Maybe you can request a checkbox for us to export fonts as shapes for sharing only. Thanks.