Drag and Drop

5,043
0
79
Drag and Drop an avatar over a target area that animates when in the drop zone. When released outside the target drop zone, it returns to the original location. Uses a variable to define the target drop zone, that then triggers animations in the zone and when dropped. See how it was made step by step in the webinar video: https://support.proto.io/hc/en-us/articles/115000637591-Advanced-Scrolling-Dragging TAGS: drag and drop dragging variables variable animations on drop animation

Todd Siegel

Google Inbox - compose animation

10,798
5
286
The recently released Google Inbox app is a re-thinking of the email inbox experience that beautifully demonstrates Google's material design interactive animation language. This prototype focuses on the compose button's animation. Click the + to reveal a new state where a wave of buttons and labels float up, and the + becomes a pencil icon. It uses two states, with staggered animations.

Todd Siegel

Forms Display 2

1,609
1
31
Added a floating label

8bcd91d3-4fba-11ee bd60-0e76797a4f7b

GetLost Student Map

4,598
0
64
This one-screen prototype demonstrates some of Proto.io animation functionality.

Akis Ioannou

Spacetrip App

4,213
0
122
'Space tourism for everyone' “Earth is a small town with many neighborhoods in a very big universe.” ― Ron Garan Hey, here is my prototype which I made using Proto.io. Imagine that one day we all will be able to become space travellers.

a16d9c01-504c-11ed 9221-0e76797a4f7b

Expand/Collapse Menu

7,254
2
486
This is an expand/collapse menu example that can be created using container states.

Akis Ioannou

show animaition (tap&scroll)

3,511
1
36
show animaition (tap&scroll)

a50d0f82-504e-11ed 9221-0e76797a4f7b

Search Field Animations

2,760
0
51
Here are 2 different search field animations: 1. Tap to expand size of search field to the right.; 2. Tap to reveal search area underline to the left TAGS: search search box search field animation states

Todd Siegel

Next