ambassador

Kelly Knowles Updated February 26, 2021 03:42

Responsive resizing in Studio?

I know its in early access so I can't expect it to work 100%.

Does anyone know how responsive resizing of elements works in Studio? Only thing I can find about it is that "it's part of its core tenant," which doesn't tell me much. I know I can pin things to the top or side of the artboard, but that doesn't cause anything to resize with the artboard.

Is it supposed to be totally automatic? Does it require me to set something up for each element to define how it should be resized? I can't find any of those tools.

Is this feature just not available yet?

This post is associated with a known feature request: [[ problemTicketSubject ]]. Let our Product team know that you’re interested in this feature.

Thanks for taking the time to share your feedback about making our product better. We’ve let our Product team know that you’re interested in this feature so they can factor that into their product strategy.

comments

Sort by

official comment

Shaina Torgerson , ambassador • June 19, 2019 20:25 • Edited

Hi Kelly,

Thanks so much for reaching out here in Community about this Studio feature. We actually have some very helpful documentation, including an explanatory video, on this subject here in the Getting Started Guide for Studio in the "Responsive and Static Sizing" section.

You are able to define whether a component will resize responsively, or remain static in size. To define whether a component uses static or responsive sizing:

Select the component.
Click Edit Component at the top right of the canvas. Alternatively, you can go to Library by clicking the book icon at the top of the layer list on the left, and then click the arrow to the right of the component you want to edit.
In the inspector, just below the alignment icons, hover over the Width and Height fields (one at a time) and right-click.
In the drop-down list, click either Px (for static sizing) or Percent (for responsive sizing).

Please be sure to check out the video in the Responsive and static sizing sections of this article to view how this works. Hope this helps!

Thanks,

Shaina

Kelly Knowles , ambassador • April 13, 2018 12:22

Woops, I did a text search for "responsive" on every page of the guide and somehow I missed that section! Thank you :)

Shaina Torgerson , ambassador • April 13, 2018 14:48

Of course! Glad I could help.

Please feel free to reach out with any other questions :)

Asaf Cohen , ambassador • April 20, 2018 12:49

Hi, I am trying to change a component so it is responsive, but nothing happens when I click on Percent in the drop-down. The width value remains in px.
Any ideas?

Shaina Torgerson , ambassador • April 20, 2018 16:45

Hi Asaf,

Sorry to hear that you're running into this issue. It appears as if our Support team is aware of this issue. I will open a ticket on your behalf with our Support team so they can keep you in the loop on any updates to this issue. Please look for a message from them soon.

Thanks,

Shaina

Bryan , ambassador • May 24, 2018 15:52

Hi Kelly,

Here are some additional details about how responsive and resizing works in Studio (and how it compares to Sketch): InVision Studio vs. Sketch responsive tools

Since it sounds like you've already figure out the basics, here's one specific tip that might be helpful. If you want something to resize based on the outer group, create a component. Anything percentage-based inside the component is calculated as a percentage of that component. If you want it to be based on the artboard leave it as a group or make sure the component is also percentage-based.

Hope that helps!

Cheers,
Bryan

José Juan Navalón Gallego , ambassador • May 25, 2018 07:44

Hi, all:

Masks within components or combined shapes cannot be turned to percentage. When right-clicking in "width" or "height" and changing to Percent... nothing happens.

