On-boarding carousel

6,999
2
248
An on-boarding carousel concept, created using Proto.io. It is implemented using state animations. Feel free to import into your Proto.io account.

a03851e9-504c-11ed 9221-0e76797a4f7b

Vertical scrolling feed with 2 expandable areas

7,661
6
407
An example of our vertical scrolling feed, with 2 expandable areas. Feel free to import into your Proto.io account.

Akis Ioannou

To-Do App

3,122
2
108
This is an interactive prototype of a To-Do app and the UI kit used is provided by invisionApp. The UI kit can be found at : https://www.invisionapp.com/do

00812837-504d-11ed 9221-0e76797a4f7b

Bookstore website prototype

2,983
0
For my User Experience & Visual Design class we had to redesign the entire website for a bookstore called Laie that is based in Barcelona. This is desktop proposal. It's my first time using proto.io! Feedback is more than welcomed! I'm a 3rd year Graphic Design student from Barcelona. cristinanitrons@hotmail.com

66d6454f-504d-11ed 9221-0e76797a4f7b

Google Inbox - compose animation

11,439
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

Keezy App Animation

6,391
1
38
Tap/Hold the black circle to see the 2 state animation of the Keezy sound looping app. A circle of circular buttons spins out onto the expanded black circle that becomes the screen background. Once you're on this 2nd state, tap anywhere to return to the initial state. I recorded a webinar showing how to create this interactive animation: http://docs.proto.io/videos/re-creating-bespoke-interactive-animations-with-proto-io-2/ You can also find the assets here used for the prototype. Enjoy!

Todd Siegel

Keep Photo

1,906
0
11
Corporative Photo Snap

17e51993-504d-11ed 9221-0e76797a4f7b

Expand container that moves adjacent content in sync

3,684
3
55
This simple prototype demonstrates how have a container expand and collapse while moving adjacent content in sync.

Todd Siegel

Minimal dialpad/numberpad/passcode

1,971
0
67
Number pad designed for easy re-use. I saw some dialpad examples in Spaces, but I felt that they had way too many moving parts (the circles, the numbers, and the hotspots were all separate) and it was impossible to easily reuse because the circles and numbers were assets and changing look and feel retired changing the assets. So I created this as a completely re-useable dialpad and I have included a few color pickers as an example of how to manipulate the properties quickly through variables.

a21fe9c8-e5d9-11ee ab6d-0e76797a4f7b