The ultimate guide to Google Analytics for UX designers

Alice Emma Walker
UX Collective
Published in
13 min readMar 23, 2018

--

Google Analytics is an often overlooked tool for UXers.

Intro

This article is for user experience (UX) designers who want to improve conversion rates and usability of their website or product using Google Analytics.

Google Analytics is one of the best, free tools you can have for research. It is primarily for marketing research and has several different paid suites, but a free account is more than enough for UX research.

Conversion rates remain the top priority for any website. Being a UX researcher/designer, you have to be interested in knowing what users are doing on your website, where they are coming from, how long they get engaged, and the ways you can improve conversion.

Google Analytics will help you do almost everything I just mentioned. It collects your website usage data and help you see the result in easy to digest visual manner.

If you would like to see the Google Analytics in action and follow the steps mentioned in the article, you can use the demo Google Analytics account. Filter the date range Mar, 01, 2018 to Mar, 07, 2018. It will help you match all the snapshots given in this article. Who doesn’t like a follow along? 🤓

01. Setup and basics

02. Getting started with Pageview tracking

03. Traffic analysis

04. Behaviour analysis

05. Goal creation and analysis

06. How to create goals and funnels

07. How to analyise the goal report

08. Funnel creation and analysis

09. How to create funnels

10. How to analyse the goal funnel report

11. Events

12. Events report

13. Timing and conversion

14. How to track user timing events

15. Conversion

Setup and basics

Setting up Google Analytics is super simple, it’s as easy as putting a snippet (a few lines of code) into your website. You will get a tracking code upon signing up for an account, and it relays the information back to the Google Analytics dashboard.

Let’s take a quick look at the Google Analytics basics before we get into advanced topics. Head to the demo account. Click on the upper-left menu:

Your ‘Account’ with Google Analytics is the top level entity. You can setup and track up to 100 different projects(websites) in one account. Google analytics refers to each product/website as a “property”. If you want to track different behaviours in one website, you can split it up and define multiple properties. In the demo account, we only have one property called Google Merchandising:

Let’s assume that you own abc.co and you have two sections. The first section is your public site (like landing page, lead capture form) while on the other section you only allow authorized users. You should always use two different properties for these scenarios. It will help you get accurate analytics outputs.

Getting started with Pageview tracking

Pageview tracks your visitors’ entry and exit pages, common journeys , and what browser and screen size they are using. Out of the box, these are pretty good insights for marketers. By default, it only tracks the journey between pages. Being a UXer, you may want to know the interactions that are happening on a page itself. Virtual pageview tracking is there to address this issue.

For example, you have an eCommerce website, and you want to track different click events like how many visitors are interacting with sliders, top picks, trending, and suggestions. Virtual Pageview will help you get it.

It is also helpful when you have a single-page website and you want to treat each section as a different page. You need to add following JavaScript code when user performs certain action on page:

ga(‘send’, ‘pageview’, ‘/trending’);

The more understandable code snippet is:

ga(‘send’, { ‘hitType’: ‘pageview’, ‘page’: ‘/trending’, ‘title’: ‘Trending items clicked’ });

Here is an informative article on Virtual Pageviews and tag manager. It’s less than a 5 minute read and definitely worth it.

Traffic analysis

Two primary objectives get addressed here:

1. “Content strategy”

2. “Traffic channels and conversion”

You can track which channels are driving the traffic, how they are helping you with your conversion goal, and how the user coming from those channels behave on your website.

For a B2B websites, the traffic coming from LinkedIn is usually more relevant than Facebook and converts more sales. Facebook would refer a larger number of visitor compared to LinkedIn, but the quality of visitors and conversion rate would be much lower.

Let’s view the traffic analysis report:

  1. You need to open your/demo Google Analytics account.
  2. Go to Conversion > Goals > Overview
  3. Select Source / Medium
  4. Select View full report

You should be able to see a full report were you can track the traffic source/medium, visitor acquisitions (users, new session, total sessions), user behavior (engagement and bounce rate), and conversion.

You can filter the report for specific traffic source if you want to get deeper insights about specific traffic channel, user behaviour, and conversions.

Also, you can filter the report for specific traffic channels and specific conversion goals. The report will show you deep insights of user engagement, bounce rate, and conversion for that particular traffic source and goal.

Behaviour analysis

This report helps you understand the user behaviour on your website and identify any pain points.

