Skip to main content
InVision Support Home Page

Getting Started

[[ === "Studio" ? "InVision Studio" : ]]


Layers Panel

Located on the left side of Studio is the layers panel. This panel contains:

  • Pages
  • Libraries 
  • Artboards and layers specific to the selected page

To search for a specific artboard, group, or layer, type the object's name in the Filter Layers field in the layers panel.

The Filter Layers option only searches the current page. To filter layers on a different page, you will need to select that page in your document.


In Studio, you can organize your designs into multiple pages. The layers panel will display the layers for the selected page only. To see the page list (if you've created multiple pages), click the Pages tab at the top of the layers panel. To create a new page, click the + button next to Pages. To rename a page, double-click the current page name.



Artboards are at the top of the layer hierarchy and contain your groups and layers.

To create a new artboard:

  1. At the top left of the document, click the large + button and select Artboard. Alternatively, use the keyboard shortcut A. 
  2. From the right-hand panel, click one of the recommended artboard sizes. Or, click and drag on the canvas to create a custom size.

Like with pages, you can rename an artboard by double-clicking the artboard name in the left-hand layers panel. To re-order artboards in the layers panel, click and drag them to the appropriate location.


The Libraries section in the layers panel lets you access components from either your document library or a shared library. To add a file as a library, click the + button to the right of the Libraries section.

To search for a specific component, click a specific library in the Libraries section and begin typing the component name. 



When a layer is masked, an arrow icon (studio-masked-layer-icon.png) appears next to that layer in the layers panel. The mask layer has an eclipse icon (studio-mask-icon.png). Any shape can be turned into a mask. To create a mask, select the shape and, in the top toolbar, click the mask icon (studio-mask-icon.png). Alternatively, right-click the shape and select Mask, or use the shortcut ⌃⌘M (on Windows, Ctrl+Alt+M).


Hiding and locking layers

To hide a layer, group, or artboard in Studio, hover over the object in the left-hand layers panel and click the eye icon (studio-hide-layer-icon.png). Alternatively, you can use the shortcut ⇧⌘H (on Windows, Ctrl+Shift+H). Hiding an object will hide it from the canvas in Studio, but it will still be visible in the layers panel.


To lock any layer or group, hover over the object in the left-hand layers panel and click the lock icon (studio-lock-layer-icon.png). Alternatively, right-click the object and choose Lock Layer, or use the keyboard shortcut ⇧⌘L (on Windows, Ctrl+Shift+L). Locked objects can be selected from the layers panel only.


In addition to individual layers and groups, you can lock entire artboards. Locking an artboard will lock all layers from being selected on the canvas. While locked layers can be selected from the layers panel only, locked artboards can be selected and moved on the canvas.


If a layer has an interaction, it will be marked by a lightning icon (studio-interaction-icon.png) in the layers panel. Any type of layer (including artboards) can have interactions. Each interaction has a trigger type, a target artboard, and a transition type. For more information on interactions, you can skip ahead to this article: Managing Interactions

Layers with interactions

Boolean operations

Combined shapes are created using Boolean operations. They are marked in the layers panel by an icon of an overlapping circle and rectangle.

Combined shape

To create a combined shape, select the layers you want to combine. In the top toolbar, select 1 of 4 Boolean operations:

  • Union Selection (studio-union-selection.png)
  • Subtract Selection (studio-subtract-selection.png)
  • Intersect Selection (studio-intersect-selection.png)
  • Exclude Selection (studio-exclude-selection.png)
For more information on each of these operations, check out the "Toolbars and shortcuts" table in this article: Studio UI Tour

A combined shape will be created that contains the selected layers. To change the Boolean operation for a specific layer, click the symbol next to the layer in the layers panel, and choose a new Boolean operation.



Hovering over a layer in the layers panel or on the canvas will highlight a layer with a blue outline. Selected layers have a blue background in the layers panel, and a blue bounding box appears around the layer on the canvas. You can select one or more layers at a time.

Selecting components is the same as selecting layers, but you will notice components are marked by purple text, as well as by purple bounding boxes and outlines.