Apple Watch using native UI library

32,678
6
264
Created using Proto.io library of fully interactive, native watchOS components.

Akis Ioannou

Form examples

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

Trello's draggable list demo

4,799
5
Hi I tried imitating the Trello's interaction to move tiles/cards between different lists.

51a9fd0d-504e-11ed 9221-0e76797a4f7b

Carousel Onboarding

11,213
9
249
Here's the previous version of Carousel's on boarding sequence

92f2b218-504c-11ed 9221-0e76797a4f7b

Spotify

23,110
6
630
Hi there! I would like to share with you the latest version of Spotify prototype. Now you can listen to music while browsing the prototype.

f4ff2085-9250-11ed 9221-0e76797a4f7b

iOS Spotlight

25,750
0
79
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

IFTTT

16,117
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

Expand/Collapse Menu

7,263
2
486
This is an expand/collapse menu example that can be created using container states.

Akis Ioannou

Submarine Animation

7,710
1
28
A basic animation created by using the Proto.io HTML Component with HTML and CSS. No additional images were needed to be imported to create this animation. The HTML and CSS used was found at: http://codepen.io/ajerez/pen/EaEEOW

Akis Ioannou

Movies & Series

4,056
1
Movies & Series App project Design Credits: https://www.sketchappsources.com/free-source/2896-sample-iphone-x-movies-app-sketch-freebie-resource.html

1f83aed2-504d-11ed 9221-0e76797a4f7b

Next