- Introduction
Canvas
- Canvas
- Layout
Patch Editor
Workflow
- Components
- Creating an Origami System
- Previewing & Sharing
- Keyboard Shortcuts
- Patch Organization
- Custom Devices
Concepts
Patches
- Bouncy Converter
- Classic Animation
- Cubic Bezier Animation
- Cubic Bezier Curve
- Curve
- Pop Animation
- Repeating Animation
- Smooth Value
- Spring Animation
- Spring Converter
- Color to HSL
- Color to Hex
- Color to RGB
- Gradient Builder
- HSL Color
- Hex Color
- RGB Color
- Array Append
- Array Count
- Array Join
- Array Reverse
- Array Sort
- Decode
- Encode
- Get Keys
- Index Of
- JSON Array
- JSON Object
- JSON to Text
- Network Request
- Open URL
- Set Value for Key
- Settings JSON
- Subarray
- Value at Index
- Value at Path
- Value for Key
- WebSocket Connection
- WebSocket Receive
- WebSocket Send
- Browser Buttons
- Browser Chrome
- Camera
- Device Buttons
- Device Info
- Device Motion
- Device Time
- Game Controller
- Haptic
- Interface Orientation
- Location
- Microphone
- Mouse Cursor
- Sound Kit
- Sound Player
- Sound Player Settings
- Touches
- Trackpad
- Trackpad Haptic
- Vibrate
- Double Tap
- Drag
- Drag Settings
- Gesture
- Hover
- Interaction
- Keyboard
- Long Press
- Momentum Scrolling
- Mouse
- Pop Switch
- Scroll
- Scroll Settings
- Scrollaway
- And
- Equals
- Equals Exactly
- Greater Than
- Greater Than or Equal
- Less Than
- Less Than or Equal
- Not
- Or
- Any
- Grid Layout
- Loop
- Loop Builder
- Loop Count
- Loop Dedupe
- Loop Filter
- Loop Insert
- Loop Insert at End
- Loop Option Switch
- Loop Over Array
- Loop Remove
- Loop Remove Last
- Loop Reverse
- Loop Select
- Loop Shuffle
- Loop Sum
- Loop to Array
- Running Total
- ÷
- −
- √
- ×
- +
- Absolute Value
- Arctangent
- Cosine
- Length
- Math Expression
- Max
- Min
- Mod
- Power
- Round
- Sine
- Audio Metering
- Photo Albums
- Photo Library
- Photo Library Media
- Circle
- Oval
- Rounded Rectangle
- Triangle
- Union
- Split Text
- Text Ends With
- Text Input Info
- Text Length
- Text Replace
- Text Size
- Text Starts With
- Text Style
- Text Style Builder
- Text Transform
- Trim Text
- Arc Transition
- Clip
- Comment
- Convert Position
- Convert Position
- Counter
- Date & Time Formatter
- Delay
- Delay 1
- Face Detection
- Image
- Image Info
- JSON to Lottie
- JSON to Shape
- JavaScript Patch
- Layer Info
- Object Detection
- Option Equals
- Option Picker
- Option Sender
- Option Switch
- Point
- Point 3D
- Point 3D Unpack
- Point Unpack
- Progress
- Pulse
- Pulse on Change
- QR Code Detection
- Random
- Repeating Pulse
- Restart Prototype
- Reverse Progress
- Sample and Hold
- Snapshot
- Spacing
- Spacing Unpack
- Splitter
- Stopwatch
- Switch
- Time
- Transition
- Variable Broadcaster
- Variable Receiver
- Vec4
- Vec4 Unpack
- Velocity
- Video
- Video Info
- Wait
- When Prototype Starts
Layers
- Clone Layer
- Color Fill
- Gradient Fill
- Group
- Hit Area
- Image File
- Image Layer
- Live Image
- Lottie Animation
- Map
- Oval
- Particle System
- Progress Ring
- Rectangle
- Shader
- Shape
- Text Layer
- Video File
- Video Keyframes
- Video Layer
- Video Stream
- Viewfinder
- Alert View
- Checkbox
- Circular Progress
- Fake Keyboard
- Page Control
- Screen
- Status Bar
- Switch
- Text Field
- Action Sheet
- Activity Indicator
- Alert View
- Fake Keyboard
- Navigation Bar
- Notification
- Page Control
- Screen
- Segmented Control
- Slider
- Status Bar
- Switch
- Tab Bar
- Text Field
- Visual Effect

