e-Wallet

3,878
0
74
Swipe up and down to choose between cards Credits: Card designs used from: https://www.sketchappsources.com/free-source/2453-credit-card-designs-sketch-freebie-resource.html

2be093e4-504d-11ed 9221-0e76797a4f7b

Final Fantasy 7

2,247
1
1
A recreation of the classic JRPG Final Fantasy 7 game start screen. Use the Up/Down keys on the keyboard to navigate the options. Hit the 'Enter' key when 'New Game' option is selected to play the intro cutscene from the original game. I do not own the rights to any Final Fantasy franchise, game, media or art. All right reserve to Square Soft/Square Enix. (http://www.square-enix.com/) This is a tribute to their franchise.

186c533a-504d-11ed 9221-0e76797a4f7b

IFTTT

16,680
4
208
An as close as possible copy of the IFTTT onboarding experience. This prototype is also made in 4 other tools (Pixate, Origami, Framer & Form) to compare the differences between them. More info: http://medium.com/sketch-app-sources/five-app-prototyping-tools-compared-form-framer-origami-pixate-proto-io-c2acc9062c61 Original app: http://appstore.com/IFbyIFTTT

c6b28cc9-c0be-11ed 9221-0e76797a4f7b

auto-complete search

4,855
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

Website Template

4,138
0
75
A website template with multilevel dropdown menus and scrolling area.

469c1b7e-504e-11ed 9221-0e76797a4f7b

Drag and Drop

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

Next