Published on | Prototyping: From UX to Front End — Medium Tyler Burgett

The companion posts to the 360iDev talk.

So if I have Sketch Cloud, why do I want InVision? The answer is: a slew of power features.

The whole thing feels super polished. If you are wanting to show off a design to a remote client and get some feedback from them without getting their hands all over your design files, this is a great way to do it. Although I have used InVision at work for design meetings, there are a lot of features that I had not checked out and this was the perfect excuse to kick the tires.

It has some nice tools for teams. The Workflow tab has a kanban-style board for moving artboards through a flow of: On Hold, In Progress, Needs Review, and Approved. You can assign these to a user and set a deadline. If you go the enterprise route, you can even customize the workflow.

You can see version history in the Activity tab, as well as who made the changes. From the ••• menu you can export a copy of the prototype which you can run locally or host on a server.

In the last post, I mentioned that the Craft plugin is very powerful. You can link up your artboards as you would in a storyboard in xCode and tap around just like a real app. You can share this with other people and they can check it out in the InVision app on their device.

Something very interesting that InVision provides is a video recording of someone using with your prototype from UserTesting.com. This is a great way to get some feedback from a third party. Your mom, your best friend, and your significant other will all tell you your app makes sense because they love you. The kind of candid feedback you can get from putting your creation in the hands of a stranger is invaluable. You get three free recordings a month (between now and November 20th, it is unlimited). I requested two user tests, and the results were very interesting.

When you send off your prototype you can include a description and some instructions for what you would like the tester to hit in the prototype. I requested that my users take a look at the Grilled Octopus recipe and try to order the ingredients.

The first tester was grossed out by the thought of eating octopus, but was clearly well versed in iOS and was familiar with Apple Pay. She gave feedback about selecting where the ingredients would come from, and even though she did not like the idea of octopus for dinner, she liked the fact that it was easy to order the ingredients right from the app.

The second tester liked the idea of having multiple recipes to choose from. In case you are really hankering for octopus, but have guests coming over that are not fans of spicy food, you would have options. She also wondered where the ingredients were coming from. Since we have heard that from two different people, that is something that we should look into adding to the design.

“I think this is really cool and if it were a real thing I would definitely give it a try.” — Tester 2

Even though this was just for the talk, it was encouraging to hear that our second tester was interested in the app. Being able to watch and see where a user gets hung up is extremely valuable. If you can catch and fix those snags before putting code behind buttons and controls you are going to save yourself lots of resources that would otherwise be spent on refactoring. These sorts of tests would normally take a lot of time and money to set up, so to be able to request them from your couch and get a video back in two hours is amazing.

Once you have your user feedback, it is time for a design meeting to talk over what you have learned. Liveshare from the web and Freehand from the Craft plugin are two ways that you can look at a design over the web with multiple people and mark them up in real time. Much better than trying to point a webcam at a whiteboard over Skype or emailing a file around and trying to make sure everyone is on the same page.

Talking with Scott about how to put the user feedback to work.

Given that you get one project for free, I would encourage you to check out InVision, and run a few prototypes by UserTesting to see what folks have to say.

Links

InVision gives you one project for free, and you have access to unlimited UserTesting between now and November 20th(usually you get 3 free per month) so go check it out.

These folks crank out a ton of content. Check them out on Medium.

They are also working on designbetter.co, a site with podcasts, books, and other content to help you make your design kung-fu strong.

Here are the link to the Octo UserTesting videos: Tester 1, Tester 2.

Other posts in this series

Intro
Sketch
InVision — you are here
Figma
Keynote
Framer
Which tool(s) should I use?

The right 🛠s for the job — InVision was originally published in prototypr on Medium, where people are continuing the conversation by highlighting and responding to this story.

The right s for the job — InVision

Cool stuff, every week

More Articles