Previewing your prototype

Framer Classic has a local share function. Click the Preview button (top right).

In a web browser

There’ll be an option to open the prototype in your default web browser, which you can also right-click to copy the URL.

This same URL will also work on other computers (or devices) on your local network. This way you can quickly share a prototype with colleagues. You can update your prototype on the fly: every time you save the project, it will automatically be reloaded, also on other machines.

Note that you’ll have to type the 6-digit Access Code when trying to view the prototype on another computer or device.

To see all open projects in Framer, you remove the last part of the URL. If the URL is:

http://10.11.13.89:8000/PB4W3S/Somelogo.framer/

shortening it to just the IP address and port number (as below) will give you a list of open projects.

http://10.11.13.89:8000/

How does this work?

Framer has a built-in web server that uses port 8000 by default but will switch to a different port when needed. It works on most local networks.

On a mobile device

Framer’s Preview apps use the above-explained ‘mirror’ function to show your prototypes on a mobile device, so they will also automatically reload the prototype every time you save it.

Both the iOS and Android app received updates last November and now also support device sensors. Check the example prototypes in the blog post to see how you can use a device’s compass, orientation, and motion.

The apps now also support connecting over USB, so when you’re on a protected WiFi network, you can just plug in your device. (You’ll then also don’t have to type a prototype’s 6-digit Access Code.)

Both apps can save prototypes offline so that you can view them without an internet connection.

iOS

Framer Preview is the official app for iOS (Not available anymore).

And there’s an alternative app: Frames (Not available anymore), but this one hasn’t seen any updates for a while.

Android

For Lollipop (5.0) and higher, there’s the one and only official Framer app (Not available anymore).

As an Android user, you’ll have to enable developer mode and USB debugging on your device to preview via USB.

It might be better now, but performance on Android wasn’t always optimal. That’s why some designers started to gather tips on how to speed up a prototype by making small changes to it.

Windows

Framed for Windows 10 (Microsoft Store) not only works on the desktop but also in Windows 10 Mobile and Windows Holographic (Hololens).