ProtoPie Connect is a companion product to ProtoPie Studio. It allows you to integrate physical devices and external data with your Pies

There are two versions of ProtoPie Connect:

Connect Desktop is available for Windows and Mac. It allows the ability for several Pies to communicate with each other, allowing the creation fully immersive multi-screen experiences. It also includes a number of built-in plugins for integration with popular devices and services:

Logitech G29 steering wheel and pedal set

Arduino, both via direct serial connection as well as no-code integration via Blokdots.

Enterprise Plan subscribers get the following additional capabilities enabled with Connect Desktop:

You can use Connect to make prototypes that can run on Google WearOS smart watches

You can write your own plugins — essentially making it possible to integrate your Pies with just about anything!

Connect Embedded is only available to Enterprise Plan subscribers. Connect Embedded runs from the terminal on several operating systems, including Windows, Mac, and Linux / Raspberry Pi (ARM64). Connect Embedded can also run in an offline mode, making it perfect for prototyping a standalone appliance-like experience.

Today’s digital experiences stretch beyond just a laptop screen or your tablet. More and more we are seeing harmonious intersections of software and hardware. As digital designers — and indeed advanced prototypers — it is inevitable that we’ll need to mock up an experience that interfaces with physical things. ProtoPie Connect builds on top of ProtoPie Studio’s advanced capabilities allowing you to take your ideas well beyond your computer monitor.

Quite simply, whatever you can dream up! ProtoPie Connect can be used to create automotive dashboard experiences, IoT and smart home integrations, kiosk experiences, assistive living devices, connect to live data APIs, interface with robotics... even the sky isn’t the limit — no reason you couldn’t design a system for use on the International Space Station!

Since you’re still with me, you’ve already taken your first step! 

These tutorials assume you have an intermediate to advanced level of proficiency with ProtoPie.  In particular, you should have a decent grasp of how Send & Receive works. If you're not feeling quite that comfortable yet, spend some time with our 

As all of the tutorials in this series will involve ProtoPie Connect Desktop, you next step will be to get it installed. Download it here:

There are seven tutorials in this guide, ranging from the most basic use cases all the way up to some of the most advanced.  We suggest completing these tutorials in order, so start with lesson 1.

Use Send and Receive to Make Multiple Pies Talk in Studio


Learn how to use Send and Receive between your Pies to create a true multi-screen experience.



Learn how to use the IFTTT plugin in ProtoPie Connect to prototype with hundreds of online services.


Arduino Part 1 - Connecting with Blokdots


Learn how to use Blokdots to integrate with your Arduino projects without writing any code.


Arduino Part 2 - Roll Your Own Sketch Code


Learn how to use ProtoPie Connect's Arduino plugin to directly access your Arduino project.


Create an Automotive Dashboard Experience with G29


Learn how to use the Logitech G29 Steering wheel with ProtoPie Connect to create a realistic dashboard experience.



Learn how to connect to write custom code that provides the date, time and weather to your Pies.


Advanced Bridge App - Connect to Your Smart Home *


Learn how to have your Pies interact with your Smart Home, and how to turn your bridge app into a ProtoPie connect plugin.

* Note that lessons 6 and 7 make use of features only available to Enterprise Plan subscribers.

Bring your ideas to life like never before! Connect your prototypes to multiple screens, devices, hardware, and APIs.

Complete Guide to ProtoPie Connect

Quite often we would like to create prototypes that involve physical devices. While 

 built-in plugins are quite versatile in interfacing with all sorts of things, it is inevitable that you come across something that is not covered by these plugins. Much like in the previous lessons, subscribers to the 

 plan can write custom bridge apps to allow communication between ProtoPie and any device you can imagine.

So you just learned how to build and run your very first Bridge app in the 

. In this one, we’ll connect to our smart home through an open source application called Home Assistant in order to physically control a smart light bulb.

Once again, we’ll start with the standard “boilerplate” code that gets us connected quickly to 

 to relay commands to turn our smart light bulb on and off.

You’ll see how it’s possible to run multiple bridge apps 

We’ll create a portable plugin file to make sharing your bridge app around with your team easy.

 only works with the full version of Connect included with the 

 subscribers get the added ability to use and write custom plugins with ProtoPie Connect.

