Skip to content

UX Prototyping & Protopie

  • Principles
    • Educational
    • Figma Integration
  • Patterns, Pitfalls, Ploys
    • Patterns
    • Pitfalls
    • Ploys
  • More …
    • People-Centered Design
    • Thinking about AI
  • Principles
    • Educational
    • Figma Integration
  • Patterns, Pitfalls, Ploys
    • Patterns
    • Pitfalls
    • Ploys
  • More …
    • People-Centered Design
    • Thinking about AI

parseJson gives no error message

parseJson can only return a node at the bottom of the JSON structure and cannot return an object – which means it is very important that you know the structure of your JSON and that it doesn’t vary.

Also, it is important to construct your request string very carefully as there are no error messages returned to tell you you have got it wrong. The solution to this is to find a way to check whether parseJson has returned “” and if it has, do something to alert you (change the colour of an object, for example).

Another common mistake is to use the indices, 1, 2, 3 etc when something has multiple values – whereas in fact parseJson uses the indices 0,1,2 etc. Thus, in my quiz with ten questions (which pulls data from a trivia API), I use the indices 1-10 to represent each instance of the question component (in a variable called “Identity”), but in the extraction of the question from the data returned from the API I have to use the index “Identity”-1.

Here is a pie which allows you to explore how sources and keys work with parseJson – it contains some simple examples, but you can edit the fields to try your own values – select the source style and then type the key and enter (or hit go).

Check if Protopie Connect is present

If you are building a prototype that depends upon Protopie Connect then it is a good idea to start by checking if Connect is actually present.

Moving between Figma and Protopie

The wrong variable type

This pitfall is not a big deal, but it can waste you time as you try to track down why your variable seems to have the wrong value (or no value). It can also bite you in a formula where your variable is of the wrong type for the formula.

Why use Protopie?

There are many prototyping tools out there, so what makes Protopie special – how is it different?

Sending messages to two places

Whilst it is important to be careful in sending messages to the right places, it is also very powerful to send a message to two different places at the same time (or maybe with a small delay).

Receive and Assign hazard

Receiving a message, and then assigning a value and then writing a conditional based on that value is that something that is quite a normal, conceptual pattern – but in Protopie it will often not work as expected. This is because responses to Protopie triggers all happen simultaneously and not in the order written.

Rough, Rapid, Right

Use overridable variables in components

By using an overridable variable in your components you can have many instances of the component in your scene, but with different values for the same variable.

Check if your other pie is present

Moving between Figma and Protopie

Using the wrong mental model for Protopie

The wrong variable type

Arrays and multiple parameters

Origami Studio, Figma and others

  • Welcome
  • What’s New?
  • About
  • Welcome
  • What’s New?
  • About

info@peoplecentereddesign.org

© 2026 David Gilmore