The Analytics of Handheld UXEXPERIENCE

MEASURING THE MOBILE

KEN TABOR at SXSW 2016

Use analytics to discover how your

users are interacting with your native and web apps.

@KENTABOR

BUILD!

MEASURE|LEARN#

@KENTABOR

Activate the product development virtuous cycle to empower you.

@KENTABOR

WHAT?

Analytics is the discovery and communication of meaningful patterns in data. Analytics often favors data visualization to communicate insight.

en.wikipedia.org/wiki/Analytics

@KENTABOR

@KENTABOR

WHY?

how people are using your software.

No Analytics?NO IDEA

@KENTABOR

STARTprojects validating hypotheses with dashboards.

projects with data-driven decisions.

FINISH@KENTABOR

Foster a transparent team with shared understanding.

Build deep context to inform everyone’s choices.

@KENTABOR

Traditional analytics measuring page hits and visitor counts is nearly obsolete for modern, single-page, webapps.

VANITY METRICS

@KENTABOR

Pages are becoming programs.

@KENTABOR

@KENTABOR

Pages are becoming programs.

HOW TO DO

MODERN METRICS

?@KENTABOR

track events as people interact with components on your app’s UI.

ACTIVELY

@KENTABOR

ACTIVE MEASUREMENTevent('ingredient','select','coffee', 3);

event('Flight','Add','BigAir', 1024);

event('User','Language','spanish');

@KENTABOR

event('ingredient','select','coffee', 3);

category(string)

action(string)

detail(string)

detail(number)

ACTIVE MEASUREMENT

@KENTABOR

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

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

TS.analytics = AnalyticsFacade;

Tuck analytics into a module. Hide complexity. Future-proof

against platform changes.

@KENTABOR

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

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

Your app sets up analytics from the start.

@KENTABOR

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); var serviceName = userModel.getServiceKey(); TS.analytics.event('Program', 'Select', serviceName); } });

@KENTABOR

Track an event in the DOM element click handler of your app’s views.

Create custom dashboards reporting your UX events.

@KENTABOR

@KENTABOR

Idea Prototype Usability

Development Ship It

ANALYTICS@KENTABOR

Who on your team benefits from Analytics?

EVERYONE!@KENTABOR

TESTERSDecide what devices to use for

quality assurance.

@KENTABOR

ENGINEERSDecide when to support new

system features.

@KENTABOR

DESIGNERSDecide at what screen sizes they lay

out UI and create art assets.

@KENTABOR

PRODUCT MANAGERS

Stop guessing at consumer acceptance & engagement.

@KENTABOR

Device model, O/S version, screen resolution, geo-location, browser

type, visitor behavior. Comes “free” from the analytics system.

PASSIVE MEASUREMENT

@KENTABOR

The default dashboards can feel like big data overload.

@KENTABOR

@KENTABOR

Create custom dashboards reporting the passive data.

@KENTABOR

@KENTABOR

Get my mobile first dashboard.

www.google.com/analytics/web/template?uid=iLTPIL89SP-RVF-A59HhWA

@KENTABOR

#CODERLIFE

@KENTABOR

#CODERLIFE

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

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

@KENTABOR

WEB SDK

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

Native app SDKs available for

iOS & Android

@KENTABOR

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

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

Hybrid App JavaScript App + Cordova Lib +

Plugin + [iOS, Android] SDKgithub.com/danwilson/google-analytics-plugin

cordova.apache.org

@KENTABOR

POST www.google-analytics.com/collect

{payload data}

RESTful API

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

@KENTABOR

Google Tag Manager let’s anybody define track events in a dashboard UI after your tech team adds a snippet.

Missing Coders?@KENTABOR

Takeaways

@KENTABOR

Report outcomes. Invest time & talent into underperforming features.

IMPROVE OR REMOVE

@KENTABOR

Talk with people. Let analytics increase your reach as you grow.

SCALE UP &LISTEN

@KENTABOR

Ensure everyone understands the debate and speaks to the numbers.

DATA WINS ARGUMENTS

@KENTABOR

@KenTabor

www.katworksgames.com

speaking@katworksgames.com

My projects, blog, slides, and more

Tweets on code, UX, and leadership

Reach out to me with an email

I wrote this book for designers who have accidentally (on purpose) become developers.

They are talented and tenacious, but not well equipped to code, test, and debug responsive and mobile-first sites.

An entire history of tools exists stuck in the domain of software engineers. My book collects them into a single box of awesome within your reach.

@KENTABOR

Get My Book