The Craft Sync tool for Sketch brings your design environment and InVision together like never before. Sync lets you send your designs into InVision instantly—no saving, exporting, dragging or dropping. Simply select your screens in Sketch or Photoshop, create or choose the prototype you want to sync to, and easily import all of your screens into InVision.
To sync artboards from Sketch to InVision, navigate to the right-hand toolbar and click the Sync icon (). By default, only selected artboards will be published.
To publish all artboards, make sure no artboards are selected before clicking the Sync icon. Alternatively, you can click the drop-down at the top of the Craft Manager publish modal and select all the artboards.
Even when updating all artboards, Craft Sync will only publish the artboards that you have edited since previously publishing. Because this setting reduces the time required to update your prototypes, it is the default setting. To turn this setting off, in the Mac menu bar, click the Craft Manager icon (), click the settings cog icon (), click Preferences, click the Sync tab, and then click (to uncheck) the Prevent upload of unmodified boards option.
Organizing artboards before syncing
To ensure that the organization of your prototype artboards in Sketch is reflected on InVision Cloud, you can select your preferred artboard order before publishing the prototype:
Canvas - Left to right, top to bottom: Your artboards will be organized in InVision Cloud just as they are on the Sketch canvas, starting with the first row of artboards on the canvas, moving from left to right before progressing through the second and subsequent rows.
Canvas - Top to bottom, left to right: Your artboards will be organized in InVision Cloud just as they are on the Sketch canvas, starting with the first column of artboards on the canvas, moving from top to bottom before progressing through the second and subsequent columns.
Alphanumeric: Your artboards will be organized in alphanumeric order (based on the name of each artboard) in InVision Cloud.
Sketch layer list - Top to bottom: Your artboards will be organized in InVision Cloud based on the order you've established in the Sketch Layers panel, starting with the top layer and progressing through the bottom layer.
Sketch layer list - Bottom to top: Your artboards will be organized in InVision Cloud based on the order you've established in the Sketch Layers panel, starting with the bottom layer and progressing through the top layer.
This setting only applies when publishing new artboards for the first time. When publishing changes to existing artboards, they will remain in the same order as they currently appear on the web.
To define your preferred artboard order for InVision Cloud:
In Sketch, select the artboards you want to sync and click the Craft Sync icon ().
In the Craft Manager modal that opens, click the Sync Preferences dropdown arrow.
Click the artboard order you want to use.
Be sure to select the appropriate options in the Sync dropdown, Prototype field, and Device type dropdown.
Click the Publish button.
Publishing a new prototype
After clicking the Sync icon, you will see the Craft Manager publish modal. If you have never published a prototype from the Sketch file before, you will be prompted to create a new prototype. If you want to update an existing prototype, click Sync existing prototype.
When publishing a new prototype, you will be required to give it a name and select a device type. Clicking Publish will take you back to the prototypes tab where you can view the publish progress.
If you are on a Team plan, but you are not the Team owner, new prototypes for your team cannot be published from Craft Sync. First create a new prototype in the InVision web app. You can now return to Craft Sync and sync your Sketch file to that prototype. For more information, check out the article How do I create a prototype on a Team plan?
Updating an existing prototype
If you have published a prototype via the Sketch file before, when you click the Sync icon, you’ll be prompted to click Update to save changes to the existing prototype.
If you want to publish an entirely new prototype, click within the prototype name field, type a new name, and click Create prototype.
Clicking Publish will take you back to the prototypes tab where you can view the publish progress.
There is no way to unsync screens. If you need to remove screens that have already been synced, you can navigate to your prototype dashboard in InVision and delete the screens. Alternatively, you can create a new prototype and sync your screens again.
Viewing sync progress
After clicking Publish or Update, you can view your publish progress in the prototypes tab of the Craft Manager modal. There are a few stages of the publish process that need to complete before your prototype is ready:
Exporting Assets: We export all layers marked as exportable so that they can easily be downloaded via Inspect.
Extracting Inspect Data: Inspect gives your developers access to all the important information they need when implementing a prototype. During the publish process, we need to extract all this information from the Sketch file.
Uploading: Once all data is ready, we upload it all the InVision. Upload times can vary depending on the size of the prototype and your internet speed.
Once your prototype is published, you will see the prototype URL, which you can use to preview the prototype on InVision via the web or the InVision mobile app.
Stopping an active sync
Stop an active sync by clicking the square in the sync progress icon (). Artboards that have already successfully uploaded will remain in your prototype even if you stop the sync in mid-progress.
Changing your sync settings
Use Craft Manager to adjust your Sketch settings for Craft Sync:
Click the Craft Manager icon in your toolbar.
Click the cogwheel, then click Preferences.
Click Sync (next to General).
From here, you can adjust the exported pixel density and notification sounds.