Introducing ProtoPie

Getting Started

Making Your First Prototype

ProtoPie Ecosystem

ProtoPie Studio Interface

Import

Getting Started

Importing From Adobe XD

Importing From Figma

Importing From Sketch

ProtoPie Genie

Basic Elements

Containers

Devices

Layers

Preview Window

Scenes

Scroll/Paging

Shortcuts

System Status Bar

Triggers & Responses

Easing

Annotations

Responses

Timelines

Triggers

Formulas

Functions

Getting Started

Layer Properties

Syntax

Formulas Use Cases

Variables

Getting Started

Predefined Variables

Variables Use Cases

AI

AI Interaction Creation

AI Document Q&A

Getting Started

AI Panel Interface

Tips for Best Results

Auto Layout

Auto Layout Properties

Getting Started

Components

Component Guides

Editing Components

Getting Started

Nested Components

Send & Receive Messages

Interaction Libraries

Getting Started

Managing Interaction Libraries

Managing Library Members

Voice Prototyping

Getting Started

Listen Response

Speak Response

Use Cases

Voice Command Trigger

Connecting Devices

Connecting blokdots

Connecting Mobile Devices

ProtoPie Cloud

Getting Started

Managing Prototypes

Managing Storage

Sharing Prototypes

ProtoPie Player

Testing Prototypes

Managing Fonts

Offline Testing

ProtoPie Player for Wear OS

Teams

Editors & Viewers

Getting Started

Onboarding Your Team

Projects

Team Owner & Team Admin

Handoff

Creating Interaction Recordings

Getting Started

Managing Interaction Recordings

Recording Page

User Testing

Creating Test Rooms

External Integrations

Getting Started

Managing Test Sessions

Test Results & Analysis

User Testing on ProtoPie Cloud

ProtoPie Connect

API Plugin

Arduino Plugin

blokdots Plugin

Connect Embedded

Custom Layer Integrations

Custom Plugins

Gamepad Plugin

Getting Started

IFTTT Plugin

Logitech G29 Steering Wheel Plugin

Testing Prototypes

Feature Comparison

Unity Plugin

ProtoPie Enterprise

Getting Started

Organization Settings

Service Admin

Single Sign-On (SSO)

Security

Access Control

Data Transit, Storage & Backup

Incident Response

Network & ProtoPie Player App Security

Overview

Physical Security

Risk Management

Menu

Introducing ProtoPie

Getting Started

Making Your First Prototype

ProtoPie Ecosystem

ProtoPie Studio Interface

Import

Getting Started

Importing From Adobe XD

Importing From Figma

Importing From Sketch

ProtoPie Genie

Basic Elements

Containers

Devices

Layers

Preview Window

Scenes

Scroll/Paging

Shortcuts

System Status Bar

Triggers & Responses

Easing

Annotations

Responses

Timelines

Triggers

Formulas

Functions

Getting Started

Layer Properties

Syntax

Formulas Use Cases

Variables

Getting Started

Predefined Variables

Variables Use Cases

AI

AI Interaction Creation

AI Document Q&A

Getting Started

AI Panel Interface

Tips for Best Results

Auto Layout

Auto Layout Properties

Getting Started

Components

Component Guides

Editing Components

Getting Started

Nested Components

Send & Receive Messages

Interaction Libraries

Getting Started

Managing Interaction Libraries

Managing Library Members

Voice Prototyping

Getting Started

Listen Response

Speak Response

Use Cases

Voice Command Trigger

Connecting Devices

Connecting blokdots

Connecting Mobile Devices

ProtoPie Cloud

Getting Started

Managing Prototypes

Managing Storage

Sharing Prototypes

ProtoPie Player

Testing Prototypes

Managing Fonts

Offline Testing

ProtoPie Player for Wear OS

Teams

Editors & Viewers

Getting Started

Onboarding Your Team

Projects

Team Owner & Team Admin

Handoff

Creating Interaction Recordings

Getting Started

Managing Interaction Recordings

Recording Page

User Testing

Creating Test Rooms

External Integrations

Getting Started

