Mirr.io is a Sketch plugin which adds interactivity to your designs. It comes with a live desktop preview which streams to any mobile device just like Sketch Mirror but magically interactive.
It supports headers & footers and prototypes can be shared online with one-click.
Tap 'New Template' in Mirr.io to open a demo file in Sketch.
Select a layer and tap OPTION + CMD + A to bring up the events panel.
Layers with 🔸 already have an event.
Use 3 groups on your artboard called
These groups need to match the artboard width, which may mean using a square as a background. See FAQ.
Note that headers and footers only work when a
Content group is present.
Timer actions can be added to entire artboards. Just select the artboard and tap OPTION + CMD + A. Useful for loading & splash screens.
Mirr.io decides that an artboard called
splash in the current Page is the first screen to show. Otherwise it will use the first artboard created - usually the one at the bottom of the list.
Upload and share your prototype with one click. File > Publish To Web. These are public to anyone who has the link.
These will be deleted after 28 days. If you wish to update the prototype simply generate a new link.
Q: How much does Mirr.io cost?
Q: Do actions work when nested in symbols?
Q: Can I use the Demo version of Sketch?
Q: How do I preview on my mobile device?
Make sure your mobile device and Mac are connected to the same network. Choose File > Open Local URL in Mirr.io to find the IP address. Visit this URL on any browser.
Q: How do I set the background color of an overlay?
Mirr.io inherits the background colour of the artboard. Uncheck 'Include in Export' to make sure it's not included with the content.
Q: Do layers with events work on artboards with timers?
Yes! if you're quick enough you can click them before the timer ends.
Q: Things are out of position!
Using headers and footers tells Mirr.io to place the content in a scroll view. If you see incorrect positioning, make sure these groups are the same width as the artboard. Sketch trims the transparent pixels of groups, so you may have to use a background rectangle.
Q: Who made this?