UBER

14,809
9
I created a prototype of the UBER app for Android in order to demonstrate what is possible using Proto.io. This project was a massive undertaking as my goal was to simulate the user experience of what it would be like to order 4 different UBER cars in San Francisco. I plan on doing a full "behind the scenes" article on my website about the challenges I faced along the way simulating the UBER app in Proto.io. Special thanks to the awesome team at Proto.io for all of their tireless assistance along the way! If you are looking for an experienced Proto.io prototype engineer or are looking for tutorials and more information about Proto.io please visit my website: http://protonerds.com/

8ea06e34-504c-11ed 9221-0e76797a4f7b

10 Second Timer Example

6,509
5
213
I simulated a 10 second timer that counts down from 10 to 0. This is very simple to do. All you need to do is change the text property of the text value with a custom value and include a delay of 1 second. Then add a callback for the next number with a delay of 1 second. Repeat this until you get to the number 0. There is no need to use variables to simulate a timer. If you are looking for someone to help you with your prototype, we are available for hire at: http://protonerds.com/

8ea06e34-504c-11ed 9221-0e76797a4f7b

Expand container that moves adjacent content in sync

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

Todd Siegel

SpaceTrip Low-fidelity

2,849
0
2
Basic shapes like rectangles, lines, circles, text and more are available and they can be dropped on the canvas to create the very first draft of a mobile app in order to demonstrate the flow and functionality of the app.

a03851e9-504c-11ed 9221-0e76797a4f7b

Vocation Station

1,369
0
2
Imagine not being able to get to a job because you don't have a car? Or finding a perfect fit that you can't get to. Vocation Station is the answer, allowing job hunters that don't have access to their own vehicles to find a job based on their ability to get there. Included should be transit times, blackout times, etc.. so that people that may work swing/overnight shifts or weekends would know in advance whether or not it would be something they could realistically do. This would enable employees to apply for the right positions, hold positions longer and employers to avoid and reduce turnover from chronic late-comers and no-shows.

5063867e-504d-11ed 9221-0e76797a4f7b

Get the position of a scrolling container

4,047
2
114
If you need to get the Y position of a vertically scrolling container, create a text box. Then on the container scroll trigger, set a variable that evaluates the numerical callback value from the event (Y position). Then add a callback that changes the text property of the text box by reading from the variable.

Todd Siegel

Form examples

7,782
0
165
3 prototypes showing different uses of the form components for iOS 1) Activate / de-activate button when checking / un-checking Terms of Service 2) Capture text input to change property 3) Change number of tickets - limit 8 See how they were created step-by-step in the Using Forms webinar video: https://vimeo.com/118919393 This version on Vimeo includes time-codes so you can jump to particular sub-sections (repeated below as a preview): > Range of iOS form input controls 2:02 > Labels 2:17 > Text fields 2:32 > Setting placeholder text 3:04 > 5 Input Types that display the appropriate iOS keyboard (Text, Numeric, Email, Password, Telephone) 3:30 > Using the Telephone keyboard for credit card number input (large # keys) 4:08 > Need to view prototype on device in order to see the range of keyboards 5:59 > Multi-line text area input field 6:24 > Search Bar 6:40 > Checkbox control customization 7:22 > On/Off Switch control customization 7:52 > Slider control customization 9:27 > Increasing size of slider handle 9:47 > Picker Wheel Customization 10:00 > Prototype example: Activate button when checking terms of service 10:42 > Create a button with two states (using convert to container) 12:55 > Adding interactions to a checkbox control (on change activation/deactivation) 14:45 > Definition of variable and range of uses 17:04 > Using variables with text field interactions 18:25 > Prototype Example: Using a variable to capture text input and show it in a different text box using change property. 23:27 > Prototype: Use variables to increment and decrement counter showing number of tickets being purchased. 28:40 > Searching full range of icons built into Proto.io 29:10 > Using a variable to limit the range of tickets (0 to 8) 32:46 > Copying and pasting interactions with Variables 40:08

Todd Siegel

Snapchat Login Sample

2,521
2
This prototype is basically just a Snapchat login very well designed, with most of the replicable elements of their app.

6433ad9b-504d-11ed 9221-0e76797a4f7b

Next