You won’t need to be a professional developer to follow along with the examples below. If you’ve ever coded with JavaScript before — even simple stuff — you should be fine. But if you’ve NEVER coded before, you’re going to be in way over your head.

If you’re brand new to coding, I suggest going through the following tutorials first:

Net Ninja: JavaScript Tutorial For Beginners

Net Ninja: Node JS Tutorial for Beginners

Learning to code is a time commitment for sure, but it’s a really useful skill for a prototyper, and even as a designer, knowing just a little bit about coding will do wonders for your relationship with your engineering team.

We’re coding, so we need to use a good text editor. Utilities built-in to your OS like Notepad will work, but they’re not ideal. Fortunately there are many great editors available: 

I’ll be using Sublime Text in my examples, so if you want to see what I see, use Sublime Text.

Home Assistant running on your network with at least one smart light

Installing and configuring Home Assistant is outside of the scope of this tutorial, but if you head over to 

 page, you should find everything you need to get up and running.

Any dimmable smart bulb that Home Assistant supports will work for this tutorial.

If you don’t have a dedicated machine to run Home Assistant on, you can run it in a 

 on your computer, which will work just fine for this lesson.

This is the same code we started with in the previous lesson. Download this ZIP file and extract it somewhere convenient on your computer.

Download and open the following Pie files in ProtoPie Studio.

Here is the Light Sliders Pie file in its completed state:

Learn how to have your Pies interact with your Smart Home, and how to turn your bridge app into a ProtoPie connect plugin.

Intro to ProtoPie Connect 7 of 7: Advanced Bridge App - Connect to Your Smart Home

 comes with a number of useful and easy to use plugins out of the box for integrating with things like 

 or direct serial connection. But what if you want to interface with something not covered by the plugins? If you subscribe to the 

 plan, it’s possible to write your own bridge app to connect your Pie with any product or service.

 app that interfaces with ProtoPie Connect using a connection technology known as 

Start with some standard “boilerplate” code that will get you connected quickly to ProtoPie Connect from your app.

 library to provide a formatted date and time to your Pie.

 API to retrieve current weather conditions and provide them to your Pie.

Writing custom bridge apps for ProtoPie Connect only works with the full version of Connect included with the 

 web site and make an account. You’ll need one in order to connect to their weather API. We’ll be using a free service, so no need to set up a paid account.

I’ve written some code to get you started. Download this ZIP file and extract it somewhere convenient on your computer. And open the Pie file in ProtoPie Studio

 in the video I paste in a snippet of code for the Icon Map. Here is that code so you can copy and paste it in to your project.

Icon map code snippet

 and add your Open Weather API Key on line 66

Here is the finished Pie file in its completed state:

And there you have it! But we won't stop here. Let's go and try to take this to another level in the final installment in this series with 

Intro to ProtoPie Connect 7 of 7: Advanced Bridge App - Connect to Your Smart Home 

Learn how to connect to write custom code that provides the date, time and weather to your Pies.

Intro to ProtoPie Connect 6 of 7: Writing Your First Bridge App

 is a popular choice in the automative industry, and for good reason. Connect makes it possible to create prototypes of in-car multi-screen dashboard experiences. Connect has a built-in plugin for 

 steering wheel and pedal set, making it possible to include steering wheel controls in your experience.

In this lesson, we’ll cover handling messages sent from the 

 in our prototype. Furthermore, you’ll see how the G29 plugin can be used in tandem with other plugins in order to create a true multi-screen dashboard experience.

 racing wheel and pedal set. In addition you’ll also need the manual shifter to fully follow along with all of the steps. Sometimes these two can be bought in a bundle, but often they are sold separately.

 handy for the last part of this demo. Make sure you’ve already gone through 

Intro to ProtoPie Connect 4 of 7: Arduino Part 2 - Roll Your Own Sketch Code

If you have the PlayStation version of the G29, it has a switch that allows you to toggle between PS3 and PS4 compatibility mode. 

Once you’ve got everything you need, follow along with the video below.

Up next, we'll teach you how to build your own Smart Home in 

Learn how to use the Logitech G29 Steering wheel with ProtoPie Connect to create a realistic dashboard experience.

Intro to ProtoPie Connect 5 of 7: Create an Automotive Dashboard Experience with G29