The report helps you understand:

  • How users land on different part of your website.
  • How they behave on your website at particular points of their journey.
  • What they do before and after landing on a page.
  • The sequence of different interactions.
  • Unnecessary steps they are taking by returning to previous pages for any reason.
  • Identify the scenarios which are failing for most users. Such as common page journeys causing high bounce/exits on your website.

Let’s get into the behaviour report:

Go to Analytics > Behaviour > Behaviour Flow.

If you are using Google Analytics test account, make sure you picked the “Automatically grouped pages” options under the Behaviour flow title.

Behaviour Report

The report shows the user interactions from landing page to deeper, multiple page interactions.

You can highlight traffic from a particular page and visualise the forward traffic and user interactions.

To get this report, you need to click on the page and select “Highlight traffic from here”. Here is how the report looks:

Highlight traffic from here

You may want to focus on just a single page and the forward journey happening from that page. In that case, you can use the “Explore traffic from here” option.

This analysis comes handy when you have a page with visitors deeper in your sales funnel and you discover high bounce rate. Implementing that page as start and analysing traffic and interaction forward will help you identify the issue.

Explore traffic through here — note that the pages above with a big red bar will need your attention! To exit this page, click the “back” button on your browser.

Goal creation and analysis

Tracking page views and visitors does not directly tell you how your website is helping your business. On the flip side, you cannot determine what exactly preventing them from fulfilling your business goals.

You’ve probably heard the term “sales funnel” before. Funnels are steps that your visitors take to reach your defined goals on your website. They help you identify the friction your users are facing in completing a specific goal.

You can have a set of specific goals like lead capture, checkout items, newsletter signups, eBook downloads, trial signups, account creation etc.

Google Analytics provides four ways to track different goals. They are: URLs, Time, Page/visit, and Events. They collectively are capable of covering all the major business goals. You can set up different goals for the same website. Goal creation can be done from Google Analytics admin section.

When should you create a goal for your website? You may want to track the account creation conversion from your visitors. Setting up “Account Creation” goal will help.

How to create goals and funnels

How to access Goals:

  1. Go to Admin from the left navigation panel
  2. Hit Goals under the third column View
  3. Hit Add Goal to add a new goal.

How to create a goal:

Goal creation workflow

Goal creation is a three step process. You’ll get templates to create goals. It covers all the major goals you may want to setup with your website. There is a custom option for advanced Google Analytics users.

Step 01 — Goal setup:

Choose the option based on your requirement. You get different options in the template like place an order, create an account, contact, get call back, media play, signup, download etc.

Step 02 — Goal description:

You need to provide the Goal name and type. Including a type helps Google Analytics decide when to convert visits in the completed goal.

Step 03 — Goal details:

You need to specify the destination URL (exclude your domain name). It helps Google Analytics determine the goal completion.

How to analyse the Goal report

Goal flow report

Here is the direct link to the GA demo account Goal flow report.

The Goal Flow report lets you visualize the conversions much the same way as the Behaviour Flow but for a specific goal set.

It helps you visualise how users are jumping between defined goal pages and how they are leaving your conversion funnel.

In the report above, a conversion means users are coming to the cart page from various sources, checking out with the items in the cart, and actually paying. As we can see, the cart page has an almost 70% bounce ratio.

In such cases, having a funnel setup for the cart page would help you narrow down your user-friction research and come up with better UX strategy.

Funnel creation and analysis

Funnels are the steps your visitors take to complete the specific goal. Google Analytics allows you create a maximum 20-step funnel for every goal.

Each funnel step shows the actual page visit or a virtual page visit. You can identify the friction in your goal that prevents your visitor from completing the goal.

You should create funnel step for each scenario from where users can abandon the session. For the example above, I would make a funnel step for the cart, billing and shipping, payment, and review.

How to create funnels

As I mentioned before, you create a funnel inside your goals. to create a new funnel you need to either open an existing goal or create a new one.

Hit the Goal Details where you will see a switch named Funnel. It’s disable by default. Just press the button to activate it. Once you activate it you will see a box where you can enter the funnel step name and the actual/virtual page name.

You only need to provide the page address excluding your domain name for Screen/Page input box. For example, I wouldn’t type:

abc.com/cart/

I would only type:

/cart/

You can use “+ Add another step” button to add up to 20 steps for the funnel. Having a multi-step funnel, recording actual/virtual steps would be really good for the cart page with a 70% drop ratio that we saw in the previous section.

How to analyse the goal funnel report

Goal funnel report

Navigate to Conversions > Goals > Funnel Visualization to access the funnel visualization report. Here is the direct link to access the above demo Google Analytics funnel report.

