Date post: | 19-Nov-2014 |
Category: |
Technology |
Upload: | precedent |
View: | 177 times |
Download: | 1 times |
31 July 2013
Putting Mobile First
Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
” “ The average smartphone user reaches to their phone 150 times per DAY!
-Mary Meeker at #D11
A Changing World – The Mobile Take-Over
2013
Asia Pacific Europe North America Middle East and Africa Latin America
A Changing World – Users of Mobile by Region 2012 - 2017
2012
Source: Portio Research
2017
A Changing World – Operating System by Region
Europe Australia
June 2012 to May 2013
Asia
iOS Android SymbianOS Other
Source: Stat Counter – Global Stat Counter - http://gs.statcounter.com/
Mobile Marketing Strategy for Australia
A Changing World – Smartphone Operating System in Australia
2011 - 2012 Australia
iOS Android Windows OS SymbianOS Other
Source: ACMA Communications report 2011–12
A Changing World – The Surge Towards Tablet G
loba
l Uni
ts S
hipp
ed (M
Ms)
Global PC (Desktop / Notebook) and Tablet Shipments by Quarter (Q1: 1995 - Q1: 2013)
Source: Katy Huberty, Ehud Gelblum, Morgan Stanley Research. Gartner. Data as of 4/13. Note: Notebook PCs include Net books
” “ 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?
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…
Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
Where is the Opportunity?
Take the time to understand your user’s needs, behaviour and context.
Opportunity Section
Where is the Opportunity? – Mobile User Scenarios
Are you doing enough? What could be done better?
Visualize goals and tasks: • Personas • Scenarios
Test assumptions: • Contextual inquiry • Focus groups and
interviews
Identify assumptions: • What do your users
need? • What do your users do?
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
Where is the Opportunity? - Mathew Algie - Ethical Coffee Campaign
Where is the Opportunity?
“How do we know that people are going to actually use it?”
Where is the Opportunity? – The art of persuasion
Three main factors to encourage behaviour
2. Ability “What resources are required?” “Do I have those resources?” “Is it worth it?”
3. Triggers “Should I act now?” “Can I act later?"
1. Motivation “How important is this outcome to me?” “Will this help me get to where I want to go next?”
Where is the Opportunity? – The Fogg Behaviour Model
Ability
Mot
ivat
ion Triggers
Succeed Here
Triggers Fail Here
High Motivation
Low Motivation
Hard To Do Easy To Do
Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
Design Considerations – Multi Screen Patterns
• Coherence
• Synchronisation
• Device shifting
• Complementarity
• Simultaneity
Coherence
Coherence - Example
Synchronisation
Synchronisation - Example
Device Shifting
Device Shifting - Example
Complementarity
Complementarity - Example
Simultaneity
Complementarity - Example
” “ 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
Design Considerations – Common Language
Design Considerations – Hit Areas
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!’
Design Considerations - Reach
Right hand
Easy
Average
Hard
Left hand
Easy
Average
Hard
Putting Mobile First
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
What Are My Options?
Mobi
Responsive
Hybrid Apps
Native Framework Web App
Feed Aggregators
The Optimum Approach - mobi
The Optimum Approach - mobi
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
The Optimum Approach - Responsive
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
” “ 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
The Optimum Approach – Hybrid Apps
The Optimum Approach – Example
The Optimum Approach - Frameworks
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.
The Optimum Approach – Native Apps
• The Optimum Approach – Native Apps
• The Optimum Approach – iButterfly
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
The Optimum Approach - Feeds
Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
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
Making It Happen – Content: Mobile First
Making It Happen – Content: Adapting content
” “ What about performance? Won’t a lot of images slow down the mobile experience?
” “ Users are sympathetic to poor network coverage and adjust their expectations when WIFI isn’t available.
” “ Users are not sympathetic to poor network coverage and adjust their expectations when WIFI isn’t available.
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
mobitest.akamai.com
” “ The more channels I run, the more resource I’ll need, right?
Making It Happen – Resource and Process
Making It Happen – Resource and Process
Optimising Mobile
• A Changing World
• Where is the Opportunity?
• Design Considerations
• The Optimum Approach
• Making It Happen
• Considering The Future
” “ 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)
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.”
Considering the future - Wearable tech