Article

Udesh Jadnanansing
Udesh Jadnanansing 15 August 2017

How to use visual feedback for web design

Creating or enhancing your website can take a lot of time and effort, especially when you factor in user feedback. The process involves lots of emailing back and forth, revisions to pages, and meetings among designers and developers as well as various other teams within the company. Well, at least that’s how it used to be done.

Luckily, today there are various types of visual feedback tools on the market that enable web designers and developers to establish and optimise their websites.

For those of you who aren’t familiar, let’s start off by talking about what visual feedback actually is. Visual feedback, also known as usability feedback, is a method that allows the user to pinpoint particular page elements on a webpage that require improvement in some way. The strategy used to collect and analyse this feedback, however, varies depending on the goal of the user. For example, are you going to use it purely for web design or to better understand the online customer experience?

In this blog, we will look at how to use visual feedback for web design by addressing common issues businesses experience online.

The value of visual feedback

Surprisingly, there are still web development teams out that there that struggle to recognise the value of a visual feedback tool. The belief that your customers are going to go so far as to provide you with feedback without a tool in place is heavily misguided. It would probably look something like this: the visitor must first take a screenshot of the page, open it in Paint, mark it up, save the marked up image on their desktop, and send it to your business by email with an explanation of what they see. We all know that just isn’t going to happen…

Mopinion: How to use visual feedback for web design - Highlight option on website

Using a proper visual feedback tool, your digital team can facilitate this entire process for your online visitors as well as for you and your team. From collecting this feedback using feedback forms and screenshot tools to analysing it in dashboards, sharing with colleagues and taking action, it will save you lots of time and confusion. The presence alone of these types of tools is also an incentive for your clients and/or team members to provide feedback the moment they spot an issue.



Let’s take a closer look and see if you can identify with these common issues:

Issue 1: No centralised location for website notes and markups

Spreadsheets here, emails there and a menacing pile of sticky notes in the corner. This chaotic scenario is probably a familiar one for many web designers out there. So how on earth do you keep track of it all? Often times there is someone who collects and documents all current issues on the website, puts them into an email and sends them on to whoever is responsible for fixing those issues. Tedious right? Plus this can be a very time consuming process and can also result in delayed improvements to the website and/or the launch if you’re in the pre-launch phase.

Mopinion: How to use visual feedback for web design - Post Its

Visual feedback tools enable you to pinpoint and annotate website issues right away using features such as sticky notes, highlighter features and screenshots. Many of these tools also allow you to compile and analyse all of your feedback in a project dashboard. These intuitive dashboards not only make it possible for your whole team to view the data, but users can also easily filter on particular feedback items and create reports using this software.

Issue 2: Difficulty delegating tasks and communicating with team members

Another shared issue among web developers is the lack of adequate communication between team members throughout the process. If you do not have any sort of tool in place, it’s like that your communications are carried out via email or in spreadsheet notes, which means that when you need to locate a particular item, you need to do some ‘detective work’ – e.g. searching through previous email threads or scanning various spreadsheets.

Mopinion: How to use visual feedback for web design - Email

With a visual feedback tool, the communication process is simplified. You can utilise easy-to-use search queries to locate bug reports or other particular feedback items and prioritise and assign tasks to your team members. Once an item has been updated, users can change the status so as to keep fellow team members up-to-date regarding the item they’re working on.

Issue 3: Delayed responses due to lack of real-time feedback

As previously mentioned, a more traditional way of collecting this visual feedback would be to compile all notes and comments and send them to a team member all at once. But by gathering this data and dealing with it later, you’re already putting yourself behind in your project.

Mopinion: How to use visual feedback for web design - Delayed response

Real-time data collection has recently become an integral part of most digital tools today. This especially holds true in terms of collaboration with team members as well as catering to clients. Real-time responses provide for instant interactions and can improve and speed up your workflows. For example, say you want to add a comment instructing a team member to update a particular image on the homepage of your website. With a visual feedback tool such as PageProofer, you can markup the page with a note and have that sent directly to the team member who is responsible for handling that request.

Issue 4: Identifying and determining the origin of a bug

We’ve all been there. You’ve got a list of bug reports in front of you waiting for to be fixed. But what do you do when it turns out recreating the bug yourself is even more challenging that resolving it? Sure, you can play around with it a little and ultimately you will find a solution, but it’s not always efficient to operate based on guesswork. That is why it’s important to have more details behind this feedback; details that will put you on the right track.

Mopinion: How to use visual feedback for web design - Bug report

With visual feedback, users can take screenshots or highlight where the bug is and simultaneously capture metadata such as browser type, OS, window size, screen size, etc. In other words, the origin of the bug – so that you can fix it. But sometimes even that is not enough.

The options are endless with visual feedback

I hope this article has clearly demonstrated the value of visual feedback in web design. As you can see there are various ways in which this type of feedback can accelerate and optimise the design process for web designers and there are also various tools to choose from. But did you know that it can be used for other online processes as well?

There are some visual feedback tools out there, such as my company Mopinion, that allow users to work with visual feedback in a way that provides deep insights into the online customer experience, especially when visitor volumes and the complexity of a website increase. 

Please login or register to add a comment.

Contribute Now!

Loving our articles? Do you have an insightful post that you want to shout about? Well, you've come to the right place! We are always looking for fresh Doughnuts to be a part of our community.

Popular Articles

See all
Digital Marketing Vs. Traditional Marketing: Which One Is Better?

Digital Marketing Vs. Traditional Marketing: Which One Is Better?

What's the difference between digital marketing and traditional marketing, and why does it matter? The answers may surprise you.

Julie Cave
Julie Cave 14 July 2016
Read more
Infographic - The Best Times and Days to Post to Social Media

Infographic - The Best Times and Days to Post to Social Media

With the social media landscape changing literally every single day, it's become a full-time job for social media managers to merely stay up-to-date on emerging and shifting trends and best practices. It's tedious, time-consuming, detail-oriented, and, quite frankly, a bit of a headache. But thanks to this new infographic, some guessing can be taken out of social media management.

Will Price
Will Price 21 September 2017
Read more
Customer Journey Mapping: A Real-Life Approach to Your Digital Marketing Strategy

Customer Journey Mapping: A Real-Life Approach to Your Digital Marketing Strategy

As financial services and insurance (FSI) companies strive to deliver the seamless multi-channel customer experience, the traditional marketing model has been radically reimagined. Innovative institutions are showing how cross-functional teams focusing on the customer journey can work to develop a single view of the customer – an approach that can bring tangible rewards. Yet research shows that large institutions still have some way to go in maximising the return on their investment in this area.

Aoife McIlraith
Aoife McIlraith 18 September 2017
Read more
4 Important Digital Marketing Channels You Should Know About

4 Important Digital Marketing Channels You Should Know About

It goes without saying that a company can't do without digital marketing in today's world.

Digital Doughnut Contributor
Digital Doughnut Contributor 5 November 2014
Read more
10 Marketing Lessons From Apple [Infographic]

10 Marketing Lessons From Apple [Infographic]

The 10-year-old kid, selling ice cold fresh lemonade on the street corner in your local neighbourhood had it right. He or she may not have realized it but the simple marketing strategy that they accidentally and innocently came up with works perfectly on the people strolling by on their daily walk.

Ellie Summers
Ellie Summers 19 September 2017
Read more