You will see a goal selector dropdown at top and all the funnel steps you defined for the goal are presented in a nice visual with accurate statistics.

Remember the cart page with 70% drop ratio we saw in the earlier section? Let’s analyse that page’s funnel report.

As you can see in the funnel report, there are 1801 users entering the cart page but 1278 users are leaving the page without continuing. The sign in page seems to be a huge friction point and one of the reasons users are navigating away from cart page.

Allowing the user to checkout without an account would help address those drop issues and reduce the number of pages before the user can complete the purchase.

The report shows the entire user journey visually. Each step lets you see the back-and-forth page journey and the exit ratio.

If you need more detailed insights of what users are actually doing on the cart page before exiting or navigating away, you may consider using any proven heatmap solution.

Google Analytics provides heatmap analytics out of the box, but you need to install the chrome Page Analytics plugin. You can also check some other proven and popular heatmap services like Crazyegg and Hotjar.

Events

A good UX design includes well-defined on-page micro-interactions. I know what you’re thinking:

“Alice, you just used three hyphenated words in a row and it made you sound pretentious.”

I know, I know. Micro-interaction are tiny little events that don’t change the page, but still have a huge impact on user behavior. We don’t want to track them with Pageview because it will interfere with the behavior flow report.

You can not track those interactions with default page view tracking. As it would interfere in your behaviour flow report.

You want to track these small, yet powerful on-page interactions like interacting with product filter buttons, using radio buttons, hiding a specific items on page and so on.

Google Analytics provides a way to track those interactions call Events. The way to record events is with a specific JavaScript code snippet.

Syntax:

ga(‘send’, ‘event’, ‘category’, ‘action’, ‘label’, ‘value’)

The first two parameters are fairly self-explanatory, we are telling Google Analytics to send and log the event.

Category: It can by any text value. It helps you group together various events with a meaningful name.

Action: It can be any text value that precisely defines what the user does.

Label: Optional, it can be any text value. It helps you track additional data.

Value: Optional, it can be any numeric value. It helps you track additional numeric data in custom reports.

Example:

ga(‘send’, ‘event’, ‘Category’, ‘Menu click’, ‘Menu item title’, 100);

Events report

You can access all the event related reports under Behaviour > Events. If you prefer layout of the user behaviour flow report you can choose the Events > Event Flow report.

Event Flow report

It helps you visualize the actions, number of hits for each action, drop offs, and page journey in a single report. Here is the direct link to event flow report on demo Google Analytics account.

If you prefer looking at all event actions in a pure list, hit Events > Overview and choose event action like shown in the image below.

Event Action list — Direct demo GA link

Timing and conversion

Time analysis helps you understand if users are spending the amount of time you wanted on each page. It also helps you measure whether or not users are able to complete a task in desired time frame.

Page timing report | Direct link to demo GA page timing report.

Time analysis help you understand if users are reaching to your desired website goal, how much time a desired action or operation takes, what parts of your website keep your users waiting, and the interactions which are confusing and taking more time to perform.

You can track the page timing out of the box, but you may need to set up user timing with custom JavaScript code like we did for events.

How to track user timing events

Here is the JavaScript code snippet:

Syntax:

ga(‘send’, ‘timing’, ‘category’, ‘name’, time, ‘label);

Category: It can by any text value. It helps you group together various timing events with a meaningful name.

Name: It can by any text value that precisely defines the timing event.

Time: The time user need to fulfil the goal. Time to be defined in milliseconds.

Label: Optional, it can be any text value. It helps you track additional text data in reports.

Example:

ga(‘send’, ‘timing’, ‘homepage-timing’, ’sample ebook reading’, 2000, ’book demo’);

You will be able to see the User Timing report under Behavior > Site Speed section. The demo Google Analytics account doesn’t have the user timing data, check this link if they start tracking it in future. Here is how the user timing report looks:

User Timing report

Conversion

Being a UX designer you might have created a user journey map for a targeted persona. A user journey map is a collection of interactions and actions a user makes to become a customer.

In real world scenario, your visitors tend to make multiple visits before converting into paying customers.

The Path Length report helps you track the actual business conversion value in context of number website visits.

Path Length report | Direct link to demo GA path length report.

To access the path length report, go to Conversions > Multi-Channel Funnels > Path Length. You can also filter the path length report to website specific report.

About me: I’m Alice Emma Walker, a User Experience Designer in Canada / Hong Kong / Australia. When I’m not UXing, I’m playing rugby or traveling. Check out my other articles or connect with me on LinkedIn.

--

--