First-click testing can help you make informed decisions at any stage of a web design or market research project. The key to getting useful data is to be clear why you need it, and exactly what it can help you with.
Gather evidence for the ‘why’ from things like:
Every task you set will answer variations on the following questions about your webpage, so keep these in mind as you’re figuring out what you want to achieve. The answers to these questions (your first-click test data) will help you make most user-focused decisions about your designs.
When you come to create a first-click test, keep the goal in mind: you want to know if people can correctly find the answer to your task with something on the screen presented.
If we are presenting images of webpages, we know that the first click they make in their journey to their eventual outcome will determine the likelihood of success: if the first click is correct then they are two, to three-times more likely to be successful than if their first choice was a misstep.
Some ideas for things to test include:
Generally, throughout this guide, you will have noticed that we have referred to ‘webpages’, when talking about the ‘stimulus’ that you are uploading and testing in your first click test. Most first click tests are website tests, but all the same principles apply, whatever the stimulus.
If you want the ability to segment your participants for in-depth analysis, you can choose to ask pre and post study questions. This can be really useful if you see a split in where people have clicked; it may be due to a specific difference in your audience which you may be able to identify through applying filters based upon questionnaire answers.
You can upload JPEG (jpg) or PNG files of any size or dimension. If you upload high-density ‘retina images’, they’ll be scaled down to fit a normal-sized screen. No other image types will be automatically resized to fit. You might want all your images to be consistent across the whole test. If so, resize them before you upload.
The ‘preview’ feature is your best friend when creating a first-click test. Once you’ve uploaded your images and added tasks, preview the test on the devices your participants will use to complete the test. For example, if you are asking participants to complete the activity on a mobile device, preview your study on a mobile device.
For each task, click the ‘Set correct areas’ button.
On the image, draw the hotspots that correspond to the ‘correct areas’. You can name the areas, so that when you review the results, the scores will be reported against each named area.
What to mark as ‘correct’ and when
As with Treejack, it is possible to nominate your ‘correct’ answers after the results have come in. Sometimes you may feel you have to do that as you will realize that you have missed off a correct answer, for example, leaving off a footer link that corresponds to a valid correct click. We generally caution against doing this as you are literally falling into Texas Sharpshooter fallacy: shoot the barn door and then draw the target on afterwards to show you always intended to make that bullet grouping. There will be occasions when you’ll see clicks just outside the rectangle you have drawn; again the temptation is to stretch the rectangle to include these. Control your impulses!
Remember what you are really trying to do with a first click test: work out whether the labels and their locations are triggering the correct response from users when they are presented with a task. Are users clicking the thing you want them to click? Or are you seeing users finding sneaky ‘backdoor’ ways of answering the task? Or perhaps those off-target clicks are telling you your click target is not clear?
With a click test, you are not trying to get to a perfect score, you are trying to make navigation as painless as possible for the majority of users, so maybe including that ‘correct’ footer link in your results is not really what you should be doing. Instead focus on how to get users to click on the intended link through better, clearer design.
As noted, you can click test anything. We have click tested wireframes with no text at all, simply to understand from the page ‘shape’ where people expect things to be. Strangely revealing.
It’s totally acceptable to click test ‘bits’ of a site too; we’ve click tested just the mega-menus, with no page content and we’ve chopped the middle out of pages so that the top of the page and the footer can be seen without scrolling.
You can leave things out of page designs when testing, but beware then reporting ‘90% of people clicked in the right area’, as you are not acknowledging what might happen in a real world situation. Again, remember the purpose of a click test is not to get a perfect score, it is to learn what you can improve in your designs to better support users’ navigation choices.
Here are some examples of things you could test:
The screen and remote control for a video-streaming service:
An About Us page from a company:
A sketched wireframe for a website design:
A fancier version of the same wireframe:
Wireframe of a website at mobile resolution:
