Have a look at this stunning Parallax effect created exclusively with Proto.io. Feel free to import this fully editable project into your own account for use in your prototypes.

I made this illusion based on the Tusi motion method, which takes his name from Nair al-Din Tusi, a Persian astronomer from the 13th century. The principle established by Tusi states that: If a circle with diameter A rotates on the inner boundary of a circle with diameter 2A, then a point on the circumference of the inner circle traces a straight line. As you can see, any ball in the inner circumference is following a perfect linear movement. This is created with 8 Containers where the balls move linear in a loop. The delay between balls must be always the same as the speed of the animation. An ease-in-out cubic-bezier(.4, 0, .6, 1) animation is required to get the circular shape.

The project contains numerous examples completed using variables and conditional logic.

Used variables to change filters on an image

A basic example of reproducing Instagram info bars behaviour. A list header floats over the list's items and remains visible at the edge of the screen until it is replaced by the next list header

Hi there! I would like to share with you the latest version of Spotify prototype. Now you can listen to music while browsing the prototype.

An extended collection of fully animatable UI libraries like triangles, stars, arrows and more, let you bring your idea to life all within Proto.io.

Use a slider component to see the how a map of the US changes every month over a year based on the concentration of a fanbase. Uses a basic variable to change the container state of the map, with map assets created in Sketch. See how a version of it was created step-by-step within the Dashboard & Data Visualization webinar: http://docs.proto.io/videos/using-proto-io-for-dashboards-and-data-visualizations/ tags: variable | variables | data visualization | data viz | map | slider | states | months | USA