Introducing: Mobile Preview in Sketch - Anima Blog
Product updates

Introducing: Mobile Preview in Sketch2 min read

Reading Time: 2 minutes Scan a QR code and preview your designs on a mobile device to see how they look and feel on an actual device

Mobile preview Sketch

Introducing: Mobile Preview in Sketch2 min read

Reading Time: 2 minutes

Overview

We’re Anima, a design-to-development platform that plugs into your design tool (Sketch, XD, or Figma) helping you create high-fidelity prototypes that feel like the real thing. With Anima, you can design responsively for all devices and preview how the design will look as HTML or React code in the browser.

The mobile preview dilemma

We’ve all been there before. You have a beautifully designed prototype in Sketch with mobile screens and now, you want to see what it will look like on an actual phone. At this point, there are a few things we can do:

Option 1: You can export your artboards as images and send them to your phone, or use the Sketch Mirror app (but keep in mind you won’t be able to view and interact with Anima’s prototyping features).

Option 2: Preview the design on your desktop (but then you aren’t experiencing it on the intended screen, so questions still arise).

We feel you, and that’s exactly why we’ve introduced the Mobile Preview feature in Sketch. (Oooh-ahhhh)

Sketch Mobile Preview allows you to view your design live from your mobile device by simply scanning a QR code. This allows you to see how the prototype looks scaled down to the intended environment. Play the prototype from your phone like a real mobile app and interact with it to see how the interface feels.

Simply scan your QR code from your mobile to view your design

Simply scan your QR code from your mobile to view your design

Get started with Sketch Mobile Preview

To start, check to make sure your phone and Sketch are on the same network, then:

  1. Open up Anima for Sketch
  2. Select an artboard and click Preview in Browser
  3. Click on the mobile device in the top panel
  4. When the QR code is presented, scan it with your mobile device
View an immersive design just as you would a real app or mobile site

View an immersive design just as you would a real app or mobile site

View an immersive design just as you would a real app or mobile site.

Sounds awesome, right?

Get started now by simply downloading the Anima plugin for Sketch. Now you can build high-fidelity prototypes that look beautiful on all devices and preview it the way it was intended.

Not a designer or don’t have Sketch? Not to worry! You can also import a Sketch file and view the prototype from inside our WebApp.

|

Customer Success Manager

Experienced designer from beautiful San Francisco. Lives and breaths all things technology, design, world travel, and four-legged creatures.

Leave a comment

Your email address will not be published. Required fields are marked *