Basic shapes like rectangles, lines, circles, text and more are available and they can be dropped on the canvas to create the very first draft of a mobile app in order to demonstrate the flow and functionality of the app.

Designers can use their favorite design tools like Photoshop and Sketch to design the finest details of the user interface for their app. Single or multiple touch interactions can be applied on any UI element (layer) on each screen. Sophisticated animations can be created on-screen as well as screen transitions, using the powerful timeline animation features that Proto.io offers.

This prototype is a simulation of one part of the Pandora iPhone app. I have chosen to simulate the part of the app where the user selects a Pandora radio station and then proceeds to select that station. What I have demonstrated is how how the radio station animates from a small entry on a list to a large full screen entry and vice versa. If you would like to see how I created this prototype, please watch this video tutorial here: http://docs.proto.io/videos/pandora-tutorial-part-1/

This is an expand/collapse menu example that can be created using container states.

Spa and salon app

My own version of the Pandora Taylor Swift example provided by Proto.io's video tutorial.

A data visualization where a bar chart of faces flies out showing the details of individual faces.

Using color adjustment and filters, I've simulated the iOS spotlight animation. Learn how you can apply these filters at https://proto.io/en/new-features/adjustments-filters/