Managing Test Sessions

Test Results & Analysis

User Testing on ProtoPie Cloud

ProtoPie Connect

API Plugin

Arduino Plugin

blokdots Plugin

Connect Embedded

Custom Layer Integrations

Custom Plugins

Gamepad Plugin

Getting Started

IFTTT Plugin

Logitech G29 Steering Wheel Plugin

Testing Prototypes

Feature Comparison

Unity Plugin

ProtoPie Enterprise

Getting Started

Organization Settings

Service Admin

Single Sign-On (SSO)

Security

Access Control

Data Transit, Storage & Backup

Incident Response

Network & ProtoPie Player App Security

Overview

Physical Security

Risk Management

Formulas

With formulas and variables, you can create prototypes that truly come to life. Formulas are expressions that allow you to add logic to your interactions. From validating passwords to counting items in a shopping cart, and even calculating total account balances, formulas make it all possible.

With ProtoPie's formula capabilities, you can access layer properties, perform calculations, and utilize a wide range of functions for tasks like text manipulation and advanced mathematics.

Formulas are added using the formula input field. Simply include layer properties, functions, and variables as needed. Need a quick reference? Just click on the + icon to explore the available layers and variables at your disposal.


{'_type': 'localeString', 'en': 'formulaInput'}

Tip: by enabling the Improved Formula Input Field in Labs, you can quickly identify whether a variable used inside a formula is local, meaning it can be used in the active scene only, or global, meaning it can be used in all scenes.


{'_type': 'localeString', 'en': 'An icon indicating the variable scope appears when typing out a variable name.'}

New to formulas? Don't worry, we've got you covered! Here are some resources to help you make the most out of ProtoPie's Formulas.

  • Syntax — Just like any language, formulas have their own set of rules and principles. Learn the syntax to confidently craft your first formula.

  • Layer properties — Access a wide range of layer properties to bring your interactions to life. Mastering layer properties is the first step towards creating dynamic prototypes.

  • Functions — Take advantage of our predefined formulas that perform specific tasks. Functions process data and deliver results, making your prototypes even more powerful.

  • Use cases — Explore practical examples of how formulas can be used effectively. Learn from real-world scenarios and apply the knowledge to your own projects.

Difference Between Formulas & Variables

Formulas and variables work together seamlessly to enhance your prototypes. Here's a quick breakdown of their relationship:

Variables: Think of variables as handy "baskets" that hold values. They allow you to store and retrieve data, making it easier to reuse information throughout your prototype. Variables can be used independently or in conjunction with formulas. For example, you use formulas to retrieve a value stored in a variable.

Formulas: Formulas are expressions that calculate and "return" a result. They are powerful tools for creating dynamic interactions. You can use formulas to perform calculations, manipulate text, and accomplish various tasks. Formulas can also include variables to access stored values.

The synergy between formulas and variables allows you to take your prototypes to the next level. Variables store values that can be utilized by formulas, while formulas can even be stored within variables for reuse across scenes.

In summary, formulas and variables complement each other, offering flexibility and efficiency in your prototype development process.

Learn more about variables.

Learning the Basics

Formulas may seem intimidating, but they are more accessible than you think. With just a few formulas, anyone can create dynamic interactions!

In this video tutorial, you'll learn how to make an engaging interaction using ProtoPie. Watch as we demonstrate how to move a rectangle layer to the position of another rectangle layer, no matter where it is in the scene.

Learn more about layer properties and doing simple calculations.

Practicing with Examples

Making a Tab Bar

To make responses work dynamically, use formulas instead of fixed values. This video tutorial shows you how to animate a simple tab interaction using formulas.

Learn more about layer properties and doing simple calculations.


{'_type': 'localeString', 'en': 'formula menu'}

Using the Text from the Input Layer

You can also use formulas to display the text information stored in a variable. This video tutorial shows you how you can type in a text and display it somewhere else using a simple formula.

Learn more about input layers and layer properties.


{'_type': 'localeString', 'en': 'formula input'}

Looking for practical use cases? Learn more from practical use cases on formulas.