Keyboard Shortcuts

Origami Studio provides a variety of keyboard shortcuts for common functions. Mastering the shortcuts for patches will allow you to maintain flow while quickly iterating on your ideas.

General

⌥ ⏎: Insert Patch
⌘ ⏎: Insert Layer
⌘ /: Documentation

Patches

While there is a large library of patches, there is a core set of patches that support a majority of interaction prototypes which have single key shortcuts to speed up workflow.

Inserting Patches

Tip: Use these shortcuts when hovering/selecting a port to quickly connect patches together.

I: Interaction
S: Switch
A: Pop Animation
C: Classic Animation
T: Transition
K: Keyboard
D: Delay
⇧ I: Option Switch
O: Option Picker
X: Splitter
W: Wireless Broadcaster
⇧ W: Wireless Receiver
U: Pulse
+: Add
-: Minus
*: Multiply
/: Divide
%: Modulus/Remainder
⇧ A: AND (Logic)
⇧ O: OR (Logic)
⇧ N: NOT (Logic)
E: Equals
>: Greater Than
<: Less Than
⇧ R: Progress
R: Reverse Progress

Organizing Patches

⇧ ⏎: Rename Patch
⌘ [: Align Patches Left
⌘ ]: Align Patches Right
⌘ ⇧ [: Align Patches Top
⌘ ⇧ ]: Align Patches Bottom
⌥ ⌃ C: Insert Comment Around Patches
⌃ ⌘ G: Create Patch Component
⌥ P: Publish Input/Output Port
⌥ ▼: Enter Patch Component
⌥ ▲: Exit Patch Component
⌘ ⇧ I: Patch Info
⌘ ⇧ A: Select All Patches
⌘ ⌥ L: Add Patch Component to User Library
⌘ ⌥ ⇧ L: Add Patch Component to Other Library

Layers

⇧ ⏎: Rename Layer
⌘ ⇧ H: Hide/Show Layer
⌥ L: Collapse Layers
⌘ ⇧ L: Lock/Unlock Layer
⌘ ⌥ ▲: Bring Forward
⌘ ⌥ ▼: Send Backward
⌘ ⌥ ⇧ ▲: Bring to Front
⌘ ⌥ ⇧ ▼: Send to Back
⌘ ⌥ M: Mask Layer
⌘ ⌥ ⇧ M: Add to Mask
⌘ G: Group Layers
⌘ ⇧ G: Ungroup Layers
⌘ ⌃ G: Create Layer Component
⌥ ▼: Enter Component
⌥ ▲: Exit Component
⌘ ⇧ I: Layer Info
⌘ ⌥ L: Add Layer to User Library
⌘ ⌥ ⇧ L: Add Layer to Other Library

Viewer

⌘ R: Restart Prototype
⌥ D: Toggle Device
⌥ H: Toggle Hand
⌘ ⌥ F: Mini Viewer
⌘ ⇧ F: Fullscreen Viewer
⌘ ⌥ 0: 1:1 Viewer

Number Inputs

▲: Increase number by 1
▼: Decrease number by 1
⇧ ▲: Increase number by 10
⇧ ▼: Decrease number by 10
⌥ ▲: Increase number by 0.1
⌥ ▼: Decrease number by 0.1

Workflow

Keyboard Shortcuts

Animation

Color

Data

Device

Indicator

Interaction

Logic

Loops

Math

Media

Progress

Shapes

Structure

Text

Utility

Layer

Material

iOS

Keyboard Shortcuts

General

Patches

Inserting Patches

Organizing Patches

Layers

Viewer

Number Inputs