MOBILE RIGHT NOW: What A Real Customer’s Mobile Experience Looks Like

MOBILE RIGHT NOW
What A Real Customer’s Mobile Experience Looks Like
@yottaa @dougsillars @marlinmobile
W e b i n a r
www.yottaa.com | developer.att.com/ARO | www.marlinmobile.com

Your Presenters
Ariel Weil
VP of Product Marketing & Management, Yottaa
@aweil
Doug Sillars
Principal Architect, ARO Outreach team at AT&T
@dougsillars
Adrian Mendoza
Co-founder, Marlin Mobile
@marlinUX
www.yottaa.com | developer.att.com/ARO | www.marlinmobile.com 2

Agenda
• Delivery Challenges
• Mobile is complex
• A Customer Experience
• Build a Mobile Profile
• Location
• Device Performance
• Network Connectivity
• Q&A
www.yottaa.com | developer.att.com/ARO | www.marlinmobile.com @yottaa @dougsillars @marlinmobile 3

End User Pain: Digital Experience Delivery Challenges
return to
the site 64% 29%
@yottaa @dougsillars @marlinmobile 4
OF SMARTPHONE USERS
EXPECT PAGES TO LOAD IN
UNDER 4s
Expect mobile
to be faster
than desktop 85% Will go to
a competitor
to transact 42% Will never
According to Forrester research,
Mobile is a part of virtually every online txn
End Users are still frustrated by a sub-par
mobile experience
Online and mobile end user experience challenges impact conversions and revenue

There are a few solutions claiming to solve this problem

What is a Digital Experience anyway?
The end user experience with a digital brand or product
One thing is consistent…
Site responsiveness is key to
maximizing user experience
across form factors

The problems are the similar for desktop and
mobile applications
…but despite the rapid pace of innovation, the
current state of mobile technology creates very
different problems.

Lets be honest, Mobile is complex…
Every part of your mobile experience is in motion
Your Mobile Experience

and its growing.
.7 Billion

Getting Customer Usage

Who are Engaged Customers?
Buy MORE!
More likely to buy!

How to Get Customers Engaged?
48% customers abandon if dissatisfied with
the performance of a mobile app

Customer Expectations - Loading

Customer Expectations - Apps
www.yottaa.com | developer.att.com/ARO | www.marlinmobile.com @yottaa @dougsillars @marlinmobile

Building a mobile profile
Location
of
Your Customer
Devices
Network
Connectivi
ty
Apps

What You Can’t Control
Location, Location, Location,

Speeds by Location
Top 5 Fastest Mobile locations
• Monticello, Kentucky - AT&T Mobility
• Ceres, California - AT&T Mobility
• Katy, Texas - T-Mobile
• Sachse, Texas - T-Mobile
• Livermore, California - T-Mobile
Why is Kentucky or California fast? Locations are now tied to
a carriers load in that area as well as infrastructure.

Mobile devices are more then just phones
Phones & Tablets

Devices by Screen Size
5 Most Common
Phone screen sizes
• 480 x 800
• 320 x 480
• 540 x 960
• 580 x 854
• 240 x 320
5 Most Common
Tablet screen sizes
• 720 x 1280
• 1080 x 1920
• 720 x 1184
• 800 x 1280
• 1080 x 1776
The iPhone 4s (640 x 960)
and 5 (640 x 1136) ranked
13th & 14th
The iPad (768 x 1024)
ranked 6th, while iPad
retina tablets (1536 x
2048) ranked 5th

Devices by Performance
Top 5 Fastest Android
Devices
• LG Optimus G
• Acer Iconia
• Google Nexus 10
• Samsung Galaxy S III
• Sony Ericsson Xperia
Mini Pro
Top 5 fastest iOS
Devices
• iPhone 5
• iPad 3
• iPad mini
• iPhone 4
• iPhone 4s

Responsive Web Design
Desktop Tablet Phone
• One URL/One codebase
• Media Queries allow code to adapt for different screen sizes.
• Code tells browser how to build page based on screen width.
• UI is improved on all devices. Next Step focus on serving UI by
different devices.

Optimizing the mobile web
3 Tips you can use now!

Tip 1: Mobile Redirects are problems
The user is redirected through 3
URLs for the first 4 seconds
…so that after 10 seconds the
browser still doesn’t have enough
data to paint a screen for the user

