As much as we might want it, the one, special tool that fixes any problem in design is nonexistent. At Fueled, we don’t believe in depending on any specific software—otherwise, we'd still be designing apps on Fireworks or Photoshop.

The same concept applies to our prototyping tools: we're not reliant on InVision’s prototyping just because it’s our default place to lay out apps. Sometimes an app requires fewer series of flowing screens and more tangible interactivity. For that, we would traditionally use Flinto and Principle.

Recently, we've taken note of some new tools coming in the shape of Origami and Framer. Used for designing interfaces, they are mostly aimed at mobile—or at least natively support it, fitting very neatly into our remit.

Simply put, Origami is a tool used for design prototyping. You can play around with layers and masks, create your own library for faster progress, and construct a variety of interactions before previewing your product live. Origami is a designer’s sandbox, setting no limits to what you can make.

Ryan Murphy, one of Fueled’s many talented product designers, used Origami prior to joining Fueled and continues to do so when the project suits it. The software carries just a few defining features that make it a powerful and handy tool for designers.

Loops

Build once and repeat as many times as you want (Caution: 32 is the max on some patches!).  This is a great feature for building repetitive, yet different content like photo libraries, friends’ feeds, and notification views. Look at loops in a similar way you would with Sketch's symbols and Figma's Components.

You can create a group, apply a loop to it, and define how many iterations you require along with the values that separate them. From that point on, you'll be able to use the loop builder patch to alter facets within your group, whether they are pictures, text, colors, or a whole host of other things. Step out of the box and experiment!

Camera

There are some ways in Framer to get the native camera, but nothing offers access to a device's camera as easily and succinctly as Origami. It can be as simple as inserting the camera patch and pushing any of the 3 outputs (image, video, and stream) to your desired destination.

With a little setup, you can have a video stream, recording state and an outputted recorded video. When you're designing an app that uses those kinds of interactions, it's vital to establish the most realistic experience for your users—and doing so without long development sprints means you can get valuable feedback quickly.

Native Components

Ask anyone in the design field. They'll tell you the absolute worst bit about being a designer isn't being asked to fix your parents’ Wi-Fi (although that might be a close second); it’s getting resources for native components. Finding share-modals and notifications is a real, hefty chore.

With Origami, the necessary components are already there to make sure that your design is compatible with the device and OS you're designing to. All of their elements are interactive and customizable, making any design look at home on the device.

Online Data

A distinct advantage of Origami over other prototyping tools is its ability to pull in live data from the world wide web (like JSON files or images). Plugging in the correct sources and parsing them through the relevant patches can elevate a prototype from static content to real data, resulting in more genuine results.

Facebook provides a few demonstrative tutorials, using scenarios like launching Unsplash photos, requesting the weather forecast, or even recreating the iOS App Store.

Offline Builds

If you ever have to hit the road and want to experiment with your prototype wherever you go, Origami allows you to save it to a device. It’s 2019—You can and should be able to test out apps in real life scenarios than in a small office with a camera in someone's face. This tool offers a solution to change that.

Realistic testing environments yield realistic testing results, and let’s face it: there are some things that just can’t be fabricated in an office.

Small Bundles

A well-built prototype will generally also be a small prototype. Considering that many members of Fueled work remotely, this is a staple for our company’s nifty, easy-to-carry toolbox.

In a world where files can be synced and sent every day, it’s a no brainer that you’d rather be sending a 2.8MB Origami file than a 2.8GB After Effects project. This also makes it exponentially quicker to launch it into users’ mobile devices.

With Origami, you have the total freedom to download and manage projects on the go— location will no longer have any effect on your productivity.