design

Here’s how you can preview your Sketch designs on Android Phone

Sketch has got a lot of fan fare and if you ask me personally, I love using it. (In fact, I am in process of creating a full fledged tutorial on how to use Sketch for your daily work).

While Sketch has some very robust features when it comes in assisting you to design for iOS platform, it kind of falls short at a lot of places while helping you to design for Android. When the developers of Sketch asked their users about the views on what they can do to improve the workflow. Lot of designers responded with a request to make Sketch Mirror for Android. Sketch Mirror is an iOS-only app, which lets you preview your designs directly on devices (using some smart web sockets trickery, i think). Unfortunately, Bohemian Coding has not yet developed it for Android.

But, don’t worry. I found a workflow that lets you to preview your designs directly on your Android phones with a keystroke in Sketch. It involves a Sketch Plugin called sketch-preview by Marc Schwieterman, Skala Preview for your Mac and Skala View for your Android Phone.

Here is a step-by-step guide on how you can start previewing your designs on your Android devices.

Step 1 : Download the Sketch Preview plugin from this link. (freeware). Download Skala Preview for Mac from this link. (freeware). Download Skala View for your Android device from this link. (freeware)

Step 2 : Install Sketch Preview plugin by clicking on Plugins menu and selecting Reveal Plugins Folder. Unzip your Sketch Preview plugin files and paste them in the folder that had opened by Reveal Plugins Folder command. Restart Sketch. On restarting you will get 2 new options in Plugins menu. a) Preview b) Preview Setup. Read the documentation on the plugin page to get an in-depth understanding of Preview Setup.

Step 3 : Install Skala Preview on your Mac and Skala view on your Android device

Step 4 : Connect Skala Preview and Skala View. To do this make sure that your Mac and Android device are on same wi-fi network. In your Skala view on your Android device, click on the monitor/tv icon and select your Mac. When you do that you will be prompted to authorize the device on your Mac in Skala Preview app. Approve the authorisation.

Step 5 : Preview your design on your device by selecting the artboard that you want to preview and pressing ⌘P. This will push your artboard to Skala Preview on your Mac, which will sync it with your Android device. Everytime you update your design, press ⌘P and see the live preview of your updated design on your device.

At times there are problems in syncing the designs between Mac and Android device. If this happens with you, just go ahead and click on monitor/tv icon again on your Android device and select your Mac again and everything should work just fine.

If you have any better workflow to preview designs on Android, please feel free to share as a response to this story.

Follow me on twitter @jaymanpandya

P.S. : If you do not want to buy the Sketch Mirror from Apple App Store, you can use the same workflow to preview your designs on your iOS device. You can download the Skala View for iOS from here.

Advertisements
Standard

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s