Happy Halloween

2,133
0
A halloween project i have put together using the Proto.io Halloween icon set: https://proto.io/freebies/free-halloween-icons/

2cf05637-cc17-11ef a04a-0e3ec7c5f8cf

Drag and Drop

5,377
0
80
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

Vr House Tour

2,168
0
A 3D Interactive Walkthrough of a space using the Proto.io VR Component. Using gaze click interactions you can transition from one 360° scene to another. Import this fully editable project into your Proto.io account to create your own 3D interactive walkthrough.

72010307-9b82-11f0 ad7f-0e3ec7c5f8cf

Carousel & AutoScroll

1,400
0
15
Using the Carousel default Pattern in Proto.io. I use a few screen interactions to turn it into an Autoscroll Carousel. Design Credits to: https://www.sketchappsources.com/resource/download-3665.html

1866935c-504d-11ed 9221-0e76797a4f7b

Emoji Toggle Component

1,482
0
8
Mouse over and out to toggle between the active and inactive state. Click to select the active state, click again to deselect. Showcases the power of containers in Proto.io. Each emoji is converted into a container (through the right-click menu). The individual emoji containers have two states: selected and deselected. The parent container contains all the emoji containers. This parent container has 6 states: non-selected, and the active state for each emoji (5). The click/tap trigger changes the both the individual emoji state, and respective parent container state to the active emoji. Easily change the emojis to any other one you choose while maintaining all the interactions. Make sure to click into each individual emoji container and double-click the current emoji and replace the image with the new one from the asset library. Replacing the image by double-clicking the existing one preserves the grayscale in the deselected state. Enjoy!

Todd Siegel

Interactive Line Graph - The easy way

1,766
0
14
This is a simple way to create an interactive line graph. There is another way to create it which involves Draggable Elements instead but that requires a much more complex setup. Go ahead and import the project in your account! By seeing the interactions you will realise how easy it is to recreate. p.s not the smoothest animation but feel free to improve it

bbac9ce3-504c-11ed 9221-0e76797a4f7b

Cool latest update info carousel with Lottie

2,141
6
23
Cool latest update info carousel using Lottie/Bodymovin animations Lottie files used are available at: https://lottiefiles.com/1446-bikingiscool https://lottiefiles.com/118-notification-request https://lottiefiles.com/1032-graphs https://lottiefiles.com/3583-yoga-girl-3

bbac9ce3-504c-11ed 9221-0e76797a4f7b

Next