When designing a website or web application, a recurring question from clients is: “Do you suggest I run a user test of a web prototype before or after the code is developed and tested?”
The current trend would suggest that if you are building an application or a website, you should absolutely test prototypes before coding anything. Here is why…
Why test the prototype before developing it?
Because it reduces wasted development time and avoids waste.
It is far more expensive, time-consuming and frustrating for your engineers to go back and make changes in the code, whereas it is quicker and easier for your web designer to go back and make changes in Adobe Photoshop (or whatever other tool you use).
Developers’ time is extremely valuable
In a perfect world, developers should spend 100% of their time building new products and new features.
In reality, according to a study, an estimated 50% of engineers’ time is spent on rework or redevelopment that could have been avoided. In addition, fixing an error after development takes up to 100 times longer / costs up to 100 times more than if it had been fixed in advance.
User research done beforehand can save you hundreds of engineering hours and thousands of dollars
Let’s say your developers spend a few weeks writing the code for your site or application. Then, when you run a user test, you discover several kinds of problems. For example:
- Users can’t figure out where to click to find what they are looking for.
- The navigation is confusing and leaves users stuck or lost.
- Users run into problems during the checkout process.
- Users don’t know which icon to click or where to navigate.
- Users can’t find your search function.
Problems like these happen all the time. And they are entirely avoidable.
Avoid having to redo your work by getting feedback up front
Getting feedback from your target users right from the start can help you avoid these costly mistakes, saving hundreds of engineering hours and thousands of dollars/euros.
To make better use of your time, create mockups of a prototype, upload them to your prototyping tool, then run a user test to validate your assumptions and determine whether you are heading in the right direction or not.
Using this method, you will be able to:
- Get real insight into how people react to what you are building.
- Discover every place where they get stuck and give up.
- Quickly change your design and avoid having your developers redo work.
That way, if your users can’t find what they are looking for, if they don’t understand the purpose of your offering, or if they are completely put off by the design, then you can make quick changes without wasting your resources.
How to run a user test of your prototypes?
So how exactly does this process work? If you want to get insight on a prototype, here is a simple and quick process to follow:
- Create the mockups of your prototype in Illustrator, Photoshop, or your other design program.
- Upload it to a prototyping tool.
- Run user tests and get quick insight.
- Run another user test to find out whether your design change solved the problem.
- Once you are sure your design is on the right track, start coding.
- Run several user tests to check that the result of your work works without usability problems before you head out to face the reality of going live.
Which prototyping tools should you use?
The tool Invision makes creating interactive prototypes easy. You can simply upload static screenshots and create clickable prototypes, so your users can understand them and interact with them. But there are many other great prototyping tools you can use. Here are a few 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 Android and iOS apps using the screens or sketches you have already designed, and lets you update any change.
- Justinmind is an interactive wireframe builder that lets you create realistic, interactive prototypes without coding.
- Axure makes it possible to generate realistic wireframes by producing HTML prototypes.
- io helps create fully interactive, high-fidelity prototypes that work like your final app (no coding required).
- Balsamiq helps you design mockups easily and quickly and share them with your teams and your clients.
To conclude…
If you are building a site or an application, you should definitely run user tests on your prototype before writing a single line of code. This will reduce wasted development time (and dollars/euros) by making changes to your product while it is still in the design phase.
If you are interested in learning more about how to run a user test in the prototyping cycle, and how you can use user feedback to improve your application quickly before you write a single line of code, then here is an e-book to read: Getting Out of the Office: Testing Mobile App Prototypes With Users.
In the end, your users will make or break the success of your application, so why not get their feedback before creating your code or building something that may not work for them?
