Replace screens in an InVision V7 prototype
  • 13 Feb 2023
  • 2 Minutes to read
  • Dark
    Light

Replace screens in an InVision V7 prototype

  • Dark
    Light

Article Summary

This article provides answers for InVision V7. If you're on InVision V6, read this article instead. Not sure which version you're using? Find out now.

You have different options to replace screens in your InVision prototypes. Once you replace the screens, all hotspots, templates, and comments remain in place.

Replace screens using Craft

To replace a screen you synced using Craft, you need to update the artboard you originally synced in Sketch and sync it again via Craft Sync. Note that if you rename the artboard in Sketch before syncing it to InVision, it will still sync to the originally synced artboard in your prototype.

To replace a prototype screen in InVision V7 using Craft Sync:

  1. In Sketch, select the artboards you want to update in your InVision prototype. Make sure you select the artboards you originally synced.
  2. Select Craft Sync (sync using craft). The Craft Manager modal opens.
  3. Select the tab Select existing.
  4. Select the Search for an existing prototype dropdown and select the prototype you want to update.
  5. Review the settings in the Advanced dropdown area.
  6. Select Publish.

If you intended to replace a screen in your prototype but see a duplicated screen with the same name instead, make sure you synced the artboard you originally synced from Sketch.

If you’re replacing screens with hotspots, make sure you select the artboards with the hotspots and all the destination artboards so all hotspots work as expected in your prototype.

Replace a single screen

To replace a prototype screen in InVision V7 without using Craft Sync:

  1. Open the prototype.
  2. On the screens landing page, locate the screen you want to replace.
  3. From your Finder window, drag the updated image directly onto the screen it will replace.
    This action can't be undone without repeating steps 2 and 3, using the original screen.

Replace a single screen within Console

To replace the active screen while viewing a V7 prototype in the InVision Console:

  1. Open the prototype, hover over a screen, and select View screen.
  2. Use the arrow buttons in the Console to navigate to the screen you want to replace.
  3. From your Finder window, drag the updated image directly onto the screen you're viewing in the Console.
    This action can't be undone without repeating steps 2 and 3, using the original screen.
To replace a screen you're not viewing in Console, hover over the screen name at the left of the InVision toolbar, select Expand thumbnail tray, and drag the new image over the thumbnail of the screen it will replace.

Replace multiple screens

Before you begin, note that if you want to replace multiple screens using these instructions, each screen must have the same file name as the screen you are replacing. If named identically, any screen you replace should keep all hotspots, templates, and comments associated with the previous version.

To manually replace multiple prototype screens on InVision:

  1. Open the prototype.
  2. On the screens overview page, select Add Screens and then select Upload screens. The Finder window opens.
  3. Select the new image files that should replace the old screens.
  4. Select Open.
    This action can't be undone without repeating steps 2 and 3, using the original screens.

Was this article helpful?