A friend of mine is in the process of re-designing his web app right now and he asked me this question:
Question: Would you suggest I user test the prototype mockups now or perhaps once the engineers code it up? Should be done in a few weeks.
Here’s my answer: Whether you’re building an app or a website, you should definitely test the prototype before you code anything.
Why?
Because it reduces wasted development time.
It’s way more expensive, time-consuming, and frustrating for your engineers to go back and make changes in the code than it is for your designer to go back and make changes in Adobe Illustrator (or any other tool you use).
Developers’ time is extremely valuable
In a perfect world, developers would spend 100% of their time building awesome new products and features.
In reality, an estimated 50% of engineering time is spent on doing rework that could have been avoided. What’s more, fixing an error after development is up to 100 times as expensive as it would have been before.
A little up-front user research can save you hundreds of engineering hours and thousands of dollars
Let’s say your developers spend a few weeks writing code for your site or app. Then when you run a user test, you discover all kinds of problems. For example:
- Users can’t figure out where to click or tap to find what they’re looking for
- Confusing navigation causes users to get stuck or lost
- Users run into trouble during the checkout process
- Users don’t know which icon to click or tap
- Users can’t find your search function
Stuff like that happens all the time. And it’s completely avoidable.
Avoid re-work by getting feedback early
Getting early feedback from your target market (and making research-backed, user-centered design decisions) can help you avoid those expensive errors, saving hundreds of engineering hours and thousands of dollars.
A much better use of your time would be to mock up a prototype, drop it into Invision (or another prototyping tool), and then run a user test to validate your assumptions and figure out whether or not you’re heading in the right direction.
Using this method, you’ll be able to:
- Get insights into how real people respond to what you’re building
- Find out all the places they get stuck and give up
- Iterate quickly on your design and avoid re-work by your developers
That way if your users can’t find what they’re looking for, if they don’t understand the value proposition, or if they’re completely put off by the design, then you can make rapid changes without wasting resources.
How to user test your prototypes
So how does this process work exactly? If you want to get insights on a prototype, here’s a quick and simple process you can follow:
- Mock up your prototype in Illustrator, Photoshop, or your program of choice
- Drop it into Invision (or another prototyping tool)
- Run some user tests and get rapid insights
- Make design changes based on feedback
- Run another user test to find out if you design changes solved the problem
- Once you’re confident your design is on the right track, code it
- Do one more round of user testing to make sure everything actually works with no usability issues before you let it go live
What prototyping tools can I use?
We use Invision because they make it easy to create interactive prototypes. You can simply upload static screenshots and create clickable prototypes your users can interact with and understand.
But there are plenty of other great prototyping tools you can use. Here are a few that we recommend (in no particular order):
- Marvel — Quickly turns your sketches, images, and mockups into prototypes that look and feel like the finished product
- Flinto — Lets you quickly prototype your iOS and Android apps by using screens or sketches you’ve already designed, allowing you to update as you iterate
- Justinmind — An interactive wireframe creator that enables you to create realistic, interactive prototypes without any coding
- Axure — Allows you to generate realistic wireframes by generating HTML prototypes
- Proto.io — Helps you create fully interactive, high-fidelity prototypes that function just like your finished app should (without any coding required)
- Balsamiq — Helps you quickly design mockups and easily share them with your teams and clients
The final word
If you’re building a site or an app, you should definitely user test your prototype before writing any code. You’ll reduce wasted development time (and dollars) by making changes to the product while it’s still in design.
If you’re interested in learning more about how user testing fits into the prototyping cycle, and how you can utilize user feedback to quickly iterate and improve your app—before you’ve written a single line of code—then I recommend you check out our eBook: Getting Out of the Office: Testing Mobile App Prototypes With Users.
You’ll learn how getting user feedback on your prototypes can lead to valuable improvements to your app’s functionality, usability, and overall consumer appeal. You’ll also get an in-depth look into the stages of prototype testing with users.