×

[Invision Studio] Design for all mobile devices -

I am designing screens using iPhone8 artboards but am previewing on a paired iPhone 7 device because I need it to work for all screen sizes / aspect ratios.

I am familiar with the concept of pinning layers to top/bottom/left/right but it is not working. Can someone explain how to best get a body of text to flow and for elements to maintain their padding from one another, on all screen sizes.

Here is a sample project to show you what I mean, and images attached as well:

https://www.dropbox.com/s/ho2o6zaoav7y8wt/sampleText.studio?dl=0

https://www.dropbox.com/s/ho2o6zaoav7y8wt/sampleText.studio?dl=0 


0

Comments

Please sign in to leave a comment.

  • Avatar
    Shaina Torgerson

    Hi Eve,

    Sorry to hear that you're running into issues when previewing your Studio project on your mobile device. I appreciate you taking the time to provide those screenshots, as well as a link to your Studio project.

    Studio offers two ways to gather layers together for collective editing and alignment: Groups and Containers. Think of it this way: a Studio container behaves like a mini artboard within an actual artboard.

    To convert a group to a container, select the group and, near the top of the inspector, click Container. To revert the container to a group, select the container and click Group.

    groups-vs-containers.gif

    It appears as if you are looking for responsive resizing when previewing your Studio prototype. To ensure that your components, like the text in your example, stay in place and resize according to the device you're viewing your prototype on, I suggest grouping these components. I think this article (check out the "Groups and Containers" section in the Studio Inspector guide), especially the table in the Groups and Containers section, will help you get a grasp on how to handle this. 

    As for previewing your Studio prototype, please review the following article in the Studio Getting Started Guide: "Publishing and Sharing".

    Hope this helps clear things up! Please let me know if you have any outstanding questions.

    Thanks,

    Shaina

    0