New and returning users may sign in

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
← Adobe XD: Feature Requests

Request details

Feedback

Adobe XD: Feature Requests: 02 : Prototype mode

Categories

  • CATEGORIES
  • All ideas
  • My feedback
  • 01 : Design mode 1366 ideas
  • 02 : Prototype mode 370 ideas
  • 03: Share mode 50 ideas
  • 04 : Sharing on the web 214 ideas
  • 05 : Asset exporting 157 ideas
  • 06 : Extensibility 38 ideas
  • 07 : Integration with other tools 118 ideas
  • 08 : Mobile (iOS) 25 ideas
  • 09 : Mobile (Android) 19 ideas
  • 10: Developer Handoff 140 ideas
  • 11: Plugins 135 ideas
  • Other 109 ideas

(thinking…)
  • Searching…

    No results.

    Clear search results
    • Adobe XD: Feature Requests 2,868 ideas

scale prototype to browser window

Please give users the option of scaling the prototype to browser width instead of just a straight - "view actual size" fullscreen option. It makes prototyping useless if we can't fit the prototype to the browser window.

  •  
    SmartSelect_20210510-215424_Adobe XD.jpg 44 KB
  •  
    SmartSelect_20210510-215512_Adobe XD.jpg 51 KB
  •  
    Screen Shot 2018-11-22 at 13.30.50.png 336 KB
  •  
    Screen Shot 2018-11-22 at 13.31.09.png 319 KB
  •  
    White_Edges_Prototype.jpg 123 KB
76 votes

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close

We’ll send you updates on this idea

Koushik shared this idea  ·  July 19, 2018  ·  Flag idea as inappropriate…  ·  Delete…  ·  Admin →

How important is this to you?

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
Tweet
  • Remove
