A simple project that changes the route of the Google Maps embed code using the HTML component found in Proto.io using states. Use the menu below the map to navigate to switch to another route or another map format. Format 1 changes based on menu selection using Google Maps. Format 2 changes based on both menu and route on map using images.

One Page Website example created with 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

An example of a sticky scrolling sidebar (website)

I simulated a 10 second timer that counts down from 10 to 0. This is very simple to do. All you need to do is change the text property of the text value with a custom value and include a delay of 1 second. Then add a callback for the next number with a delay of 1 second. Repeat this until you get to the number 0. There is no need to use variables to simulate a timer. If you are looking for someone to help you with your prototype, we are available for hire at: http://protonerds.com/

'Cook it' is an app where users can find recipes based on ingredients they have at home. This project uses variables to add ingredients to the list using a single input field. I created the loading animation using a group of images which rotate into a pot. I used cloning and obscurity transitions in the recipes screen to display the recipe when it's tapped.

This image uploading animation simulates dragging and dropping a file into a predefined area using Variables. *Credits to Jokūbas as this is a replicate of his animation https://dribbble.com/shots/1413804-Image-Uploading-Animation

change the background color using variables and container states

Setting up a calendar event using Proto.io Templates and Variables

A simple, one page prototype inspired by Ramotion's Contact Sync (https://dribbble.com/shots/1749645-Contact-Sync?list=users&offset=11). Just play with the on/off switches.