Published on | Prototyping: From UX to Front End — Medium Danny Salvatori

At Remind, I use Flinto a lot to make interactive prototypes. I have tried my hand at a wide of gamut of tools like Origami, Principle, & Framer, and have found Flinto to be the fastest and most intuitive out there. The biggest challenge with Flinto is that sharing prototypes with remote users can be difficult.

To get a remote user to open a Flinto prototype, I need to:

Make sure they have an iPhone
Explain how to download the Flinto iOS app
Share a link to the Flinto file
Explain how to open that link with the Flinto iOS app

All of this seems kind of obvious, but explaining it in text to someone who is outside of the tech bubble can be like watching this:

Source: Imgur

So here’s a step-by-step guide on how to get your beautiful Flinto prototypes in the hands of remote testers. We use Usertesting.com at Remind, but you could probably apply this to any other remote testing tool out there.

Step 1: Create a prototype test

When creating a new test, Usertesting asks you what you’re testing. Go ahead and select Test a Prototype.

Step 2: Select the right device and recording method

No that you’ve created your test, you need to tell Usertesting what kind of users you want. If you’re using a Flinto prototype, make sure you select smartphone for the device and webcam for the recording method.

Why a webcam, you ask?

Usertesting has their own mobile app that directly records the screens of a tester as they are using a prototype. This is really helpful with web-based clickable prototypes made with InVision, Marvel, Flinto Lite, etc… because Usertesting’s mobile app just opens the prototype in a web view inside the app and is able to record the user’s touch interactions. Flinto prototypes are not web-based, so users will need to leave the Usertesting app in order to open your Flinto prototype. What this means for you is that you won’t see anything that the user is doing. Selecting Webcam as the recording device ensures that the tester is actually using a camera pointed at their screen, so you’ll be able to see everything they do, even if they leave the Usertesting app.

Step 3: Make sure users have an iPhone

Next, in the Demographics section, choose users who have iOS as their operating system.

I also recommend including a screener question that explicitly asks prospective testers what kind of phone they have. Without the screener question, I’ve seen some users who actually have an Android device somehow get into the test. Here’s a look at what our screener question looks like:

Step 4: Include downloading the Flinto iOS app as the first task in the test

Usertesting allows you to add instructions to the beginning of your test, but I’ve found that people tend to gloss over that section.

To ensure that testers actually download the Flinto iOS app, make the following instructions the first task of the test. Here’s a look at the instructions I usually use.

To participate in this study, you will need to install the Flinto App (don’t worry, it’s free) in order to be able to see the prototype. You can delete the app immediately after this study. Follow the steps below to install Flinto.

To Get the Flinto app:

1. Go to the App Store on your mobile device
2. Search for and download Flinto (Flinto, LLC.)

Proceed to the next task.

Step 5: Create a link to your prototype

Because Flinto is not web-based, the easiest way to share a prototype is to store it in some cloud-based file service like Dropbox or Google Drive and then share the URL of the file. This has its advantages, because if you discover you have a bug in your prototype, you can just fix it and the link that you’ve shared will always point to the latest prototype.

Usertesting doesn’t give testers a way to open a link by tapping on it, so they’ll have to actually type the entire URL out. Dropbox URLs can be long, so I recommend using some link-shortening service like Bitly or Google’s URL Shortener to get the URL down to something reasonable.

Step 6: Explain how to open your prototype

Nice! Now that you’ve got your shortened prototype link, make another task in Usertesting that will explain how to open the prototype. It’s a little more involved than simply typing in the URL. The URL will take a user to a screen where they can view a thumbnail of the prototype file, but to actually open it with Flinto, they will need to directly download the file to their phone first.

Here are the instructions I usually use. We use Dropbox at Remind, so if you’re using a different service, you might need to modify the instructions.

To download the mobile prototype:

1. Go to this link:
<Include your prototype link here>

The link is case sensitive, so please make sure to use capital letters when you see them. Please be patient as it may take a minute or two to load.

2. Once the screen loads, you should see a download icon in the top right — it looks like a white arrow pointing down, on a blue background. Tap that download button.

3. Tap “Direct Download”. This will start the download process and may take a few moments. Once it has fully downloaded, you will see an option to Open in “Flinto”

You should now be viewing the prototype in Flinto. Nice work! Before tapping around in the prototype, proceed to the next task.

And here’s what that flow actually looks like:

Type link in, direct download, Open in “Flinto”, voila!

Voila! ✨

Congrats! You’ve done it! Now you can test your amazing Flinto prototype with remote users and gather the feedback you need. I’ve had success with this approach and getting non-technical users to successfully follow the instructions above, but I know they can be tedious. If you’ve found a simpler solution, please share!

Special thanks to the amazing Analía Ibargoyen for proofreading this.

A 6-step guide on how to use Flinto to do remote user testing was originally published in Prototypr on Medium, where people are continuing the conversation by highlighting and responding to this story.

A 6-step guide on how to use Flinto to do remote user testing

Cool stuff, every week

More Articles