, I showed you how quick easy it is it connect your Arduino project in ProtoPie using 

. But there were a couple of issues that we encountered. We were getting reverse button behavior — Blokdots reported 1 when the button was unpressed and 0 when pressed — and when we turned our encoders too quickly, we were seeing a problem known as 

 where the encoder sometimes counted down when it should be counting up, or counted up when it should be counting down.

We were able to work around the first problem by reversing the connections to the ground (GND) and voltage (+) pins on the encoder, and for the second problem we were careful not to turn the encoder knobs too quickly. Both of these problems (and many others) can be properly handled if you write your own Arduino code.

Don't worry! You won’t need to write any code — you’ll be working with an Arduino script – called a 

 – that I’ve already written. You'll just need to copy and paste. This lesson is not about learning how to write code. What this lesson will focus on is just what you need to know in order to get your Arduino working with 

if, however, you are feeling adventurous and you'd like to try writing your own Sketches, know there are numerous examples online for writing Arduino code to get you started. In fact, the Sketch I wrote is largely based off of what I learned (ahem… copied…) from 

In this tutorial we’ll cover the following:

The specific code details you'll need to pay attention to for use with ProtoPie Connect

Validate your code and upload it to your Arduino board

Configure and enable the Arduino plugin in ProtoPie Connect

We’re using the same finished Pie as in the last lesson. Download it here:


Have your Arduino circuit wired up like we did in the 

Arduino Sketch code

Paste this code into your Arduino software window.

Once you have everything ready, just follow along with the video below.

In the video I point out two important things you need to remember when writing an Arduino Sketch for use with ProtoPie Connect. I’ll leave these two details below for your reference:

The baud rate (i.e., how frequently the serial connection is checked for updates) you select in Connect’s Arduino plugin needs to match what you specified in your code.

ProtoPie Connect looks for messages written to the serial connection, so you use 

 in your code to send messages back to Connect.

For a message without a value, just print the message out to the serial connection like so:

