Prototyping: An integral part of every designer’s workflow

One of the great discussion points in the world of design right now is in the value of prototyping – but what exactly is it and why do we need it?

Sketching and Prototyping

What is a prototype?

In the simplest terms, a prototype in design is a test model for the final user experience. It’s what designers use to put their work to the test by simulating the experience that users will have with the content.

The feedback at this stage is invaluable when it comes to refining designs to work as best they can for the end user.

Why is prototyping important?

The different levels of fidelity of prototypes depends upon the stage we’re at in the design process, but each direction is equally important when it comes to understanding how the content will work.

Without this process of planning, designs would be haphazard, ill-informed and out-of-kilter with what our audiences actually like to engage with online.

We don’t only gain insight into audience behaviours, but we also save time and money in the long-run when it means we’re not wasting development time on a design that isn’t ready.

That’s why it’s crucial to test and learn along the way with a number of design iterations in the form of prototypes. These take one of two basic shapes: low-fidelity and high-fidelity.

What is low-fidelity prototyping?

This comes in the early stages of the design process to conceptualise the final piece, but it’s in its most basic form with no frills.

Prototyping tools like InVision, UXPin and Balsamiq make it quick and easy to visualise ideas for initial feedback before any time is wasted on design.

This is purely focussed on functionality at this stage, so it’s a crucial part of the planning phase as you can see from my example below (which is taken from an app project I’m working on):

What is high-fidelity prototyping?

As the design progresses, it’s necessary to produce higher-fidelity prototypes to continue to test and learn. Multiple phases of feedback (from both users and clients) really help you refine your designs to make them perfectly tailored to your target audience.

The nature of high-fidelity prototypes is such that they are much closer to the final appearance of the content, so it’s a great way to get aligned with developers to be able to brief them properly.

The following example shows the progression from the above low-fidelity prototype to its high-fidelity form, following multiple rounds of feedback:

Conclusion

The benefits of prototyping are plain to see, so there’s no doubt in my mind that it will continue to grow in popularity with clients. It’s easy to spot the difference between content that has been prototyped and content that hasn’t.

Prototyping is best considered as an iterative process; we design, we test and we iterate. It’s a cycle that applies to every project if you want the best results.

Companies that embrace prototyping will reap the rewards for years instead of having to redesign and rebuild content that doesn’t work for their audiences because it wasn’t tested in the production process.

Get in touch if you have any questions about the prototyping process!

Collaboration with others could also be possible here. If the app could facilitate shared Watchlists, you’d be able to collaborate on ideas to make smarter investments with your family and friends as well.

There are also a few discrepancies between the app and the website whereby this part of the service is still referred to as ‘Virtual Portfolio’, so that could do with clearing up to avoid confusing users.

News

HL makes good use of its news section to share its expertise and standing in the market, which I find very useful and informative.

Personalisation and accessibility would be key here, though. There’s currently no ability to filter or select my own sources of news and no features that are catered to those with impaired vision.

There are also no videos and few images to enhance the experience for people. The usefulness of the content would be vastly improved if, along with this, they introduced interlinking and improved bookmarking in the app. There’s too much manual work involved on the part of the reader as it stands.

Summary

Overall, there’s a pleasant experience to be had in an app that is this easy to navigate. It’s not difficult to find what you want, but this benefit could be even better with things like more detailed bookmarking.

From a design perspective, it looks clean and lends itself to a positive brand experience, but not for those with a tablet or those using different parts of the website.

There have been a few disappointed customers who have expressed the same kinds of frustrations I experienced, so it would be no surprise to see the developers and designers rectifying that in future updates.

The management of my personal finances has been improved on the whole thanks to this app, but I think there’s still work to be done on the small things to allow it to appeal to audiences on a bigger scale.