Attach a File

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
Submitting...
An error occurred while saving the comment
  • Anonymous commented  ·  May 10, 2021 19:11  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    When viewing the prototypes, there needs to be a fill the screen view where the prototype fills the screen of the testing devices. See the mobile screenshots. The black areas represent unused screen space.

    Submitting...
  • Kristoffer commented  ·  February 10, 2021 01:38  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    The solution to this actually don't have to be exactly scale to width, the most optimal way to solve it for me as a user (and think many would like this as well) would be to have the prototype adapt fully to the browser. A responsive prototype that, with the rules I specify (e.g. fix burger menu to top and left), present the prototype the way I intend it, independent to if it's an iPhone X, XR, 11 or an Samsung Galaxy S21 Ultra. We can very seldom control what device test participants use when they get access to prototypes or what device our stakeholders have in their hand. Why not go the whole way and fix prototyping the way I just described? (Of course I understand that it's complicated) but it would actually solve it in the best way possible. Then build on this solution and add breakpoints for mobile to desktop design. Then we'll be able to prototype with ease, get the right response from stakeholders, the more reliable data from user tests and so on.

    But with that being said, I do agree that scale to width would be a solution in the meantime so I do agree with your post.

    Submitting...
  • Nora Brown commented  ·  January 29, 2021 08:55  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    This would be extremely helpful -- I was planning to switch to Adobe XD for Figma in the hopes this feature would be available. It's one of my main frustrations with Figma sharing.

    Submitting...
  • MB commented  ·  August 27, 2020 17:58  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    The lack of this feature is keeping InVision supported by our business. I would literally rather pay $25 a month to XD for this feature than have two separate programs for design and prototyping - especially as XD has some great animation features.

    PLEASE PRIORITISE FOR OUR CLIENTS' SAKE!

    Submitting...
  • ethan commented  ·  April 16, 2020 21:10  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I'm surprised how people aren't requesting this. Viewing the design but not being able to see it like it would actually be displayed. It's like being held in a cage under water, while viewing the sky.

    Submitting...
  • Pavel commented  ·  February 15, 2020 17:11  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    They say "stay tuned". So, almost 2 years still waiting.

    https://community.adobe.com/t5/adobe-xd/actual-size-prototype-in-preview-the-2018-edition/td-p/9718957?page=1

    Submitting...
  • Olly commented  ·  December 03, 2019 20:30  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi I agree this is huge, it needs to be prioritised, when I show a client a design I have to tell them to CMD/CNTL- on the browser to make it fit which is so clunky.

    To add they're also standard designs, a portrait 1080 touch screen for example, on a laptop you see about a quarter of it...

    Submitting...
  • Anonymous commented  ·  September 25, 2019 14:03  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I'm very surprised there aren't many more people commenting on here. This is a big problem if you want to create prototypes to show to clients. Sadly, I guess it's time to start looking at other prototyping software.

    Submitting...
  • owen commented  ·  July 09, 2019 03:59  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Have designs fill the full browser window width and have standard scrolling functionality to give realistic prototypes

    currently having to specify the viewport height constrains the designs to a box which looks odd and renders the fullscreen mode useless

    This is currently done as standard by invision with no issues

    Submitting...
  • Ed commented  ·  April 09, 2019 12:48  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    When sharing on the web, it'd be nice if fullscreen mode ignored the viewport and just extended the full length of the viewer's browser. As it is, it's a bit funky.

    Example: https://cl.ly/8152b5159922

    Submitting...
  • Michael Caporale commented  ·  January 07, 2019 16:08  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Well it's weird because we have our artboard sized to 375x667px for mobile which is directly proportional for the iPhone 8 that I'm viewing on, but still getting white bars on either side when viewing in safari. Looks fine in the app. I'd rather see the full width but pushed down given the extra top and bottom bars inside the browser.

    I suppose we should be accounting for this height in our design mockups, but it's hard to accomodate for all browsers. There's really no situation where the design would scale down to less than the width in the wild, so this seems like undesirable behavior to me.

    Submitting...
  • Harun Alikadić commented  ·  November 22, 2018 04:31  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Besides full screen it would be necessary to have a "fit artboard to screen", in prototype view. I am working on a tablet design 1280 high and I have to scroll in order to view the design. If I use browser zoom out, it seems to create some issues with navigation hotspots on the prototype and comment and artboard navigations become too small.

    Submitting...
  • AdminArun Kaza (Adobe) (Product Manager, Adobe) commented  ·  September 18, 2018 11:18  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi All,

    We have provided a fix for this issue recently in XD 12.0 release. Request you to give it a try, and access your prototype links on mobile devices again. You should now see the designs taking full width available, and let it overflow vertically if height is greater than available height of the device.

    Do let us know if you are still seeing the same issue?

    Thanks!

    Submitting...
  • Koushik commented  ·  August 16, 2018 14:46  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    The workaround is no longer supported apparently, hence this request

    Submitting...
  • Anonymous commented  ·  August 02, 2018 08:05  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    This is vital to presentations. The program worked like this up until a couple months ago. Having an actual size should be secondary and not primary.

    I found this workaround here: https://forums.adobe.com/thread/2458877 However, it does not work for chrome on mac, and therefor I cannot expect it to work on clients computers either.

    This is very frustrating. The ability to see a clear picture of a website or app above the folder was the main reason I started using this app and this negates that ability.

    Submitting...
  • Ondy commented  ·  July 19, 2018 09:42  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi Arun,

    Yes, me personally, I'd prefer the other option - to always fit the width first. Although I am sure there are designers that would rather see the whole design regardless of those white edges.

    There is a way to accommodate both, but it becomes a bit more complex to code of course.

    It's a 2 step solution.

    1. When uploading prototype (or when setting up document?) ask if the designer wants to see the prototypes
    - "rigid" - see the whole height (with possible white edges)
    - "fluid" - fit width of the design first (let the rest fall beyond available viewable height)

    Now when you have "fluid" prototype, there will be an issue with fixed elements near bottom of the page, they might fall beyond the viewable area, but we don't want that (example: a persistent CTA button at the bottom of the page would be half or completely hidden).

    2. To accommodate for that, the designers will need an option to fix (anchor) elements either to the top of the page or to the bottom of the page.

    3. And as a bonus to this approach, there could be an option to fix (anchor) elements to other elements. I saw this sort of request here on this forum somewhere and that would be super helpful too.

    Submitting...
  • AdminArun Kaza (Adobe) (Product Manager, Adobe) commented  ·  July 18, 2018 09:53  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi Ondy,

    What you mentioned here about mobile browsers having lesser vertical area available to display content is the main reason why this issue is happening.

    We are trying to fit height of the design first, and then reduce width proportionally to maintain aspect ratio. This is why you see white gaps on left and right as the width has reduced slightly than its original size. This is the only way we can fit in the entire design within the available viewable area inside of the mobile browser.

    The other option is to always fit to width of the design and then let there be vertical scrolling possible to view any content that would fall beyond the available viewable height in the browser. Do you think that would be acceptable behavior?

    Submitting...
  • AdminSuhasini Basu (Software Engineer, Adobe) commented  ·  June 29, 2018 08:23  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi Ondy,

    Thanks for those information. We got a bug logged for this issue for further investigation.

    Thanks,
    Suhasini

    Submitting...
  • Ondy commented  ·  June 28, 2018 12:04  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi Suhasini,

    I tested it on following devices with the same outcome (they all show white edges):

    - Samsung Galaxy S7 - Chrome, Firefox, native Internet browser
    - Samsung Galaxy S7 Edge - Chrome
    - iPhone 6 - Safari

    My artboard size is standard android size: 360x640

    The issue with the "standard" size is that no regular browser lets you see the full 360x640. They all have permanent header, some have permanent footer. And also phones show their own header with notifications, battery and time information on top. All those make the actual prototype viewable area shorter (while keeping the same width).

    As I mentioned before, I think the issue here is the addition of fixed elements, that are fixed to the whole exact size (640x360). Which needs to be shown in full to properly position elements near bottom of screen. Maybe better way to do this would be: instead just "Fixed Position" checkbox, have 2 checkboxes - "Fixed Position from the top" and "Fixed Position from the bottom". And let the prototype stretch to the sides. And have the fixed elements fall to their places based on the distance from top and/or bottom.

    Submitting...
  • AdminSuhasini Basu (Software Engineer, Adobe) commented  ·  June 27, 2018 22:46  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi Ondy,

    Thanks for reporting this issue. I would require more information to investigate further :

    - Which mobile device ?
    - Which mobile browser ?
    - Size of your artboard, is it standard size or custom size ?

    Thanks,
    Suhasini

    Submitting...
← Previous 1 2 Next →

Adobe XD Feedback : Feature Requests & Bugs · UserVoice Terms of Service & Privacy Policy · Adobe Terms of Use · Adobe Privacy Policy