For a message with a value, you need to separate the message name and the value with two pipe (

ProtoPie Connect will recognize this pattern and receive the message 

If you are supplying a variable as the value for the message, in Arduino code you can’t build the message in one line. For example, this won’t work:

You need to build this in two lines of code, using 

Serial.print("SET_TEMP||");
Serial.println(temp);

 adds whatever you specify to the current line in the serial connection, while 

 writes to the serial connection AND adds a Return character to the end, signifying the end of the line or, from ProtoPie Connect’s perspective, a sent message.

ProtoPie Connect waits until a Return character has been output to the serial connection before acting on the message. In this way you could programmatically build up your message in several parts by issuing a number of 

 command, signifying the completed message to ProtoPie Connect.

Serial.print(message);
Serial.print(”||”);
Serial.println(value);

Intro to ProtoPie Connect 5 of 7: Interaction with the Logic G29

, we'll show you how to create a true multi-screen dashboard experience.

Learn how to use ProtoPie Connect's Arduino plugin to direct access your Arduino project.

Increasingly, our digital experiences are extending beyond computers and mobile screens. Say you want to introduce physical controls in your design… a button… a knob you can turn… a bar that you can touch and slide your finger across. Inexpensive computing boards like the 

 are making this increasingly accessible to those wishing to experiment.

 that can be operated by either a touch screen or with physical with physical knobs that can be turned and clicked. These are known as 

, and even if you haven’t heard the term, you’ve no doubt interacted with one at some point. These have a clicking sensation you can feel as you twist the knobs. The clicks you feel as you turn the knob increase or decrease something by one step with each click — say the volume control on your car’s audio system

Using Blokdots to send message to your Pie via 

This depends on your experience with wiring up an Arduino circuit.

, a little bit of coding is involved. If the thought of writing any code at all is enough to make you run for the hills, there is an alternative. 

 is a program that runs on your computer allowing you to program your Arduino without the need to write any code at all. The best news? It comes built in with an integration with 

, meaning you can very quickly start having your Pies react to interaction with physical devices.

 is still in beta, but it’s already proving just how fast and easy it is to work with physical devices.

All of the lessons up to this point have not required any additional purchases above a ProtoPie license. To follow along with this tutorial you’ll need to source a number of parts:

, which will come with almost everything you need for this project, plus a pack of 

While Blokdots takes care of the coding side of things, you still need to get your hands dirty wiring things together. For simple things, this isn’t hard, and it’s very likely you can find a circuit diagram online somewhere that will show you exactly how to connect your components to the Arduino board without needing to understand exactly how it works.

Follow the diagram below to wire up your Arduino circuit.

If you need a little more hand-holding, there are detailed instructions below the video.

 and click the yellow download button in the top right. As Blokdots is still in beta, updates are frequently being released with new features and fixes. Be sure to check for updates often.

Second, we’ll be working with a Pie file in its completed state. Download it here:


The Pie has a counter-clockwise rotation when increasing the fan speed, yet when we use the physical controls, we turn the encoder clockwise. See if you can figure out how to make the fan speed control knob work opposite to the temperature control — having it turn counter-clockwise to increase the fan speed, and clockwise to decrease it.

You have a second button wired up, but thus far unused. What might you do with it?

If you're not familiar with wiring circuits, fear not! The following are descriptions of all of the components involved in the circuit, and detailed instructions of how to wire everything up.

 is designed to make connecting components easy.

There are a group of connectors along the top — these are the digital connectors, and they are clearly numbered. We’ll be using several of these to connect our encoders.

There is a group of connectors along the bottom labeled 

 We’ll be using the connectors labeled 

 to connect everything. A breadboard makes it easy to connect your electronic components without needing to solder them together.

 comes with a breadboard very similar to the one in the image below. It is made up of a grid of holes:

It’s important to understand that certain groups of holes are connected. There are two rows of holes at the top, and another two rows at the bottom. They are labeled with + and – at either end. The holes in each of these four rows are connected together. Typically you’ll use these rows to connect power to your project. If you connect a power source to ANY of the holes in the very top row, anything else plugged into the top row will be powered by it.

The groups of holes in the middle are arranged in vertical groups of 5. Each of those groups of 5 is also connected together. You plug you components into these groups, and we use pieces of wire to make connections between groups of 5 and power rows.

A rotary encoder is a special kind of knob that clicks as you turn. The ones used in this project are also push buttons.

There are 5 connector pins, all clearly labelled:

 - Ground pin. This connects to the Arduino’s GND connector

 - Voltage pin. This connects to Arduino’s 5V connector

 - this is the pin that specifically signals when the knob’s pushbutton has been pressed. This will connect to one of Arduino’s Digital connectors

 - the encoder’s Data pin. Connects to one of Arduino’s digital connectors

 - the encoder’s Clock pin. Connects to one of Arduino’s digital connectors

💡 It’s not important that you understand how DT and CLK actually work. What IS important is that when you use encoders with Blokdots, the DT and CLK pins need to be connected to 

sequential digital connectors on the Arduino

. For example, if the DT pin is connected to Digital 3, then the CLK pin needs to be connected to Digital 4. We’ll cover this again when we get to wiring everything up.

The pins of the encoder conveniently fit into the breadboard!

Go ahead and push both encoders into the breadboard. Plug them in so that each pin of the encoder is connected to a different vertical group of five holes.

The last piece of the puzzle is the wire that connects everything together. The 

 comes with a number of lengths of jumper wire. The color you use doesn’t matter — wire is wire — however the colors help to identify different parts of your project. For example, a red wire is commonly used to indicate power (or more specifically voltage). Feel free to use whatever color scheme makes sense to you.

Remember the wiring diagram from above? Connect wires to match what you see in the diagram. Remember, the colors of the wire you use don’t matter, so if you don’t have the same colors as shown below, simply use another color.

Connect a wire from Arduino’s 5V connector to ANY of the holes on the bottom row (marked with “+”). This row is the power strip.

Connect a wire from either of Arduino’s GND connectors to ANY of the holes on the second from the bottom row (marked with “–”). This row is the ground strip.

Be mindful that if you have your project oriented the same is in the diagram, the encoders are facing away from you right now, so from this perspective, the pins from left to right are as ordered as follows:  

Connect a wire between ANY of the holes in the ground strip to ANY of the holes in the group of 5 that the encoder’s GND pin is connected to.

Connect a wire between ANY of the holes in the power strip to ANY of the holes in the group of 5 that the encoder’s + pin is connected to.

Connect a wire between Arduino’s Digital 2 connector and ANY of the holes in the group of 5 that the encoder’s SW pin is connected to.

Connect a wire between Arduino’s Digital 3 connector and ANY of the holes in the group of 5 that the encoder’s DT pin is connected to.

Remember when I mentioned that Blokdots requires the encoders to use sequential connectors? Since the DT pin is connected to Digital 3, the CLK pin needs to connect to Digital 4. Connect a wire between Arduino’s Digital 4 connector and ANY of the holes in the group of 5 that the encoder’s CLK pin is connected to.

Connect a wire between Arduino’s Digital 5 connector and ANY of the holes in the group of 5 that the encoder’s SW pin is connected to.

Connect a wire between Arduino’s Digital 6 connector and ANY of the holes in the group of 5 that the encoder’s DT pin is connected to.

Like before, we need to connect the CLK pin to the next sequential digital connector on the Arduino. Connect a wire between Arduino’s Digital 7 connector and ANY of the holes in the group of 5 that the encoder’s CLK pin is connected to.

If you did everything right, it should look similar to this:

Good job! You've just connected your first Arduino project with Blokdots using ProtoPie Connect. Let's see what else we can do with this in 

Learn how to use Blokdots to integrate with your Arduino projects without writing any code.

Intro to ProtoPie Connect 3 of 7: Arduino Part 1 - Connecting with Blokdots

In this quick tutorial, you’ll follow a very simple example that shows how you can use ProtoPie Connect’s built-in 

 to create an integration between your Pie and a third-party online service.

How to build a simple applet in IFTTT and trigger it from 

 and it’s pronounced like “Gift” but without the “G.” It’s an online platform that allows interoperability between hundreds of popular internet services, creating new possibilities for automation. Just have a browse through 

 apps and products currently available for use in IFTTT, things like Twitter, Dropbox, Evernote, FitBit, Amazon Alexa, and Google Assistant, just to name a few among the 700+ on offer. You can read more about what IFTTT is 

 model. You create applets that are triggered by something you define and in response certain actions are performed. For example, in a smart home scenario, you might create an applet to turn on your hallway lights when the front door is unlocked. Or, more specifically:

How does IFTTT work with ProtoPie Connect?

 has a built-in plugin that can be used to trigger something called a 

 You can think of it in almost exactly the same way that 

 works in ProtoPie. A message — called an 

 — is sent to IFTTT. IFTTT, in turn, is configured to listen for that event, and takes whatever action you have configured. And, like with ProtoPie, a little bit of data can optionally be sent along with the message.

 as a trigger, and the action will be to send en email.

Download the starting Pie here, and follow along with the video below!

 mark of the video I demonstrate building something called a 

 as the value that we send along with our message to Connect. You can follow along with the video or just copy this — it will work as-is:

, check out the resources at the bottom of this article to learn more.

While this is a very simple example of how you can use the IFTTT Plugin, it illustrates just how easy it is to get your Pie working with a third-party service. Any service that IFTTT supports can be triggered with a Webhook event from ProtoPie Connect. It’s easy to see how your Pies can jump from Studio’s preview window to start interacting with all sorts of stuff on the internet.

At the 3:27 point in the video we built something called a 

 that eventually got passed on to our IFTTT applet. JSON is used all over the internet to store and transfer information in a human readable format. Here are a few resources where you can learn more about JSON:

JSON - Everything you need to know In 3 minutes

ProtoPie Connect

Complete Guide to ProtoPie Connect

Intro to ProtoPie Connect 7 of 7: Advanced Bridge App - Connect to Your Smart Home

Intro to ProtoPie Connect 6 of 7: Writing Your First Bridge App

Intro to ProtoPie Connect 5 of 7: Create an Automotive Dashboard Experience with G29

Intro to ProtoPie Connect 4 of 7: Arduino Part 2 - Roll Your Own Sketch Code

Intro to ProtoPie Connect 3 of 7: Arduino Part 1 - Connecting with Blokdots

Intro to ProtoPie Connect 2 of 7: Your First Integration with IFTTT

Intro to ProtoPie Connect 1 of 7: Use Send and Receive to Make Multiple Pies Talk in Studio