Message notification

1,359
0
24
Popup message on iPhone simulation Message appears in 2 seconds after screen loads / swipe left to dismiss / tap message app to run again

17056140-504e-11ed 9221-0e76797a4f7b

Expenses Report

2,550
0
35
The list and chart include animations created using states. Design from: https://www.sketchappsources.com/free-source/4505-expenses-report-sketch-freebie-resource.html

17056140-504e-11ed 9221-0e76797a4f7b

Company Sign in Process

744
0
3
Redesigned from: https://www.sketchappsources.com/free-source/4742-job-seaking-app-sketch-freebie-resource.html to create the sign in process for a company. Incudes: Splash Screen Onboarding Carousel Message Notification Animation Auto Change Focus on Inputs

16ff68c7-504e-11ed 9221-0e76797a4f7b

Extended UI libraries

23,955
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

COUNTER

2,266
3
163
3 different counters using variables 1. A standard counter 2. A counter from the number of seconds the user sets 3. A countdown

Paul Baker

iOS Spotlight

24,384
0
78
Using color adjustment and filters, I've simulated the iOS spotlight animation. Learn how you can apply these filters at https://proto.io/en/new-features/adjustments-filters/

a03851e9-504c-11ed 9221-0e76797a4f7b

Form examples

7,233
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

Vertical scrolling feed with 2 expandable areas

6,409
6
407
An example of our vertical scrolling feed, with 2 expandable areas. Feel free to import into your Proto.io account.

Akis Ioannou

Next