2. Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
3. ”
“The average smartphone user reaches to their
phone 150 times per DAY!
-Mary Meeker at #D11
A Changing World – The Mobile Take-Over
4.
5.
6.
7. 2013
Asia Pacific Europe North America Middle East and Africa Latin America
A Changing World – Users of Mobile by Region 2012 - 2017
2012
Source:PortioResearch
2017
8. A Changing World – Operating System by Region
EuropeAustralia
June 2012 to May 2013
Asia
iOS Android SymbianOS Other
Source: StatCounter–GlobalStatCounter-http://gs.statcounter.com/
10. A Changing World – Smartphone Operating System in Australia
2011 - 2012
Australia
iOS Android Windows OS SymbianOS Other
Source:ACMA Communicationsreport2011–12
11. A Changing World – The Surge Towards Tablet
GlobalUnitsShipped(MMs)
Global PC (Desktop / Notebook) and Tablet Shipments by Quarter (Q1: 1995 - Q1: 2013)
Source:KatyHuberty,EhudGelblum,MorganStanleyResearch.Gartner.Dataasof4/13. Note:NotebookPCsincludeNetbooks
12. ”
“Australians are ahead in the mobile space.
What we’re seeing is retailers who haven’t
been part of the e-commerce space are
leapfrogging to having a mobile store first
instead of setting up an e-commerce site
Is Australia Already Ahead of the Curve?
13. So What?
• Loads of mobile devices
• Mostly using iOS
• However smartphone market is predominantly Android (not iOS)
• Tablet on the rise globally
• If you are not ahead of the curve look to the next…
14. Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
15. Where is the Opportunity?
Take the time to
understand your user’s
needs, behaviour and
context.
19. Where is the Opportunity? – Mobile User Scenarios
Areyoudoingenough?Whatcouldbedonebetter?
Visualize
goalsandtasks:
• Personas
• Scenarios
Test
assumptions:
• Contextualinquiry
• Focusgroupsand
interviews
Identify
assumptions:
• Whatdoyourusers
need?
• Whatdoyourusersdo?
20. Allanah’s Story
Alannah views video content from
students and alumni who studied some
of the units she is interested in
Alannah selects her preferences and
submits them
She receives a Facebook notification to
confirm her selection and that she can
update her timetable
That evening
Alannah updates
her timetable and
shares it with
some of her
friends
21.
22. Where is the Opportunity? - Mathew Algie - Ethical Coffee Campaign
23. Where is the Opportunity?
“How do we know that
people are going to
actually use it?”
24.
25. Where is the Opportunity? – The art of persuasion
Threemainfactorstoencouragebehaviour
2.Ability
“Whatresourcesare
required?”
“DoIhavethose
resources?”
“Isitworthit?”
3.Triggers
“ShouldIactnow?”
“CanIactlater?"
1.Motivation
“Howimportantisthis
outcometome?”
“Willthishelpmegetto
whereIwanttogonext?”
26. Where is the Opportunity? – The Fogg Behaviour Model
Ability
Motivation
Triggers
Succeed Here
Triggers
Fail Here
High
Motivation
Low
Motivation
Hard To Do Easy To Do
27.
28.
29. Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
41. ”
“Effective mobile designs not only account for
these one thumb/one eyeball experiences but
aim to optimize for them as well.
Luke Wroblewski – Mobile First
44. Design Considerations - Images
Recognition
Putting a picture to either a person or a
place:
‘Meet Bob the new council member
for your area’
Or
‘Drop by the new office on Flinders
Lane’
Description
Where a specific item is better
described visually:
‘We will be rolling out new wheely
bins to replace our old ones, they
will look like this:’
Or
‘Our new Series 125fx is the fastest
widget on the market and comes in
orange!’
47. Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
48. What Are My Options?
Mobi
Responsive
Hybrid
Apps
Native
Framework
Web
App
Feed
Aggregators
51. The Optimum Approach - mobi
What it’s good for:
• Providing focus and clear
structure
• Deploying without impact on
main website
• Delivering quickly
• Wide reach working via browser
• Can be designed to understand
and respond to screen size or
orientation
Considerations:
• Careful consideration to
content impacting
performance.
• Keep the design simple and
effective
• You need to design for tablet
and phone to maximise
experience.
• Links to m. or mobi domain
name
53. The Optimum Approach - Responsive
What it’s good for:
• Reflows the same content
from the website
• Content is presented on all
devices and screen sizes.
• Architecture of the site
remaining the same
• Single update of content
Considerations:
• Cannot apply a different tone
of voice for mobile usage.
• Experience not built around
the user or context
• Requires to think in % and not
fixed width
• Supported screen size has to
be chosen
54. ”
“It's cheap but degrading to reuse content and
design across diverging media forms like
print vs. online or desktop vs. mobile.
Superior UX requires tight platform
integration.
Jakob Neilsen – 21st May 2012
58. The Optimum Approach - Frameworks
What it’s good for:
• Lets you develop once and
deploy many
• Cross device support widening
reach
• A balance between rich design
and reach
• Simplifying the interface whilst
enabling functionality
• Deployment via app stores
Considerations:
• Will not be a rich interface
• Restricted in functions
• Balance between features and
reach
• Typically uses HTML5 and
JavaScript.
63. The Optimum Approach - Native
What it’s good for:
• Provides a rich interface
• Uses the full phone feature set
• Designed around the user
• Optimal performance
• Provides joy of use
• Can differentiate your brand
Considerations:
• Needs to be developed for
each device type
• Designs typically can be shared
• Data is a key consideration for
unconnected use
65. Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
66. Making It Happen - Content
From the ground up
(mobile first):
• Custom approaches
• Considered context
• Specific content
From pre-existing
(elegant degradation):
• Desktop applied to mobile
• Stress / break points
• Reworked content
70. ”
“Users are sympathetic to poor network
coverage and adjust their expectations when
WIFI isn’t available.
71. ”
“Users are not sympathetic to poor network
coverage and adjust their expectations when
WIFI isn’t available.
72. Making It Happen – Data Integration – 4 Key points
1. Ensure your existing web API does not bundle unnecessary data
with requests for data
2. Expand your API to deal with short, quick requests and hook it
into your CMS solution as soon as possible
3. Front End Optimisation (FEO) is vital. Use mobile optimisation
and analytics tools to see where your delivery speeds can be
improved
4. Track user interaction in your app using an analytics tool
78. Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
79. ”
“If you want the Internet to be everywhere it
has to be visible nowhere. It has to be unseen,
unnoticed, undiscussed.
David St. Charles - Integrated Systems Inc. (Wired 1996)
80. Considering the future – Password fatigue
• “The FIDO Alliance, a consortium that includes PayPal, is pushing
an open-source system in which, for instance, websites would ask
smartphone users to identify themselves by placing their
fingertips on their touchscreens.”
• “In Washington, the US Patent and Trademark Office has recently
published several patent applications from Apple that envision
facial recognition and fingerprint scanning.”
