How do I use the layout grid in Inspect?

When you sync a Sketch prototype to InVision Cloud using Craft Sync, you have the option of syncing layout grid data. When no layers are selected in Inspect, you'll see the Layout section in the right-hand information panel.

The Layout section only works with Sketch prototypes that have been synced via Craft Sync. It will not work with Photoshop prototypes.

Enabling the grid in Sketch

To display the grid in Inspect, you must first turn on the layout grid in Sketch.

In Sketch, navigate to View > Canvas > Layout Settings. Here you can adjust the layout grid for selected artboards. Note that rows will not display in Inspect. After editing the Layout Settings, sync your prototype using Craft Sync.

Sketch also has a feature called Show Grid, which adds horizontal and vertical lines to your artboards. Turning this on will not impact Inspect. To learn more about Sketch’s grid settings, check out Sketch’s documentation.

Enabling the grid in Inspect

If you enable the layout grid in Sketch, Inspect shows the layout grid by default; however, the feature can be toggled on or off.

To toggle the layout grid in Inspect:

Sign in to your InVision Cloud account and navigate to the Documents page.
Open your prototype and, at the bottom of the page, click the Inspect icon ().
Ensure that no layers are selected.
Next to the Layout heading in the information panel, toggle the grid on () or off ().