PROJECTS
UI
THE COGNITIVE
LOAD TOOLBOX
RESOURCESCrazy Egg and Google Analytics are two terrific tools that
can be instrumental in helping UI designers declutter their
interface and, in turn, boost conversions. Let’s take a look at both
of these tools, as well as some alternatives.Google Analytics https://analytics.google.com/
Google Analytics, in a nutshell, tells us literally everything we’d
ever want to know about our audience, their behaviour and even
how we acquired them to begin with. Best of all, it’s free!
Suitable (not free) alternatives include Mixpanel (https://
mixpanel.com/) and Kissmetrics (https://www.kissmetricshq.com/).Crazy Egg https://www.crazyegg.com/
Crazy Egg is an analytics tool with special interest in scrollmaps,
heatmaps, clickmaps and also A/B testing. Once you’ve identified a
cause for concern using one of the map types, it’s crazy easy (pun
not intended) to test a newly designed version alongside the old
version to see which converts better.
Suitable alternatives include FullStory (https://www.fullstory.
com/) and Hotjar (https://www.hotjar.com/).Hotjar offers a few features that focus more on user feedback
instead of A/B testing, where users can complete surveys, respond
to polls or leave feedback on specific design elements.
FullStory can detect the difference between (for example) a rage
click, an error click or a click where the user thought it was a link
but wasn’t. In these cases we’re actually getting deeper insight
into what users are spending (or wasting) their time on.
Choosing a tool depends on your team’s skills (different skills
require different approaches), along with the temperament of the
user base.Crazy Egg heatmaps are used to see where users are focusing their attention –
warmer colours indicate high activityfilter: blur(5px); to the <html> element to blur the web
page. Next, take note of what does and doesn’t
demand your attention based on size, colour and
position. Is there anything that demands attention
but isn’t important (and vice-versa)? If that’s the
case, then your users are likely to be suffering from
cognitive overload unnecessarily!
Let’s check our heatmaps and scrollmaps to make
sure though.CREATE A TESTING ROADMAP
Sequentially check each element on the heatmap
(Crazy Egg has a walkthrough (https://www.crazyegg.
com/blog/understanding-using-heatmaps-studies/)
if you’ve never done that before), reaffirm its
importance and see if the level of importance
correlates with the attention that it’s demanding.
Hint: warmer colours on the heatmap indicate
attention. Next, make a decision on what to do
with each element, which will eventually build up a
testing roadmap.Starting off with what isn’t demanding attention
will help us decide what might be worth cutting out.
If something isn’t important and users aren’t looking
at it anyway, well then there’s an opportunity to
condense the layout, prioritise what’s important and
help users make decisions faster.A/B TESTING
Wait, that’s it?! Definitely not but it’s important to
take a data-driven approach and test each change
in a controlled environment. Let’s test the effects of
minimisation first, then we’ll dive back in.
We decided to use Crazy Egg for this process
because it also offers A/B testing and it’s as easy
as making a few visual changes in Crazy Egg and
deciding to send this B test to a certain subset of
users (https://help.crazyegg.com/article/122-building-
an-a-b-test).
It usually takes about 24 hours to see results for
the first time but if your website isn’t that busy“We tend to think new
features are more
important than they are,
either because they’re
new or we came up
with them”