mobile - more than just an app
DESCRIPTION
Presentation by Johnny Schneider - ThoughtWorks Quarterly Technology Briefing, Sydney, AustraliaTRANSCRIPT
![Page 1: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/1.jpg)
Topic for the next few slides
‘Name of referenced work’, Author/source/URL, date.
![Page 2: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/2.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
Here’s what we’ll talk about:
We’ll take a brief look at changing technology and how that’s affected the way people behaveDiscuss how we can create better mobile productsWalk through some approaches to engineering better apps
![Page 3: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/3.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
![Page 4: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/4.jpg)
http://www.flickr.com/photos/avlxyz/308574017
US market and mobile trends are similar to Australia
We’re using local research wherever possible
First, a note about stats.
We’re both affluent nations, big love for gadgets and internet. Culturally and socioeconomically similar.
![Page 5: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/5.jpg)
http://www.nytimes.com/imagepages/2008/02/10/opinion/10op.graphic.ready.html
REFRIGERATOR
100%
80%
90%
60%
40%
20%
0
1900 1915 1930 1945 1960 1975 1990 2005
AIR-CONDITIONING
AUTOMOBILE
TELEPHONE
COLOR TV
INTERNET
ELECTRICITY
COMPUTER
MOBILE PHONE
Technology, people and time
If we look back over the last 100 years, we see only the most critical technologies reach saturation point (over 90%). And it takes a long time.
![Page 6: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/6.jpg)
http://www.nytimes.com/imagepages/2008/02/10/opinion/10op.graphic.ready.html
REFRIGERATOR
100%
80%
90%
60%
40%
20%
0
1900 1915 1930 1945 1960 1975 1990 2005
AIR-CONDITIONING
AUTOMOBILE
TELEPHONE
COLOR TV
INTERNET
ELECTRICITY
MOBILE PHONE
COMPUTER
Technology, people and time
Electricity, 50 yearsTelephone, 70 yearsAutomobile, 80 years
![Page 7: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/7.jpg)
http://www.nytimes.com/imagepages/2008/02/10/opinion/10op.graphic.ready.html
REFRIGERATOR
100%
80%
90%
60%
40%
20%
0
1900 1915 1930 1945 1960 1975 1990 2005
80 YEARS
50 YEARS
70 YEARS
AIR-CONDITIONING
AUTOMOBILE
TELEPHONE
COLOR TV
INTERNET
ELECTRICITY
MOBILE PHONE
COMPUTER
Technology, people and time
Electricity, 50 yearsTelephone, 70 yearsAutomobile, 80 years
![Page 8: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/8.jpg)
http://www.nytimes.com/imagepages/2008/02/10/opinion/10op.graphic.ready.html
REFRIGERATOR
100%
80%
90%
60%
40%
20%
0
1900 1915 1930 1945 1960 1975 1990 2005
30 YEARS
20 YEARS
AIR-CONDITIONING
AUTOMOBILE
TELEPHONE
COLOR TV
INTERNET
ELECTRICITY
80 YEARS
50 YEARS
70 YEARS
COMPUTER
MOBILE PHONE
Technology, people and time
Let’s look at Internet and Mobile phones. These have been much quicker. They’re both still relatively new.Internet on phone is even newer
These figures only report to 2005.
![Page 9: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/9.jpg)
Pew Research, 2012. http://pewinternet.org/Reports/2012/Digital-differences/Main-Report/Internet-adoption-over-time.aspx
0
20
40
60
80
‘95 ‘96 ‘97 ‘98 ‘99 ‘00 ‘00 ‘01 ‘02 ‘03 ‘04 ‘05 ‘06 ‘07 ‘08 ‘09 ‘10 ‘11
Internet adoption over time (percentage American adults)
US trend: Adult internet users.
![Page 10: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/10.jpg)
The Australian Online Consumer Landscape Report, Nielsen 2012.
0
20
40
60
80
‘95 ‘96 ‘97 ‘98 ‘99 ‘00 ‘00 ‘01 ‘02 ‘03 ‘04 ‘05 ‘06 ‘07 ‘08 ‘09 ‘10 ‘11
Internet adoption over time (percentage American adults)
82% of Australian adults online in 2012
It’s the same in Australia.
![Page 11: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/11.jpg)
Pew Research Center, 2012. http://pewinternet.org/Reports/2012/Digital-differences/Main-Report/The-power-of-mobile.aspx
0
15
30
45
60
75
90
Apr ‘06 Apr ‘08 Sep ‘09 Sep ‘10 Aug ‘11 Feb ‘12
Desktop PCLaptopMobile PhoneTablet
Adult gadget ownership over time
But how are people accessing the internet? Let’s take a look at device ownership.
Desktop in decline over last five years. Laptop have become the preference.Almost everyone has a mobile phone.Tablet has very sharp growth.
This shouldn’t be news to you, but it is significant.
![Page 12: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/12.jpg)
Australia - Understanding the Mobile Consumer. Australian Bureau of Statistics. May, 2012. http://bit.ly/MKj8dqAustralian Mobile Phone Lifestyle Index. 2011. http://www.aimia.com.au/ampli The Australian Online Consumer Landscape Report, Nielsen 2012.
110% mobile device penetration
In Australia...
18% tablet ownership
52% of those are smartphones
0
15
30
45
60
75
90
Apr ‘06 Apr ‘08 Sep ‘09 Sep ‘10 Aug ‘11 Feb ‘12
Desktop PCLaptopMobile PhoneTablet
It’s basically the same in Australia.
![Page 13: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/13.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
Let’s look at where we’ve come from...Analogue networks. First phones were all voice.
![Page 14: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/14.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
1st mobileweb browsers
SMS is born
Predictive Text
SMS comes with 2G about 1993. 1st web browsers around 1997... but nobody used them
![Page 15: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/15.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
Nokia 5110
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
1st mobileweb browsers
SMS is born
Predictive Text
Remember Nokia 5120? I bet you didn’t use the web browser (there wasn’t one)
![Page 16: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/16.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
Nokia 5110
Palm Treo
MotorolaRAZR
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
1st mobileweb browsers
SMS is born
Predictive Text
Palm Treo/Moto RAZR. Now we’re starting to browse. 3G arrives, but not common yet.
![Page 17: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/17.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
Nokia 5110
Palm Treo
MotorolaRAZR
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
1st mobileweb browsers
SMS is born
1st WebKit browser
Predictive Text
WebKit in 2005. Nokia s60.
![Page 18: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/18.jpg)
Data: http://isc.org; http://amta.org.au; http://wikipedia.org and various websites
‘87 ‘89 ‘91 ‘93 ‘95 ‘97 ‘99 ‘01 ‘03 ‘05 ‘07 ‘09 ‘11
Telecom ‘Walkabout’Motorola
Brick
Nokia 5110
Palm Treo
MotorolaRAZR
HTC Dream (1st Android)
iPhone 3
iPad 1
AMPSAnalogue
GSM2G/WAP/WML/i-mode
3G UMTS NextG
1st mobileweb browsers
SMS is born
1st WebKit browser
Predictive Text
You know the rest. Apple release iPhone... People go crazy for web on mobile.
Web on Mobile is less than 10 years old.
![Page 19: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/19.jpg)
http://www.flickr.com/photos/jakecaptive/3205277810
So What?
There is new technology, and people are using it... So What.
![Page 20: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/20.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
![Page 21: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/21.jpg)
mitpress.mit.edu/books/norvh/chapter1.html
Don Norman, 1998
“...we tend to place the
emphasis on
the technologies
themselves, when it is
really the social impact
and cultural change that
will be most dramatic.”
Don Norman is my man for cognitive sciences, design and usability engineering.He wrote some seminal books.
What he’s saying in essence is that...it’s not gadgets that change the world, but how we humans use them.
He is right. And we see this play out in a number of ways.Let’s look at an example.
![Page 22: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/22.jpg)
mitpress.mit.edu/books/norvh/chapter1.html
Don Norman, 1998
“...we tend to place the
emphasis on
the technologies
themselves, when it is
really the social impact
and cultural change that
will be most dramatic.”
Don Norman is my man for cognitive sciences, design and usability engineering.He wrote some seminal books.
What he’s saying in essence is that...it’s not gadgets that change the world, but how we humans use them.
He is right. And we see this play out in a number of ways.Let’s look at an example.
![Page 23: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/23.jpg)
What is the most radical, innovative mobile device
released in the last few years?
You probably thought of a smartphone first.
![Page 24: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/24.jpg)
What is the most radical, innovative mobile device
released in the last few years?
Vodafone 150
$10 - $15
The Vodafone 150 only do Voice, SMS, USSD. That’s it.But it’s had an astonishing impact in some parts of the world.
We tend to focus on smart phones, especially in the cityDon’t forget that forget that smartphones are not ubiquitous yet
![Page 25: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/25.jpg)
http://na.unep.net/globalpop/africa/Appendix_6e.html
Population Density
A lot of people on the north african coast and up the nile.Very dense in parts of west Africa, especially Nigeria.Heavy pockets through east Africa as well.
![Page 26: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/26.jpg)
http://apod.nasa.gov/apod/ap081005.html
Access to electricity
When you compare access to electricity, it looks like there is a lot of overlap...Actually only about 4% of the population that have access to grid power
![Page 27: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/27.jpg)
http://apod.nasa.gov/apod/ap081005.html
GSM Network Coverage
Now look at GSM:
Strong GSM coverage. Around 98% of the populationMoved from having access to information only in immediate surroundings to now having access to a global network of information
![Page 28: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/28.jpg)
What does it mean forinformation sharing?
RapidFTR
RapidFTR is a system to help aid workers reunite lost children with their parentsThe old way: People printed photos of lost children and posted on walls in centre of communitiesThe new way: Needs to deal with misplaced children with a global perspective. Asylum seekers moving around the globe in response to various disasters and events.
It needs to work offline (dropping connections), data sync later and be secure enough to avoid exploiters taking advantage of people at risk.It’s dramatically improved the effectiveness of goal at hand: reuniting lost children with parents.
![Page 29: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/29.jpg)
Yesterday, We went go to the computer to use internet
We behave differently
Africa is a poignant example of social change brought about by technology.
At home, we’ve also changed, just in different ways.
![Page 30: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/30.jpg)
Today, We access the internet any place, any time.
We behave differently
Web on a phone is not remarkable itself.But how it is changing our behaviour is.Let’s have a look at that in a little more detail.
![Page 31: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/31.jpg)
Australian Mobile Phone Lifestyle Index. 2011. http://www.aimia.com.au/ampli
0
20
40
60
80
100
Vo
ice
SMS
Ente
rtai
nm
ent
Vis
it w
eb
Sear
ch
Ban
kin
g
200920102011
Use of the mobile phone for different purposes
This data is from the latest Australian Mobile Phone Lifestyle Index, and shows how we’ve been using phones over the last three years.
Voice and SMS is ubiquitous and hasn’t changed.
Entertainment websitessearchbanking
People clearly use their phone to do more things, and they’re expecting to use it for more.
![Page 32: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/32.jpg)
Pew Research, 2012. http://pewinternet.org/Reports/2012/Just-in-time/
‘Just in time’ information
86% of smartphone owners access information just-in-time...
Mobile enables ‘Just in time’ behaviour
10 years ago, we:Phone friend on landline, arrange to ‘meet under the clocks’ at Flinders St. Station at 2pm.We’d Arrive. On time! Friend not here? Seek out a pay phone and call at home to see what time they left.
For transit info we carried the printed timetable, or memorised the sequence. 3 trains per hour, every 20 mins departing five past the hour.
Today, we get that info ‘just in time’
![Page 33: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/33.jpg)
Pew Research, 2012. http://pewinternet.org/Reports/2012/Just-in-time/
‘Just in time’ information
86% of smartphone owners access information just-in-time...
41% coordinate a meet-up
35% solve an unexpected problem
20% get a up-to-the-minute transport info
Mobile enables ‘Just in time’ behaviour
10 years ago, we:Phone friend on landline, arrange to ‘meet under the clocks’ at Flinders St. Station at 2pm.We’d Arrive. On time! Friend not here? Seek out a pay phone and call at home to see what time they left.
For transit info we carried the printed timetable, or memorised the sequence. 3 trains per hour, every 20 mins departing five past the hour.
Today, we get that info ‘just in time’
![Page 34: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/34.jpg)
Australian Mobile Phone Lifestyle Index, 2011. http://www.aimia.com.au/ampli
‘Just in time’ information
In Australia...
39% restaurant or cafe info
34% use mobile search daily
55% accessed maps/location/traffic
It’s the same in Australia
![Page 35: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/35.jpg)
http://www.flickr.com/photos/martinhoward/2709364519
What does it mean for payments?
About 50% of IB logins are on a mobile deviceSignificant value-transactions are taking place via mobile devicesCustomer are comfortable with this, and it’s now expectedold slow movers are innovating: Banks are running m-payments trials all over the world, with lots of technologiesNew entrants are shaking things up: Bank Simple, Movenbank, Square... and so on.
![Page 36: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/36.jpg)
http://collections.europarchive.org/tna/20081202180014/
20-25% of GDP paid via SMS
Back to Africa...A different take on mobile payments, but incredibly successful: mPesa~$200m AUD profit (most profitable mobile app in the world - double Angry Birds)20-25% of GDPmPesa works on very rudimentary technology, but it meets a very real user needIt solves a people problem first, using whatever technology is available.
We should learn from this.
![Page 37: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/37.jpg)
50% of smartphone owners use their device in-store to help make purchasing decisions
What does it mean for retail?
Have you ever done this? Of course you have.Aside from price matching, there’re other uses for this.
One example:- An app that scans barcodes to give ingredient list and match with user’s allergies- accessibility features on the iPhone mean this can be used by people with impaired vision- it’s not just changing behaviour, it’s creating new opportunities
![Page 38: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/38.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
How do we take advantage of these new opportunities?
Lets look at what makes a good mobile product, and how we can create mobile products that meet changing customer expectations
![Page 39: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/39.jpg)
2010 Native iOS and Android apps
2007 A dedicated mobile website
2012 Integrated mobile experience
What does success look like?
2014 ???
In two years, it will look different again...We need to build products for today’s market, and be preparing for tomorrow
![Page 40: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/40.jpg)
http://g.co/projectglass
Opportunistic interactions
Integrated with life
Everything is ‘smart’ and all things are connected
Post-mobile world
Soon, we won’t need a phone to be mobile. Mobile will just be a part of everything.Integrated with life. Some call this ‘ubiquitous computing’.
One example is Google’s Project Glass prototype.The marketing videos are pretty cheesy, but the concept is on point.
Don’t forget that it’s early days, and there are lots of things to work out.
![Page 41: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/41.jpg)
Remember the first 10 years of radio?
First radio broadcasts were stage-play recitals. It took a while to use it for news broadcasting, and to discover SoundFX and... advertising.
![Page 42: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/42.jpg)
http://en.wikipedia.org/wiki/Television
Remember the first 10 years of television?
First television was radio with pictures.
![Page 43: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/43.jpg)
http://www.icehousedesigns.com/webarchive/images/flshbk_COLLAGE2.gif
Remember the first 10 years of the web?
First websites were static, digitised documents.This is Microsoft in 1995. Brochureware with image-map navigation. Awesome!
Web on a mobile is emerging from a similar place, it takes a while to mature into meaningful and useful experiences.
So, how do we create better mobile products?
![Page 44: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/44.jpg)
‘Content/feature discrimination’
‘Graceful Degradation’
Big assumptions about customer needs
We’ve been saying ‘do less’ (on mobile) for a long time
We’ve been saying ‘do less’ for a while, and ‘graceful degradation’ was once the way to do it.It can be a valid approach, and useful for established products and services, but it has problems.
We take a large-screen design and make it smaller for mobile.
In this example, a unicorn.As the screens get smaller, we chop bits off usually at the extremities. Tail. Legs. Torso.Eventually, only the head is left.
So, most of the time it ain’t that graceful.
![Page 45: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/45.jpg)
‘Content/feature discrimination’
‘Graceful Degradation’
Big assumptions about customer needs
We’ve been saying ‘do less’ (on mobile) for a long time
We’ve been saying ‘do less’ for a while, and ‘graceful degradation’ was once the way to do it.It can be a valid approach, and useful for established products and services, but it has problems.
We take a large-screen design and make it smaller for mobile.
In this example, a unicorn.As the screens get smaller, we chop bits off usually at the extremities. Tail. Legs. Torso.Eventually, only the head is left.
So, most of the time it ain’t that graceful.
![Page 46: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/46.jpg)
‘full version’ mobile version
ContentContentContent
Product info ★ ★Exchange rates ★Interest rates ★Product disclosure statements ★Forms & documents ★
FeaturesFeaturesFeatures
check account balance ★ ★transfer funds ★ ★pay a bill with BPAY ★ ★schedule a future transfer ★Change daily limits ★Update mailing address ★
An example from banking
Full feature set on desktop version.Truncation on mobile.
Content like forms, documents, Product Disclosure Statements and so on.Or so called ‘peripheral’ features.
![Page 47: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/47.jpg)
Morgan Stanley Associates Internet Trends (2010)
2007 2008 2009 2010 2011 2012 2013 2014 2015
Mobile Internet Users Desktop Internet Users
Mobile Majority is very close
Customers want to do more on mobile
But as customers, we expect to do more on mobile today, so truncation - even at the periphery - is a dangerous strategy.
![Page 48: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/48.jpg)
A good start...
‘Progressive Enhancement’
Mobile first, content first
Feature parity
This is the same idea as graceful degradation but in reverse. Instead of starting big and degrading, we start small and enhance.
Progressive enhancement is what is usually happening in ‘mobile first’ thinking, and ‘responsive web design’.
Start with a small unicorn - one that works for mobile - and then deliver unicorns to all screens.
![Page 49: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/49.jpg)
A good start...
‘Progressive Enhancement’
Mobile first, content first
Feature parity
This is the same idea as graceful degradation but in reverse. Instead of starting big and degrading, we start small and enhance.
Progressive enhancement is what is usually happening in ‘mobile first’ thinking, and ‘responsive web design’.
Start with a small unicorn - one that works for mobile - and then deliver unicorns to all screens.
![Page 50: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/50.jpg)
‘full version’ mobile version
ContentContentContent
Your bags ★ ★People ★ ★Notifications ★ ★Blog ★ ★Help ★ ★
FeaturesFeaturesFeatures
Create a new bag ★ ★Edit existing bag ★ ★Explore ★ ★Search Bagcheck ★ ★Create new discussion ★ ★Comment ★ ★
An example
Bag Check was was built mobile first, by the guy who wrote the book on Mobile First.
This is becoming a more common approach.Deliver unicorns consistently on all screens.
But it still misses something.
![Page 51: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/51.jpg)
Adaptation (usually) only dealswith the interface not the content
What if that version of the unicornisn’t helpful for me right now?
http://commons.wikimedia.org/wiki/File:Jednoro%C5%BCec.svg
We’ve delivered the unicorn accurately, but if I can’t interact with it in a way that makes sense on my device, then we’ve only gone part of the way.
An example from banking: On mobile, a list of future-dated payments is viewable, but I cant edit the payments details. Useless.Or PDF forms that render to screen, but can’t be used or printed.
This doesn’t work, because the content hasn’t been structured and presented in a way that is useful for the mobile customer.
![Page 52: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/52.jpg)
http://www.flickr.com/photos/tomazstolfa/4845875443/
Portability and consistency
Adapt content as well as features
Create Once, Publish Everywhere
Responsive content
How can we provide different versions of content and features that are most appropriate for each device?
Create once, publish everywhere (COPE). Easier said than done. Requires a strategic approach to content management. What content is required... on what devices... and in what format?
Are your content and marketing teams ready for this?Is your content management system capable of structuring content in this way?
![Page 53: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/53.jpg)
Another example
National Public Radio do this really well.This is ‘adaptive content’ more than ‘responsive content’. They serve different versions of their content, from a simple CMS, across many devices.
Karen McGrane - my favourite content strategist - talks more about this in her book Content Strategy for Mobile.
![Page 54: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/54.jpg)
Make it easy for them
Customers choose when and how they interact with your brand
Seamless experiences
Awesome, now you have appropriate content and features rendered properly across many devices.
Keep everything connected and transition as seamlessly as possibleBecause customers don’t see your ‘channels’ - All they see is a brand, and their needs
![Page 55: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/55.jpg)
Precious Design Studios. http://www.slideshare.net/preciousforever/patterns-for-multiscreen-strategies
You know they’re likely to be using multiple devices. A seamless experience across your channels is expected.
Provide pathways through content... Seamless connection through appropriate and relevant versions of content.
![Page 56: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/56.jpg)
http://www.flickr.com/photos/thewolf/5812767917
AirBNB - getting it wrong.
I travelled to London recentlyairBNB is a site that connects travelers with hosts for accommodation.
I signed up with Facebook, and booked accommodation on laptopOn the road, I couldn’t authenticate with the app, because FB Open Auth didn’t work properlyUsing email to login - with forgot password - failed too (because I wasn’t in the database)This became a real problem, I almost didn’t have a bed to sleep in.
Not ideal for a brand who’s goal is connecting travelers with hosts.
![Page 57: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/57.jpg)
‘Name of referenced work’, Author/source/URL, date.
realestate.com.au - Getting it right.
Search, browse and create a shortlist in your lunch hour.
![Page 58: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/58.jpg)
‘Name of referenced work’, Author/source/URL, date.
AirPlay the fullscreen image gallery from iPad to TV in the evening to discuss with your partner.
![Page 59: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/59.jpg)
‘Name of referenced work’, Author/source/URL, date.
Use the open-inspection planner to help you on Saturday afternoons
![Page 60: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/60.jpg)
Precious Design Studios. http://www.slideshare.net/preciousforever/patterns-for-multiscreen-strategies
There are some great interaction patterns emerging around multiscreen experiences.
Device shifting. This is where a consumer begins a task on one device, then completes it on another.AirBNB is an example of this gone wrong.Draft an email on mobile, finish it on desktop. Fill a shopping cart on eBay, complete purchase at home.
![Page 61: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/61.jpg)
Precious Design Studios. http://www.slideshare.net/preciousforever/patterns-for-multiscreen-strategies
Simultaneity. Jump-in is an iPad app that ThoughtWorks was involved with for NineMSN.It’s a ‘second screen’ experience designed specifically for tablet and TV.The iPad experience is simultaneous with the TV broadcast.
During Olympics, able to interact with content such as live news, current medal tally, event schedule and realtime twitter conversations that are related to the broadcast.
![Page 62: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/62.jpg)
Precious Design Studios. http://www.slideshare.net/preciousforever/patterns-for-multiscreen-strategies
![Page 63: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/63.jpg)
An ecosystem of screens and physical interfaces
So we have an ecosystem of screens and physical interfaces. Apps are seen as today’s heroes. Let’s look at those in more detail.
![Page 64: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/64.jpg)
Consumers expect acontinuous experience
Let’s look at what’s expected from your apps now: continuity across all channels- people do different tasks on different devices- that means your app, the mobile website, desktop systems all talking on the backend-“we’ll just connect it up on the backend”, simple stuff- what about people who phone in? or visit in person?
![Page 65: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/65.jpg)
‘Name of referenced work’, Author/source/URL, date.
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 66: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/66.jpg)
‘Name of referenced work’, Author/source/URL, date.
RetailCall Centre
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 67: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/67.jpg)
‘Name of referenced work’, Author/source/URL, date.
RetailCall Centre
Legacy Thing
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 68: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/68.jpg)
‘Name of referenced work’, Author/source/URL, date.
Some expensive and proprietary system
MainframeDatabase
Message Hub
RetailCall Centre
Legacy Thing
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 69: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/69.jpg)
‘Name of referenced work’, Author/source/URL, date.
Some expensive and proprietary system
MainframeDatabase
Message Hub
RetailCall Centre
Legacy Thing
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 70: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/70.jpg)
‘Name of referenced work’, Author/source/URL, date.
Some expensive and proprietary system
MainframeDatabase
Message Hub
RetailCall Centre
Legacy Thing
- all these standalone backend systems that don’t talk well to each other- in reality, “the backend” is not one nice continuous system-> lots of separate systems, different technologies... we don’t even know how some of them work anymore, so we don’t touch them... but they seem to work- so to get our continuous mobile experience, we also need to wrangle all this other stuff- the mess on the backend doesn’t give you the flexibility you’ll need going forward- but it is the bit the consumer sees, the thing they will judge you on
![Page 71: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/71.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
![Page 72: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/72.jpg)
Different mobile platforms
- mobile is booming, everyone is getting connected...but we’re not all buying the same devices (sometimes not even similar devices)- 5 main platforms: iOS, Android, Windows, Blackberry, Web- going to simplify to 3: iOS, Android, the Web-> Win7/8 looks really promising, make your conclusions about the future of Blackberry- how can we target all of these platforms?- Do we even want to? Different interaction patterns.
![Page 73: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/73.jpg)
Native or Web?
Going to quickly explain each of these approaches and some of the tradeoffs-> one of the great debates in the developer community at the moment
![Page 74: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/74.jpg)
Objective C and Java
In the app store
Lowest barrier to a great experience
Native or Web?
Being discoverable in the app store is still important- a reasonable proportion of users can’t distinguish between the app store and web search (even though search is so bad in the Apple app store)- means you’re writing using the tools provided by the vendors (Apple, Google, Microsoft)- Objective C is kind of a strange language, and Java isn’t exactly the new hotness- native apps have the lowest barrier to awesome (it’s not automatic)
![Page 75: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/75.jpg)
HTML, CSS, Javascript
Distribute through the browser
Some reuse across platforms
Native or Web?
- apps that you actually distribute and run inside the browser on your mobile device - easier to manage versions and updates - HTML5 is going to save the day, and everything will just work(in reality you have a bunch of tweaking and performance tuning ahead of you)
- get to work with familiar technology: in house skills, easier to find devs - don’t underestimate the challenge of finding good developers for native apps
![Page 76: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/76.jpg)
or
- no one size fits all, it depends- but it’s not an either/or choice, there is a whole spectrum between the two- modern mobile platforms have reasonable support for running parts of your app using web technologies-> people are calling these hybrid apps, can be a confusing term
![Page 77: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/77.jpg)
NATIVE HYBRID WEB
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 78: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/78.jpg)
The Guardian
NATIVE HYBRID WEB
Democracy Now!
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 79: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/79.jpg)
The Guardian
NATIVE HYBRID WEB
Democracy Now!Instagram
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 80: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/80.jpg)
using PhoneGap
The Guardian
NATIVE HYBRID WEB
Democracy Now!
BBC Olympics
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 81: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/81.jpg)
using PhoneGap
The Guardian
NATIVE HYBRID WEB
Democracy Now!
BBC OlympicsFacebookLinkedIn
Instagram Jump-in
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 82: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/82.jpg)
using PhoneGap
The Guardian
NATIVE HYBRID WEB
Democracy Now!
BBC OlympicsFacebook LinkedIn
Instagram Jump-in
- at the other end, we have pure web apps written in HTML, CSS and Javascript- at one end, we have completely native apps written in Objective C, Java- full native apps: expect heavy usage, offline access, high performance slick UI- tools that wrap up a web app inside a native shell to go on the app store (Phone Gap)-> eg. BBC Olympics app... good screenshots, sluggish performance, but hits-all-platforms- custom hybrid apps: native apps with web components- interestingly, Facebook has been rewriting their app to have more native components
![Page 83: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/83.jpg)
http://www.flickr.com/photos/raeallen/200891658
How should you build your app?
Platform CoverageUser Experience
- there’s a whole spectrum of approaches to choose from, which should you take?- there are a number of things to take into consideration: -> time to market, quality of the user experience, performance, development capability, platform coverage, discoverability -> going to simplify this to the fundamental two factors- let’s look at these tradeoffs, and approaches that favour one over the other
![Page 84: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/84.jpg)
Platform Coverage
User Experience
- this is where we want to be: a great experience on all platforms...- let’s treat that as the goal, but we’re not going to get there straight away- for a lot of people, this is where they are at the moment, with a fairly large and tricky mess- two ways we can go: -> tackle a single platform first, and go for a really polished interface, slowly expand both the feature set and platform coverage from there (calling this the Laser strategy) -> go for a shallow cut of both the experience and feature set, but hit as many platforms as possible (calling this the cover your bases strategy)- let’s look at each approach, and where it might make sense to use it
![Page 85: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/85.jpg)
Platform Coverage
User Experience
- this is where we want to be: a great experience on all platforms...- let’s treat that as the goal, but we’re not going to get there straight away- for a lot of people, this is where they are at the moment, with a fairly large and tricky mess- two ways we can go: -> tackle a single platform first, and go for a really polished interface, slowly expand both the feature set and platform coverage from there (calling this the Laser strategy) -> go for a shallow cut of both the experience and feature set, but hit as many platforms as possible (calling this the cover your bases strategy)- let’s look at each approach, and where it might make sense to use it
![Page 86: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/86.jpg)
Platform Coverage
User Experience
- this is where we want to be: a great experience on all platforms...- let’s treat that as the goal, but we’re not going to get there straight away- for a lot of people, this is where they are at the moment, with a fairly large and tricky mess- two ways we can go: -> tackle a single platform first, and go for a really polished interface, slowly expand both the feature set and platform coverage from there (calling this the Laser strategy) -> go for a shallow cut of both the experience and feature set, but hit as many platforms as possible (calling this the cover your bases strategy)- let’s look at each approach, and where it might make sense to use it
![Page 87: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/87.jpg)
Platform Coverage
User Experience
Laser
- initially, focus on a single platform and nail it... eg. iPhone app- for new companies trying to win customers, where experience is an important selling point -> if you can’t win the market with this focus, what makes you think you can win it at all?- for existing companies, look at your stats: which users to do you want to hit first? -> In Australia, and your company is targeting professional adults, it’s often the iPhone eg. high end fashion, even banking and insurance, selling cars or houses (if your product is aimed at teenagers, you’re likely to see more Androids)- iOS is more dominant here than elsewhere (employment, wages, no carrier lock in)-> read stats about number of devices purchased, but usage of those is very different
![Page 88: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/88.jpg)
Platform Coverage
User Experience
Cover your bases
- cut scope and quality finish to try and hit as many platforms as possible- might make sense for companies with existing customers: don’t be exclusive- where playing favourites isn’t really an option (eg. ATO - eTax, except they didn’t) eg. emergency warning system: want it to go to everyone (people have ignored this)- depending on the content you're presenting, HTML/CSS might be well suited eg. for text markup and layout... -> for infinite scrolling tables/multiple gestures, native still a long way ahead
![Page 89: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/89.jpg)
or
- not an either/or choice, you can use both (native and web)- use native where it makes sense, use web components where it makes sense-> compromise between the laser and cover your bases strategies- there are frameworks out there to help do this (eg. PhoneGap/Cordova, Titanium/Kony)-> but don’t want to lock yourself in
![Page 90: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/90.jpg)
and
- not an either/or choice, you can use both (native and web)- use native where it makes sense, use web components where it makes sense-> compromise between the laser and cover your bases strategies- there are frameworks out there to help do this (eg. PhoneGap/Cordova, Titanium/Kony)-> but don’t want to lock yourself in
![Page 91: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/91.jpg)
and
Don’t lock yourself into doing everything natively or
everything using the web
- not an either/or choice, you can use both (native and web)- use native where it makes sense, use web components where it makes sense-> compromise between the laser and cover your bases strategies- there are frameworks out there to help do this (eg. PhoneGap/Cordova, Titanium/Kony)-> but don’t want to lock yourself in
![Page 92: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/92.jpg)
Shared presentation using HTML/CSS
Shared logic using Javascript
Sharing between platforms
- it doesn’t have to be Javascript, could use Mono and C#-> Thoughtworks Tech Radar: treating Javascript as a first class language -> “it depends” eg. a banking app vs search and listing or directory app- complex UI, gestures, animations... native eg. Hipstamatic/Instragram/iPhoto- marking up content (text/images) without a lot of interaction -> HTML/CSS have evolved for exactly for that purpose- reuse at all costs is not the answer, focus on what the user is trying to achieve- be pragmatic about how to reuse parts where it will save you time and money
![Page 93: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/93.jpg)
Objective C Objective C
HTML / CSS Javascript
User Interface Client Logic
iPhone
Mobile Web
- how this evolved from experience with the laser approach: a global bank -> iPhone, Android, web apps: different languages for each platform- the left hand column is your opportunity to share the presentation-> depending on the size of the UI code, how complex it is, how expensive it is to maintain-> might make sense to duplicate across platforms if it’s simpler and quicker- the right hand column represents the opportunity to share the logic of the app-> is it common? Does it make sense to write it in Javascript?-> simple state machine? Yes. Complex image filtering? Probably not.
![Page 94: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/94.jpg)
Objective C Objective C
HTML / CSS Javascript
User Interface Client Logic
iPhone
Mobile Web
What would we do differently?
- how this evolved from experience with the laser approach: a global bank -> iPhone, Android, web apps: different languages for each platform- the left hand column is your opportunity to share the presentation-> depending on the size of the UI code, how complex it is, how expensive it is to maintain-> might make sense to duplicate across platforms if it’s simpler and quicker- the right hand column represents the opportunity to share the logic of the app-> is it common? Does it make sense to write it in Javascript?-> simple state machine? Yes. Complex image filtering? Probably not.
![Page 95: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/95.jpg)
Objective C Objective C
HTML / CSS Javascript
User Interface Client Logic
Cal
atra
va
A bridge between native and web
- want a bridge between the Javascript and native code -> knows how to call javascript code, and also to get values out- other side of the bridge allows us to pass data to be presented -> choice of whether to present it using web views or native views -> pass actions from the UI back down to the appropriate logic* finally, need a registry to match up the components of the system with technology-> we’ve been using this successfully for a major airline
![Page 96: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/96.jpg)
http://en.wikipedia.org/wiki/Puente_del_Alamillo
More an approach than a framework
Technology choice per feature
Will soon be open source
Calatrava
- named after Santiago Calatrava, designs bridges (this one in Seville, 4th bridge in Venice)- nice to name something after a bridge (feel like a real engineer) -> acts as the bridge that connects native and web code (gives us that technology choice)- calling it a framework might be overkill, it’s only a few hundred lines of code- we’ve been using this approach at a “major airline”, it’s been working really well-> adding a few new flows within existing native apps, using this approach-> can come back and polish the UI later if needed- we’ll get this open source, so watch this space- so we’ve got an approach for building our apps, but...
![Page 97: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/97.jpg)
But the app is just the tip of the iceberg
- calatrava is best option I’ve seen for flexible, pragmatic reuse... but I’m biased- tools like PhoneGap, Titanium, Mono are all useful as well, it depends on the app* what about the rest of the system?- maybe we’re optimising the wrong part?
![Page 98: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/98.jpg)
App Backend
- typical app talking to this mysterious “backend”* Lots of talk about how to share logic across platforms, but not enough people questioning what all that logic is doing in your app in the first place- a lot of complexity can be added by talking to an old, chatty backend system-> if it’s messy, don’t write all the logic in the app and try and reuse it* put a layer in between
![Page 99: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/99.jpg)
App BackendAPI
- Simplify the backend systems your app has to deal with, protect them- this API can provide a simple view of the backend, as if it was a nice continuous system-> the LinkedIn engineering blog has a post on using a node.js server to do this- it also gives you a buffer for change (some people never update their apps)- whenever you write new logic in your app, see if you can put it in the API
![Page 100: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/100.jpg)
APIApp Backend
How do we build simpler apps and smarter backends?
Product-aligned teams
RESTful web services
Serving data and style
- the app should be as thin as possible, that's the best reuse you can get - how???- much easier if you develop the API and the apps at the same time (not technology teams)- RESTful web services are great for mobile apps-> if you don’t know about REST, look it up, basically structuring systems like the web...-> think of it like a replacement for things like SOAP and WSDL-> great for reducing the amount of logic required by the client (discoverable)eg. switching a single URL and getting completely different data, different static image server- create APIs that serve both the JSON data and visual style in HTML/CSS-> give yourself more control of your apps, and keep that logic server side
![Page 101: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/101.jpg)
Technology has changed
We behave differently
Creating better mobile products
Building mobile apps
›❯
›❯
›❯
›❯
![Page 102: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/102.jpg)
Focus on customer behaviour before technology
http://www.forbes.com/sites/fredcavazza/2012/08/13/why-launching-a-mobile-app-is-pointless
Gadgets and technology won’t in themselves change the way your customers behave.
Find out how they behave and what they need first, then work out how to best meet those needs.Forbes put it quite nicely...
![Page 103: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/103.jpg)
Focus on customer behaviour before technology
Forbes.com. August 2012
“Competitive advantage will not be
gained by providing your customers a
sharp mobile app, but by making sure
every decision maker in your
organization understands the needs
and habits of mobile users”
http://www.forbes.com/sites/fredcavazza/2012/08/13/why-launching-a-mobile-app-is-pointless
Gadgets and technology won’t in themselves change the way your customers behave.
Find out how they behave and what they need first, then work out how to best meet those needs.Forbes put it quite nicely...
![Page 104: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/104.jpg)
Do more, not lessfor mobile
We know that people are using their mobile devices to do more things than ever today.There’s a growing expectation to do anything on mobile.Truncation for mobile is a dangerous strategy.
![Page 105: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/105.jpg)
Break large systems into smaller, faster moving components so you can better respond to change
- the mobile market is changing rapidly- if it takes you a year or two to put out an app, and it’s scraping your backend website, because you don’t have an API and you only deploy new versions of the websites every few months-> that’s not going to cut it going forward* start up companies that don’t have this legacy, wont have this problem, they’ll be a threateg. Ingogo and Uber taxi apps... don’t want to integrate with existing providers- Either need to be good at innovation or good at fast follow and delivery... can't fail at both- Plan to have APIs for your backend systems, even for mobile web applications.- Amazon talks a lot about having lots of small, single purpose APIs- if you want zippy mobile web apps, it likely means doing a bit more on the client side- reduce load on the network, hide that high latency mobile connection
![Page 106: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/106.jpg)
Whatever you do, use short iterations,
measure and learn quickly.
- we’re still working out what the impact of smartphones is going to be- by the time we do, we’ll probably be past smartphones-> so get good at reacting to change, and moving quickly- there will be many opportunities, but you will need to be learning and moving fast to take advantage of them.
![Page 107: Mobile - More than just an app](https://reader036.vdocuments.net/reader036/viewer/2022062319/554d1c39b4c905ca208b4772/html5/thumbnails/107.jpg)
A. Person, 2011
“Nulla facilisi. Phasellus mollis nibh eget tortor cursus congue. Vivamus velit tortor, sodales sed feugiat in, gravida eu turpis. Pellentesque quis neque at libero malesuada tincidunt a in risus. Maecenas.”
‘Name of referenced work’, Author/source/URL, date.
Thank youJonny [email protected]
@jonnyschneider
Stewart [email protected]
@stewgleadow