heavy chef march: building great mobisites
DESCRIPTION
We had the incredible opportunity to have Tim Bishop from Prezence Digital come talk to us about building great mobisites at last week's Heavy Chef event in Joburg.TRANSCRIPT
This presentation is luckily brought to you without Tim’s inane and ‘cocky’ ramblings over the top.Therefore things may make a lot more sense ;) Apologies for
some slide deletions. We also apologise to any brands that Tim may
upset during the course of this presentation but this is a precious new medium (and user) that we must treat with respect. All relevant trademarks are acknowledged.
DIGITAL: We want to trulyLIBERATE our brands... BUT
Does everyone have thetools to engage with us?
If you mobilise,YES THEY DOIn the palm of their hands!
NO they don’t... BUT
Not sure about mobile? You can’t argue with facts
More cellphones in SA than the entire SA population
South African household technology* Source AMPS 2009 B
Apart from calls, how are people using their phones?
0 5 10 15 20 25 30 35 40 45 50
SMS
Please Call Me
Take Photos
Video Recording
Play Games
MMS
Short Code SMS
Download / Listen to Music
Mobile Internet
Send / Receive Emails
South African Mobile Data Usage
* Source Nielsen AMPs data 2009
South African Mobile Data Usage
By the hour! *Source - TNSGlobal
Mobile has changed us from an access at work nation
Only a 2 million cross-over= 10 million new people
12 million on mobile web6 million on desktop web
has spoken!...the numbers say it all
0
20
40
60
80
100
120
Weekdays Weekend
Mobile Search Web Search
60% of all Google Searches are done from a mobile device during the weekend in South Africa!
Mobile Search - rapid growth in SA
mobile 25%
mobile
desktopdesktop
60%
So who are these mobileweb users in SA?
0% 5% 10% 15% 20% 25% 30%
LSM 1 -3
LSM 4
LSM 5
LSM 6
LSM 7
LSM 8
LSM 9
LSM 10
* Source Admob July 2010
South African Mobile Web users LSM
LSM 6 Black mid 20’s, Slight Male skew
Mobile is the Power-house of SA digital touch points
STER KINEKORSelect Options1 – View Movies2 – My Cinema3 – Book Movie4 – My profile--------------------Reply
Touching the Masses – OPPORTUNITY!
WEBSITE
Sorry, had to kill these images as sites release in the next month ortwo.
Was for Heavy Chef live presentation only.
MOBISITE
What exactly is a ‘Mobi’ device anyway?
6000+ of these....
A non-desktop device, that due to its size and context of use, needs to be treated differently
Mobi building is complexIt is not the same as web!
Bliss! – Luxury of desktop PC design!
Lots of space, a few browsers and easy input controls
S*%T - The problems of mobi design
No space, 6000 devices (more variants) crude input controls
The first considerations(especially in SA) Speed and cost
CONSIDERATIONS DATA COSTS
A Pay as You Go society in SA means your mobi
site costs users VERY VISIBLE Rands and Cents
R2.00 per Mb for most Pay as You Go customersLower rates are available for bundles or contract customers
Only deliver the content they need or ask for!
CONSIDERATIONS CONNECTION SPEED
A variety of connection speeds, handset capabilities and network coverage issues.
3G users could also be out of range! OPTIMISE MOBI TO THE MAX!
Maximummobi page target size of 35 Kilobytes 15 secs 6 secs 3 secs >2 secs
+
Size, length and width IS important!
Isn’t that right ladies?
No really.... with mobile it IS very important!
Unlike web: One size does not fit all!
If you build your mobi to cater for small phones...
Samsung E250 - 128 pixels wide
One size does not fit all!
It is unusable on larger ones!
Blackberry 9000 - 480 pixels wide
?
?
One size does not fit all!
If you build for larger phones...
Blackberry 9000 - 480 pixels wide
One size does not fit all!
It will be very difficult to use on the smaller ones!
Samsung E250 - 128 pixels wide
Wow!I can see a cloud!
If you design for the average sized phone...
One size does not fit all!
LG K360 - 240 pixels wide
One size does not fit all!
It won’t be an ideal experience for anyone else!
One very important thingthat is always overlooked
TOUCH The rules change yet again...Fingers are not matchsticksSo leave room!
TOUCH What to give your users...Menu space clickable areas large buttons more links
There are many challenges when building for mobile
So many devicesSo many screen sizesSo many browser typesSo many file formatsSo many device manufacturersSo many connection speedsSo many platforms and op systemsSo many shit Jozi drivers in Cape Town
Touch or cursor inputs...So much to deal with before we even start considering the design!
Mobilising the masses...We start with technology
6000+ different devices =HCA
Handset Content Adaptation
6000 mobi sites
Some real world examplesWho could do better?
Real world examples supersport.mobi
No device resizing (HCA)No touch provision
44kbNo images8.6c
44kbNo images
8.6c
Real world examples mweb.mobi
No device resizing (HCA)
Only for larger phones
101kb20c
101kb20c
Real world examples 24.mobi
Limited device resizingNo touch space
25kb4.9c
34kb6.8c
Real world examples
Device resizingNo touch space
24kbNo images4.7c
19kb3.7c
m.iol.co.za
Real world examples ewn.mobi
14kbWith images 2.7c
24kbWith images
4.7c
Device resizing (Full HCA)
Touch provision
Real world examples timeslive.mobi
27kbWith images 5.4c
52.2kbWith images
10.4c
Device resizing (HCA)
No touch space
Real world examples
Device resizingTouch provision
entertainmentafrica.mobi
29kbWith images5.6c
19kbWithimages3.7c
So, to mobilise properly...Let the tech do some work
Handset downscale and upscalingPerfect rendering to all handsetsTouch aware and layout adaption
Dynamic image resizing/optimisingHandles compatible file delivery
HCA
The mobile web is not as expensive as you think!
Greater, richer interactive experience for little cost
19kb with images =
3.7c per pageV
Sms your name to 33008 and
win. Sms’s cost R1.50
Equivalent cost experience on Mobi ?
40 mobi site pages!
Deliver perfect experiences ...regardless of handset
Multimedia VIDEO
Easy, small and low quality... NO!
The ideal experience
SK (2) We are encoding 20 variants per trailerfor perfect experience!
Streaming Video – Now on mobile!
Compelling, Emotive and straight to the point...
A ‘moving’ picture paints 2000 words!
Sorry, had to remove this image as is confidential client work. For Heavy Chef live presentation only.
So that’s some technology...what else is there?
Consider your user...
Always design for the lowest common
denominator and enhance upwards for
the most content hungry users
Consider those who have limited mobile experience - education
Consider those who have lower literacy capabilities - intuitive
Consider those who want the basic information – FAST - snack
Consider those who are experts and want everything - expand
everyone!
(Content) CONTEXT is KINGConsider where and why!
21% males – 12% females use their iPad on the loo!
‘MOBILE’ also describes the user...
A MOBILE user’s circumstances and situation vary. Content becomes less relevant if we ignore the CONTEXT of the viewer!
CONTEXT first: then relevant content• Browsing one handed (coffee)• In a queue and wants to jump it• On the loo with time to kill• Lost and needing fast directions• Needs traffic / weather info• Product research and comparison• Want to engage with your brand • WANT TO SOCIALISE AND CHAT!
CONSIDER WHERE AND WHY!
Mobile design approach......its a little cramped!
Mobi design = organising a tiny desk
Place the most important things close by and work outwards
Hierarchy design computicket.mobi
W/W/WHEN
LOGINOR REGISTER
EVENT DETAILBOOKING DETAIL
MORE INFOMAIN CATEGORY
STOR
E FIND
ERG
EO M
AP
PIN
G
CALL USCLICK TO CALL
TER
MS+
CO
NS
DIS
PLA
Y/A
CC
EPT
ALL EVENTSW/WHERE/WHEN
BUS/TRAVEL HOME PAGE
LESS IMPORTANTLESS IMPORTANT
HIGHLIGHTEDEVENTS
SEARCH ALLEVENTS
MAIN ACTION
AREA
MAIN ACTION
AREA
70% OF BOOKINGS
MOBILISE... Do not MINIATURISE
User’s need FAST snacky info + NavRemember CONTEXT - Make it OBVIOUS AND EASY...
UX: Make clicks meaningful...use Action Areas
Where am I? I am sure I just clicked!Build information ‘above the fold’ to make sure the user knows where they are... Show change to the user in ‘Action Areas’ (Visible Screen)
No obvious changeCursor Nightmare!
Top menus
Each click shows a clear change on each page refresh and re-affirms user’s previous selection criteria.
Enhancing upwards...unlock device capabilities
For the minorities (but future majorities)
Enriched functions & UX for handsets
Optimise video & rich content for enhanced handsets Custom mobi interfacesGPS integration for
mapping and geo-location
Mobi can access advanced handset features such as geo-location for mapping and geo-targeted content.
Custom mobi interfaces can be aimed at handsets
Easy mobi management... Use a single cms platform
Single content upload...Multiple automated deployments
Sterkinekor.com/mobi(Web, Mobile, Touch, Mobile Apps)
Sorry, had to kill these images as apps release in the next month ortwo.
Was for Heavy Chef live presentation only.
Sorry, had to kill these images as apps release in the next month ortwo.
Was for Heavy Chef live presentation only.
Computicket.mobi
Computicket.mobirecord SA mobi transactions in 1st day BETA test!
Computicket.com
Poor student to flush student.....in 10 minutes!
Mystudentloan.standardbank.co.za
Standard Bank – Student Achiever
Look & feel by our goodFriends at Aqua Online
• Mobile can be beautiful!
• Fully integrated into Predator web publishing CMS system
• Customised CMS modules to expand mobi capabilities
• Phased approach to full deployment
• User generated imagery
• Competition management
• UGC ENGINE
Seventeen.mobi
• Fully integrated into existing CMS system
• Video management
• Content feed aggregation
• User generated feedback
• Premium content integration
• User comments engine
• Multimedia downloads
• SMS alert system
EWN.mobiEye Witness News
EMI.co.za• Dual Web / Mobile deployment
• Fully integrated into customised publishing CMS system
• Multimedia management
• Content feed aggregation
• Buy-Now outbound links
• Genre / label based search
• Category sorting and listing
• Competition management
• 'We are indebted to the amazing men and women at Prezence Digital who developed our web and mobi properties for no cost at all. What an act of dedication and commitment to making South Africa a safer place for us all!' - Danny K.
SHOUT - Prezence CSR
Digital donated by
EntertainmentAfrica.mobi
EntertainmentAfrica.com
Mobi is a brand touchpointIt should look the part!
Mobi should leave a great impressionWhen built properly, your mobi site will be a perfect brand ambassador
Context, Content and Brand are spot on.. For all phone users!
So why are great brandsgetting it so wrong?
CocoPops did everything right....
Does this mobisite do a great brand (targeting kids) justice? WHY NOT?
except the mobisite!
Great engagement opportunity lost?
Less is more on mobile!!!!What a load of BULLS&!T
Kulula does what? Do they not sell flights and also help me manage the flights I have booked?
I can see how much I’ll miss my flight by?And what flights I could book if online!
WEATHER? I’m mobile!I can LOOK UP!
Mobile for mobile sake Utterly useless!Check-in process – That looks promising! NOPaperless Ticket – to my mobile perhaps? NOChange my booking – I’m late, that’s great! NO
‘Click to call’PLEASE!I cant write it down & then call.. I am mobile!
WHY? To find
out when you do the mobisite well?
‘Dear user, If you weren’t silly enough to be accessing us via mobile, you could do all these useful things!Get yourself a proper computer and then you can!
Great! So what’s
their number orURL?
Mobile is powerful – use it!Give users the choice!
Facebook mobile...
Less is more on mobile...? NOT TRUE!
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
CALL CALL CENTRE
Kulula style!!!
Make your life easier!Great things are out there
Mobile Social Media in a box: Motribe“When you can’t always speak to your brand fans... Let them speak to each other!”
YOUTUBE Channel Integration
YouTube has useful mobile video integration tools...Better still – They are Free!
Location location locationProximity brings relevance
(Where I am and where my friends are is important)
Location based brands – network + hardwareMobile experience can add morerelevance by using location as hooks.
Find and interact with friends while skiing!Augmented reality
location SM apps
Spreading your message...not just ‘LIKE’ing it!
Beyond the ‘Like‘ function on Mobile!Facebook Connect can now be thoroughly integrated onto all S40 and limited capability type devices for SM in Africa.
‘Profile' use their social profile to greet, be
relevant and ‘tap up their friends’.
Sharing (post to wall with link / event / image
or pre-determined updates (such as purchase) from a drop-down bar.
'Like' button is possible to implement on even
the most limited of devices if you know what you are doing!
Using enticing content...to keep them coming back!
EntertainmentAfrica white-label Mobi content
Brands shown are for demonstration only
Application or Mobi?In Africa – spend carefully!
Don’t believe the hype... South Africa is very different!
App v Mobi - We are not the US!
US DATA – NOT SA DATA
Less important
Don’t believe the hype... South Africa is very different!
App v Mobi - We are not the US!
Less important
Think of the SA market...only 150k iPhones in SA!
(40% active app users = 60,000 + 20,000 iPads max!)
39.8%
29.9%
7.7%
5.9%4.6%
3.0%2.0%
0.9% 0.8% 0.4%
0.0%
5.0%
10.0%
15.0%
20.0%
25.0%
30.0%
35.0%
40.0%
45.0%
Nokia Samsung SonyEricsson LG RIM Motorola Apple HTC Openwave MAUI
* Source Admob July 2010
HANDSET PENETRATION - South Africa
Smartfone = 8%(will grow eventually)
Samsung 29.9%
Nokia 39.8%
Apps can help exposure...Let the stores to the work!
20 Million Nokia handsets in SA....
100+ Devices
NOKIA Ovi – EntertainmentAfrica.com
250,000 downloads – March 2011
APPs for all platforms Nokia OviBlackberry AndroidiPhoneiPadWindows Mobile(will become more important)
For max penetration: In this order....(depending on target market)
Sorry, had to kill these images as apps are in development and release in the next few months.
Was for Heavy Chef live presentation only.
The most vital element... Knowing (profiling) your user!
If you know what makes them tick...
You can personalise
and be RELEVANT
MSISDN + PROFILING
SMS
Hi SubusisoThe latest XXXnewsletter isOut! Click HEREor reply and you could win a R500 voucher
USSD
XXXXX MOBi:Hi SubusisoSelect Options1 – Register2 – News Alerts3 – Competitions4 – Refer Friend--------------------Reply
and perform beautifullyregardless of the device
Your mobi must be a great user and brand experience
Be relevant and give users a reason to come back
You must focus on ‘context’ before considering content
Mobile is THE channel for 24/7 engagement in SA
Dont cut back on usefulness(kulula ;) give people the choice
MOBILISE properly! Making things smaller is
just not enough!
So don’t F*%k it upfor the rest of us ;)
