Skip to content
  • Protopie and Figma
  • Protopie Tips
  • Experience Prototyping
  • Protopie and Figma
  • Protopie Tips
  • Experience Prototyping

PROTOPIE

Moving between Figma and Protopie

Figma and Protopie are different

Figma is a UI visual design tool that enables you to demonstrate your output as a prototype, whereas Protopie is a prototyping (programming) tool that can make things that look very real.

Whereas Figma requires the user to draw out all versions of the UI in tight detail before the prototype can be put together, Protopie lets you (expects you to) start with programming the behaviours in the UI.

When you import Figma elements into Protopie it is great to get all the rich visual detail that Figma encourages. but it also means (in most cases) that you have imported vastly more than is actually needed. In Protopie you don’t need to draw every version of a component … instead you just need to ensure that you have all the required elements whose size, shape, colour, visibility, etc can then all be programmed as needed to produce all your Figma variants.

Likewise whereas in Figma you need a different frame for every screen that is visually different (and all frames must be drawn out), in Protopie a scene is often best used for a single coherent piece of functionality. A single scene in ProtoPie might include numerous scenes in Figma.

Furthermore, autolayout in Figma means that graphical elements that may not be functionally related are often clustered into one container (component) in order to take advantage of auto layout.  But in Protopie you want to group together things that are functionally related.

Potentially related posts ...

Working with Components
more ...
Rough, Rapid, Right
more ...
Arrays and multiple parameters
Protopie seems limited since a message can be sent using only one value as a parameter. However, arrays (written as text strings and manipulated by parseJson) can be used for contexts where multiple parameters need to be passed.
more ...
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.
more ...

© 2023: David J Gilmore