auto-complete search

4,446
2
154
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

Scrapbook

1,764
0
2. CREATE A SCRAPBOOK PAGE: a) Create a new Page b) Add 1 default image from collection c) Crop the image on the canvas d) Paint a squiggle e) Cut up the image on the canvas into 4 pieces of any shape f) Type something g) Place an emoji h) Save Scrap After 5 min take a break, or not View Trust Circles

88cbb260-5980-11f0 a04a-0e3ec7c5f8cf

Image upload animation

2,055
0
24
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

Anna w

Using a switch to select items and add costs

2,437
0
54
Use a variable to add the costs of premium features that are selected or deselected using an iOS switch component. See a video of how to do this step-by-step in this webinar: https://support.proto.io/hc/en-us/articles/115001585411-Model-advanced-prototypes-that-use-variables-part-II TAGS: variables variable math addition switch switches fire an items event

Todd Siegel

Switching tabs

2,070
0
15
I replicate this cool "Switching tabs" animation by talented Jokūbas- https://dribbble.com/shots/1984025-Switching-Tabs For the creation of this animation, I simply used various state transitions.

Anna w

Bungee jump animation with custom easings

3,033
0
Say hello to our brand new visual easings manager! This project was created using custom easings and more specifically cubic bezier.

Christos Chatzikkos

Zero inbox

2,307
0
14
Zero inbox example using the 'Slide to Delete' pattern

34041018-d2c9-11ed 9221-0e76797a4f7b

Date picker

7,786
1
441
An example of a date picker that can be imported and used in your project. (Basic use of variables) tags: calendar, picker, date picker

34041018-d2c9-11ed 9221-0e76797a4f7b

ProjTN

1,009
0
1
Projet de MOCI telecomnancy

0cb8a7d6-504e-11ed 9221-0e76797a4f7b

Next