Thus, I cannot import an icon or svg with shapes under a mask or complex shapes, turn it to component and make it responsive. In fact, if I resize it manually, the dimensions doesn't change because they're pixel-based (and can't be switched to percent), only the bounding box resizes!!!

That is a very basic and IMPORTANT issue: I cannot manage a collection of icons as components and make them resizable!

Please, rethink this "responsiveness approach" or fix theses exceptions... I wonder if I'll have to change to percent EVERY WIDTH AND EVERY HEIGHT OF EVERY SINGLE SHAPE OR WHATEVER I IMPORT AND TURN TO COMPONENT. And don't hide those important options behind right-clicks, please.

Thanks.

JJ.

Shaina Torgerson , ambassador • May 25, 2018 17:33

Hi JJ,

So sorry to hear that you're also running into these issues. Our Support team has been able to replicate what you're seeing. Our Engineering team is currently investigating this issue, and I will let them know that you're also encountering it. As soon as we have any updates on the resolution, I'll be sure to post the solution here.

In the meantime, I will open a ticket with our Support team on your behalf so that they can gather all the necessary information from you. Please look for a message from the soon.

I apologize for the inconvenience that this is causing for you!

Thanks for hanging in there,

Shaina

Erin , ambassador • July 12, 2018 22:14

I believe I'm running into similar issues as JJ. In my case, I want to resize a vector logo that I imported into Studio (and was converted to a component). However, when I try to reduce the size of the logo component using the width/height as a percentage, only the bounding box changes in size or the elements in the logo jump around within the bounding box. Is there a way to resize a component without having to go into the master component and manipulate every shape inside of it? What about complex vector illustrations?

Shaina Torgerson , ambassador • July 13, 2018 16:38

Hi Erin,

Sorry to hear that you're running into issues similar to JJ. To answer your questions from above:

1. You should be able to resize/edit a component without needing to resize/edit the master component. However, this can be dependent on the way your component is built.
2. Can you please clarify what it is that you are looking to do with complex vector illustrations? Do you have a screen recording or screenshot of this instance?

In addition, can you please answer the following to help troubleshoot your issue?:

1. Can you please send a screenshot of the About This Mac overview? (click the Apple icon > About This Mac)
2. What version of Studio are you using? Does this occur if you update to the latest version (0.93.10)?
3. Could you provide a screen recording showing what’s going wrong?

Look forward to hearing from you and assisting you further.

Thanks,

Shaina

Ryan Aldred , ambassador • September 12, 2018 07:52

I'm still having problems setting component dimensions to percentages. Is this still an outstanding bug as fundamental to my adoption of this application.

Regards,

Ryan.

Shaina Torgerson , ambassador • September 12, 2018 16:31

Hi Ryan,

It appears as if this is a known issue, and our Support and Engineering teams are still investigating this issue. I'm happy to open a ticket on your behalf so that they can keep you in the loop here. Please look for a message from them soon.

Have a great day,

Shaina

Adam , ambassador • October 26, 2018 22:20

Hi Shaina,

Has JJ's issue been rectified?

I believe I am having a similar issue, I have a vector logo that I've imported with different shapes underneath one another and a stroke on around outside. I've tried changing it to percentage base but it doesn't seem to work properly, well it's mainly just the stroke that doesn't want to resize.

Any help?

Thanks

Adam

Beth Vanderkolk , ambassador • October 29, 2018 15:55

Hey Adam,

I just checked with our Support team, and it sounds like they'll need to look at your file to troubleshoot this for you. I'll open a ticket on your behalf and they'll reach out shortly. Apologies for the trouble, and thanks for hanging in there!

Beth

Kevin Ernst , ambassador • December 12, 2018 21:18

It looks like I am having a similar issue. I bring in a vector of our logo that I want to convert to a component. If I select the group and resize, it is fine. Once I create a component and try to resize the paths go all over the place. I have been through all of the tutorials and can't get it to respond in the same way that the video shows. Please help (willing to send you the file).

Best regards,

Kevin

Shaina Torgerson , ambassador • December 12, 2018 21:38

Hi Kevin,

Sorry to hear that you're running into issues with resizing in Studio. Before having our Support team work directly with your file, can you please provide the following information?:

1. A screencast or screenshot(s) displaying the issue(s) you are encountering.
2. The version of Studio you're currently running.
3. A screenshot of your "About this Mac" overview.

Thanks in advance,

Shaina

Diana , ambassador • February 19, 2019 09:38

Hello,

I'm still having the same issue, can't change pixel to percentage in a component while resizing + following the tutorial, i don't have the 3 icons beside the rotate that allows you to fix an object with respect to its background? Any advice on that?

Best,
Diana

Shaina Torgerson , ambassador • February 19, 2019 16:14

Hi Diana,

I'm so sorry to hear that you are having issues with Studio and resizing. I'd be more than happy to help dive into this further for you. A few questions for you:

1. What version of Studio are you using?
2. What is your "About this Mac"?
3. Can you please provide a screenshot showing what you mean by, "...i don't have the 3 icons beside the rotate that allows you to fix an object with respect to its background"?

Looking forward to hearing back from you soon!

Best,

Shaina

Diana , ambassador • February 25, 2019 08:11

Hi Shaina,

1- Version 1.8.0-B1497

2- Version 10.12.6 (16G1815)

3- Attached are the images

4- When you change from pixel to percentage in the resizing, the percentage value is not running. It stays in pixels.

Thanks

Florian Haßler , ambassador • February 26, 2019 07:53

Hi there, I'm having the exact same issue on 1.8.0, while trying to resize a component with combined shapes. I can't turn them to % resizing. Is this issue finally solved or in the process of being solved, maybe? I really don't know how to work around that, except for export and re-import.

Shaina Torgerson , ambassador • February 26, 2019 15:40 • Edited

Hi Diana and Florian,

Thank you each very much for providing those details! I would like for our Support team to take a closer look at this issue for each of you and will be opening a tickets on your behalf. Please look for a message from our Support team soon for further troubleshooting.

Thanks for your patience,

Shaina

Gareth Ashfield , ambassador • March 05, 2019 14:42

Hi,

Do you guys have a Sack group for users to submit issues and open member discussions about shared issues and potential solutions?

A link to a page requesting a full submission request is quite tedious. You guys are amazing for responding quickly, but putting fundamental functionality flaws to a vote seems counter-productive in gaining loyal users.

Animation is amazing icing on the cake, but nailing a user friendly, fully responsive core of the app, surely should be the priority?

Shaina Torgerson , ambassador • March 05, 2019 23:31

Hi Gareth,

I totally hear you and understand that it can be frustrating to fill out a full request for each issue or feature request you're looking for more information on. While we don't have a Slack group at this time, I can assure you that we are working hard to make these issues and feature requests easier to find and report on here in Community.

We really appreciate hearing from loyal customers like you about how these types of issues, and how we can do a better job. Thanks for the sweet remark about our quick response times! I'm glad to hear that you are getting quick and effective service from our Community and Support teams.

Can you please confirm if you are also encountering the issues described by others in this thread? If so, I would be happy to put you in touch with our Support team so that they can take a closer look at the issues you're encountering.

Look forward to hearing from you,

Shaina

Lars Norrstrand , ambassador • November 05, 2020 18:02

Hi,

I'm having the same issue, not beeing able to change to percentage when right-click and select percent in the editing component inspector.
I found a workaround. If you type in the percentage value and percentage sign and leave the input field, it will change.

Can be useful until the bug is fixed.

Regards,
Lars

John McLemore , ambassador • February 23, 2021 06:54 • Edited

It's late Feb of 2021. Why isn't this fixed? Same problem as above. How has this not been fixed? This is a serious problem and it looks like it's been neglected for years according to these posts? How could you guys overlook this? Please fix this. It renders Studio basically useless.

Raynor B , InVision Employee , ambassador • February 26, 2021 03:42

Hi John,

Thanks for getting in touch via our Community! I'm sorry to hear that you're having some trouble with responsive resizing.

If you'd be able to provide some further details regarding this, I'll be happy to create a ticket for you to escalate this to our Support team:

Could you please provide some screenshots or a screen recording showing the issue occurring?
Which version of Studio are you running?
Which OS are you running?
– If on Mac, could you please send a screenshot of your "About This Mac" panel
– If on Windows, could you please send some screenshots of both the “Device specifications” and the “Windows specifications” sections on the “About” page?

This information will help us dig into this issue further. Looking forward to your reply!

Best,
Raynor

join the conversation

To comment, sign up or sign in.

Support

Community

Courses

Internal Knowledge Base

Support

Community

Courses

Internal Knowledge Base

Responsive resizing in Studio?

comments

official comment

join the conversation