Proto_handouts_intro

Page 1

proto.io Mobile phone


proto.io Mobile phone

fundamentals screen / screen state

screen transition

state transition

page controller

page container

button / interaction share / preview

download


proto.io Mobile phone

Project settings Device iPhone 7 Plus

iPhone 7

iPhone 6/6s Plus

iPhone 6/6s

iPhone 5/SE

iPad Pro

iPad

Apple Watch

Android Mobile

Website 1280

Website 1366

Website 1920 Default orientation Portrait

Landscape


proto.io Mobile phone

screen New screen > Title, Orientation, Background, Start screen


proto.io Mobile phone

screen state New screen state > + State 1‌


proto.io Mobile phone

state transition New state transition


proto.io Mobile phone

state transition From state 1 to state 2


proto.io Mobile phone

state interactions add interactions based on ‘state enter’, ‘state leave’ or ‘key down’ events.


proto.io Mobile phone

screen transition New screen interactions > Trigger, Orientation, Screen before show, Screen before hide, Screen show, Screen hide, Key down


proto.io Mobile phone

button / interaction Search > button


proto.io Mobile phone

interaction add interactions > Title, Trigger, Action, Screen, Transition, Duration, Easing, Delay


proto.io Mobile phone

page controller Properties

properties > Background, Active, Border, Active button, Change active state on click

Interactions

add interactions > Title, Trigger, Action, Screen, Item, Horizontally, Duration, Delay


proto.io Mobile phone

page container Properties

Scroll properties > scroll, snap, Inertia, Pinch/Zoom, Scrollbars, Initial position, Draggable

Interactions

add interactions > Title, Trigger, Action, Screen, Item, Delay


proto.io Mobile phone

share

share links


proto.io Mobile phone

preview

Preview in proto.io player

download

Export project to HTML

Capture screens to export to PDF/PNG

Export all screens to PNGs (zip)

Export all screens to PDF


proto.io Web


proto.io Web

screen / screen state

screen transition

state transition

page controller

button / interaction

Share / Preview

Download


proto.io Web

Project settings Device iPhone 7 Plus

iPhone 7

iPhone 6/6s Plus

iPhone 6/6s

iPhone 5/SE

iPad Pro

iPad

Apple Watch

Android Mobile

Website 1280

Website 1366

Website 1920 Default orientation Portrait

Landscape


proto.io Web

screen New screen > Title, Orientation, Background, Start screen


proto.io Web

screen state New screen state > + State 1…


proto.io Web

state transition New state transition


proto.io Web

state transition From state 1 to state 2


proto.io Web

state interactions add interactions based on ‘state enter’, ‘state leave’ or ‘key down’ events.


proto.io Web

screen transition New screen interactions > Trigger, Orientation, Screen before show, Screen before hide, Screen show, Screen hide, Key down


proto.io Web

button / interaction Search > button


proto.io Web

interaction add interactions > Title, Trigger, Action, Screen, Transition, Duration, Easing, Delay


proto.io Web

page controller Properties

properties > Background, Active, Border, Active button, Change active state on click

Interactions

add interactions > Title, Trigger, Action, Screen, Item, Horizontally, Duration, Delay


proto.io Web

page container Properties

Scroll properties > scroll, snap, Inertia, Pinch/Zoom, Scrollbars, Initial position, Draggable

Interactions

add interactions > Title, Trigger, Action, Screen, Item, Delay


proto.io Web

share

share links


proto.io Web

preview

Preview in proto.io player

download

Export project to HTML

Capture screens to export to PDF/PNG

Export all screens to PNGs (zip)

Export all screens to PDF


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.