Measuring the Mobile Experience The Analytics of Handheld UX

PRESENTED BY

KEN TABOR

@KenTabor

bit.ly/KenMobileAnalytics

What is Analytics?

Classic Style Page Hits

Visitor Counts

13,191!

Classic Analytics is Obsolete for Modern Apps

Especially Single Page Apps

PageCount = 1

Better to track events as people interact with your UI

Analytics.event('Flight', 'Add');

Analytics.event('Hotel', 'Edit');

Analytics.event('Trip', 'Share');

Measuring the User’s Experience

Who on your team benefits from Analytics?

Everyone!

Actionable analytics reports

Device brand and model Testers decide what

handhelds to purchase for compatibility assurance

Operating system and version number

Engineers decide when to support new system

features

Screen resolution Designers decide at what sizes they lay out UI and

create art assets

Everything Product Managers can

stop guessing at acceptance & engagement

I choose Google Analytics • An industry leader • Integrating isn’t overly

complex

You can choose from Kissmetrics, Piwik, Flurry,

MixPanel, leanplum, ChartBeat, Clicky, gaug.es,

and more…

Passive measurements

The following stats are from my personal blog

blog.katworksgames.com

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

iPhone iPhone iPhone iPhone iPhone

iPad iPad iPad iPad iPad

Nexus 7 Nexus 7 Nexus 5 Nexus 5 Nexus 5

Galaxy Nexus GT-I9300 Nexus 7 Nexus 7 Nexus 7

Nexus 4 Nexus 4 Nexus 4 Nexus 4 SM-G900A

Device Info

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

6.1.3 6.1.3 7.0.4 7.1.2 8.3

6.0.1 6.1.4 7.1 7.1.1 8.1.3

6.1.2 7 7.1.1 8.0.2 8.1.2

6.1 7.0.4 7.0.6 8.1 8.2

6.1.4 7.0.3 7.0.3 7.1 8.1.1

iOS Versions

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

4.2.2 4.1.2 4.4.2 4.4.4 4.4.2

4.2.1 4.2.2 4.3 4.4.2 4.4.4

4.1.1 4.3 4.1.2 4.1.2 5.0.2

4.1.2 4.0.4 4.2.2 4.3 5.1

4.0.4 4.03 4.2.1 4.2.2 5.0.1

Android Versions

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

768 x 1024 768 x 1024 768 x 1024 768 x 1024 360x640

320 x 568 320 x 568 320 x 568 320 x 568 768x1024

320 x 480 320 x 480 320 x 480 360 x 640 320x568

720 x 1280 360 x 640 360 x 640 320 x 480 375x667

800 x 1280 720 x 1280 360 x 592 360 x 592 414x736

Mobile Screen Resolution

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

United States United States United States United States United States

India India India India India

United Kingdom

United Kingdom

United Kingdom

United Kingdom

United Kingdom

Germany Germany Canada Germany Germany

Japan Canada Germany Canada Canada

Country

2013 1st Half

2013 2nd Half

2014 1st Half

2014 2nd Half

2015 1st Half

Desk top 92% Desk

top 94% Desk top 93% Desk

top 96% Desk top 95%

Phone 5% Phone 4% Phone 5% Phone 3% Phone 3%

Tablet 3% Tablet 2% Tablet 3% Tablet 1% Tablet 1%

Visitor Type

Default G/A dashboard is big data overload

Create a custom dashboard reporting your mobile stats

Get my mobile first dashboard

https://www.google.com/analytics/web/template?

uid=iLTPIL89SP-RVF-A59HhWA

Routinely produce charts and capture trends

What if you don’t have analytics results?

Enterprise? Sibling business unit!

Services Group? Open-minded client!

Indie? Your Community!

Active measurements

var AnalyticsFacade = (function() { return { onInit: function() { // SEE: docs for tracking code snippet },

event: function(category, action, label, value) { ga('send', 'event', category, action, label, value); } }})();

TS.analytics = AnalyticsFacade;

function initialize() { TS.analytics.onInit(); TS.analytics.event('App', 'Load');

appView = new TS.view.Application(); appView.render();}

TS.view.ProgramInfo = Backbone.View.extend({ events: { 'click': ‘onSelectChoice' },

onSelectChoice: function(event) { var parent = $(event.target.parentElement); var cid = parent.data('cid'); var userModel = this.collection.get(cid); TS.analytics.event('Program', 'Select', userModel.getServiceKey()); } });

github.com/KDawg/TStringJS www.TStringJS.com

HTML Page Link Tracking

$('a').click(function() { var $el = $(this); var data = $el.data() || {}; var eventCategory = data.eventcategory; var eventAction = data.eventaction; if (eventCategory && eventAction) { TS.analytics.event(eventCategory, eventAction); } });

<a href="#FAQ" data-eventcategory=“QuickAction" data-eventaction=“Faq”>Questions?</a>

Create a custom dashboard reporting feature-based

event tracking

What’s up with this guy? Who is Ken Tabor?

I’m a product engineer at Sabre building TripCase

Do we use analytics? Yes! Uber case study.

Need space? What is used least often?

Haven’t built the feature yet? Track a tap event anyway.

If a feature is underperforming invest

time & talent into it

That thing we deleted (the walkthrough)

#Coderlife

<script src="www.google-analytics.com/analytics.js"

type="text/javascript"></script>

developers.google.com/analytics/devguides/collection/analyticsjs

Web SDK

developers.google.com/analytics/devguides/collection/ios/v3 developers.google.com/analytics/devguides/collection/android/v4

Native app SDKs available for iOS and Android

github.com/danwilson/google-analytics-plugin cordova.apache.org

Hybrid App => JavaScript App + Cordova Library +

Plugin + [iOS, Android] SDK

POST www.google-analytics.com/collect

{payload data}

developers.google.com/analytics/devguides/collection/protocol/v1

RESTful API

Analytics got my 0s and 1s

What if you want to roll your own data science and

hand craft visualization?

Write your own dashboard using D3.JS, ChartJS,

threeJS, P5, CreateJS, SVG, or WebGL

Pour your data into Vertica, Hadoop w/Pig or Spark,

Excel, or Teradata

Google Data Query APIs and Tools

GET https://www.googleapis.com/analytics/v3/data/ga

{query params}

developers.google.com/analytics/devguides/reporting/core/v3

Core Reporting API

ga-dev-tools.appspot.com/query-explorer

Query Explorer

Random Dev Pro-tips

Google Analytics Debugger (Chrome Extension)

Separate your traffic dev vs cert vs prod

Different accounts Processing filters

Feed Your Brain

web-analytics.alltop.com coolinfographics.com blog.kissmetrics.com

blog.fitbit.com moz.com/blog

Takeaways

Get out of the lab to talk with people, let analytics

scale up your conversations

Data wins arguments, and ensure everyone

understands the debate

I no longer see numbers, I hear voices

Look for my book

bit.ly/KenMobileAnalyticsGet this Presentation

blog.katworksgames.comRead More From Me