Tip 2: Re-ordering page components
Site analytics are loading before
content...so the business will
clearly see bounce and abandon
metrics.
This causes first paint to be
delayed to > 15 seconds.

Tip 3: Resource dependencies further delay page load
Previously loaded tags are
dependent upon other elements
including CSS to fully load
This causes visually complete to be
delayed to > 25 seconds.

So what about Mobile networks?
What speed are your users on

Network connectivity in the US

Network Conditions Vary
2.5G: 3G: 4G:
UMTS HSPA+ LTE
GPRS EDGE
Throughput
100-400 Kbit/S 0.5 – 5Mbit/s 1-50 Mbit/s
Last Mile
Latency:
300-1000ms 100-500 ms <100ms

Visualizing the difference
Cable
LTE
3G
2 seconds
2 seconds
26 seconds?!

International Networks
American developers work in a bubble of the
fastest networks & cutting-edge handsets
30

Next Billion People Going Online
• Few PCs/landline. Mostly mobile.
• Slow networks
– Old technology
– Low bandwidth
– High congestion
• Small data plans - can get used up quickly
• Power issues
– Radio hogging = battery drain
– HUGE if you can only charge phone 1x a week

Network connectivity in the world

Should I Bother with 2G Users?
Success in developing world a primary factor

Network Conditions Vary
Is your app ready able
to adapt and change
based on the network
conditions?
GPRS EDGE
UMTS HSPA+ LTE
Your App needs to be Flexibly Network Aware

Flexibly Network Aware Apps
• Application is aware of network conditions
and displays/modifies content flexibly
– Consider:
• Bandwidth
• Latency
• Roaming
• Like RWD, app changes display/request
characteristics in a flexible manner

Problem Summary:
Build a profile of your unique customers
 Gather mobile centric data
– Use Analytics (flurry, crashlytics, google analytics)
 Create a mobile profile
– Are they on 3G or 4G?
– Do they have good or bad connectivity? (latency)
– Where are they located?
– What devices are they one? (tablets, phones)
 Use this as a starting point to optimize your
apps and websites

Problem Summary:
Build Flexibly Network Aware Apps
 Apps that respond to network conditions
 For Slow networks
– Deliver content appropriately
– Shrink image sizes
– Reduce video quality
• Defer video?
 In high latency
– Prefetch more content (to eliminate future lags)
 Roaming
– Data is likely high cost: consider reducing content

 Promise: deliver a responsive mobile
experience without additional infrastructure
 Realities:
– Context is key: Desktop cannot simply be
repurposed for mobile
– Order is important: Organize page elements for
immediate engagement
– Know the critical rendering path: Optimize order
of elements to eliminate experience gaps
38
Problem Summary:
Context and load order are critical

AT&T Offers Mobile App Optimization Tools
 AT&T Network Attenuator
– Free tool with signed SDK agreement
– Test various Network Conditions
– http://Developer.att.com/Attenuator
 AT&T ARO
– Free Open Source
– Test Network Performance
http://Developer.att.com/ARO
 Questions? Contact
– Doug.Sillars@att.com @dougsillars

Yottaa Optimizes End User Experiences
Web server
Real time, automated optimizations drive online and mobile engagement
INSIGHT
PERFORMANCE
ENGAGEMENT
InstantONTM AppSequencingTM
ImpactAnalyticsTM
Context Intelligence Architecture
Impact Analytics
Machine Learning
Rule Engine
Global Elastic Network: 70+ POPs, Auto-Scale, Secure
Dramatically improve performance and engagement to drive business impact

Marlin Mobile Offers a Free Mobile App SDK
Use it to create a mobile profile for your mobile app users and customers
 Easy to install (iOS & Android)
– Capture and View
• Signals strength
• Data technology (3G,4G)
• Location
• Apps running and installed
• Battery state and level
Sign up for our free SDK (BETA)
www.marlinmetrics.com/sdk

Thank You

MOBILE RIGHT NOW: What A Real Customer’s Mobile Experience Looks Like

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to MOBILE RIGHT NOW: What A Real Customer’s Mobile Experience Looks Like

Similar to MOBILE RIGHT NOW: What A Real Customer’s Mobile Experience Looks Like (20)

Recently uploaded

Recently uploaded (20)

MOBILE RIGHT NOW: What A Real Customer’s Mobile Experience Looks Like

Editor's Notes