Import from Sketch

Sketch is a popular vector graphics tool that is well suited for UI design. Flinto provides a downloadable Sketch plugin which allows for the easy import of multiple screen designs from Sketch into Flinto for Mac. Sketch files can be updated and re-imported after the initial import to update the content inside Flinto.

Install the Send to Flinto Sketch plugin

Before installing Flinto’s Sketch plugin, be sure you have Sketch installed on your computer.

The “Send to Flinto” Sketch plugin can be downloaded from flinto.com/mac_sketch_plugin. A shortcut to this page is accessible from Flinto > Install Sketch Plugin. Once downloaded, double click the file and it will open in Sketch and be installed.

Using Send to Flinto

The Send to Flinto sketch plugin works for the current page in Sketch, and requires at least one artboard to be present. Activate the plugin from the Plugin menu inside Sketch or using the command + control + shift + f keyboard shortcut.

After activating the plugin, a window will appear where options about the Flinto file can be set. The plugin attempts to guess your target device size based on the size of your artboards in Sketch. You can choose a device size or enter your own custom dimensions if the default value is incorrect.

The scale value can be used to scale up your document to match the pixel density of your target device. For example, if you work at 1x pixel density and target a 2x pixel density device such as iPhone 6, you can set the scale to 200% which will scale your designs appropriately. Flinto for Mac uses bitmap layers, so the scale needs to be set before importing to avoid blurry looking graphics.

When you are ready, press “Send.” Each artboard in your Sketch document will turn into a screen in Flinto for Mac. Flinto for Mac will open and you will be presented with a new Flinto document, or asked if you would like to merge the Sketch file into an existing open document. This file is not saved initially, so you may want to save it as a first step after import.

Import characteristics

Rasterizing and Flattening

The Send to Flinto Sketch plugin keeps layers as vector shapes when possible, and converts them to bitmaps otherwise. Flinto supports vector rectangle shapes with a single fill, border and shadow. If a rectangle layer has properties not supported by Flinto, it will be flattened into a bitmap when imported.

The plugin also flattens groups without children when importing. This flattening behavior helps keep the export fast and simplifies the resulting prototype. If you find a group is flattened and would like to access the individual layers, add a group inside that group in Sketch and import again.

Limitations

Some features of Sketch are not available in Flinto for Mac.

Re-import

After sending designs to Flinto for Mac from Sketch, you may find yourself updating your source Sketch file. To send those changes to Flinto, repeat the same process you used initially. Your Flinto file will be updated and links will be maintained.

New layers will be added, and deleted layers will be removed. Newly added artboards will be added as new screens but deleted artboards will be left as screens within Flinto, leaving you the option to delete them manually.