auto-complete search

4,194
2
153
Type the first character of topics from http://uxofvr.com to see the auto-complete. (a-z, 2,3). Use ESC to hide the dropdown. Uses a variable to capture the content of the search field then uses the javascript method "{search}".charAt(0) to capture the first character of the search string to then change the container state property of the auto-complete dropdown to match the first character typed. see video of how to create this step-by-step in the webinar: https://support.proto.io/hc/en-us/articles/115001243532-Model-advanced-prototypes-that-use-variables TAGS: auto-complete search dropdown variables variable character selection Thanks to Costas Thoma for the model.

Todd Siegel

Bodymovin Animation

2,820
0
26
A project which uses Vector Animations to recreate popular social app interactions.

Constantinos Thoma

Shopping App

2,080
0
Design Credits: https://www.sketchappsources.com/free-source/4675-marier-shopping-ui-kit-ebizmirli-sketch-freebie-resource.html

74a7bee2-504d-11ed 9221-0e76797a4f7b

Tik Tok

1,785
0
14
Tik Tok project (Part 1) The videos in the project have been downloaded from: https://www.pexels.com/videos/ https://www.pexels.com/video/close-up-of-wheat-in-field-9917770/ https://www.pexels.com/video/moving-pages-of-books-8994820/ https://www.pexels.com/video/woman-with-freckles-on-her-face-looking-at-the-camera-8055998/ https://www.pexels.com/video/portrait-of-a-beautiful-young-woman-8056090/

17056140-504e-11ed 9221-0e76797a4f7b

Variables Examples

33,607
44
2,617
The project contains numerous examples completed using variables and conditional logic.

Akis Ioannou

Socialize

1,195
0
Social app for blocking.

5dceb9f0-504e-11ed 9221-0e76797a4f7b

Keezy App Animation

5,582
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

Extended UI libraries

24,534
3
122
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.

Akis Ioannou

Next