First, you need to download and install the Proto.io Design Plugin. Download Proto.io for Sketch.
After downloading the Proto.io Design Plugin, extract and copy the plugin file into Sketch Plugins folder.
You can find this folder from the menu by choosing Plugins > Manage Plugins... >> Show Plugins Folder
Export from Sketch
Export your entire project, selected artboards or individual layers from Sketch.
Don't have a Sketch file handy? Download our own sample Sketch file
Upload the exported file to your Proto.io project
Simply drag and drop the exported .protoio file on your canvas or on the quick assets side pane.
Artboards in Sketch are transferred over as Proto.io Screens
Your items and groups hierarchy is transferred just like you set it up in Sketch
TIPS AND TRICKS
Reducing complexity: The '@' symbol
Use the '@' symbol at the start of your group name to export an entire group as a single image. Very handy for transferring fewer, easier to manage images in Proto.io.
Update individual assets: Export 'Selected Items as Images'
If you edit one or more assets in Sketch after you have imported them in Proto.io, you can select to export individual assets using the third Proto.io Plugin menu option.
Exporting your assets this way will preserve their unique file names as used during the first export and will allow you to drag and drop them to replace them in Proto.io.
Continue editing in Sketch and keep Proto.io in sync
The easiest way to keep all assets in Proto.io in sync is to choose to export all artboards in Sketch, upload the protoio file and then click Cancel in the relevant modal that pops up.
Related tip: If you have created new artboards in Sketch and would like to transfer them to Proto.io, what you need to do is select them from Sketch and then choose to export "Selected artboards as screens" from the plugin menu. This will create a protoio file containing only the new artboards.
Also see video: Using the Proto.io Design Plugin for Sketch.