Heavy Chef March: Building Great Mobisites

timprezenceTim Bishoptim@prezence.co.za

This presentation is luckilybrought to you withoutTim’s inane and ‘cocky’ramblings over the top.Therefore things may makea lot more sense ;) Apologies forsome slide deletions. We also apologise to any brands that Tim mayupset during the course of this presentation but this is a precious new medium (anduser) that we must treat with respect. All relevant trademarks are acknowledged.

DIGITAL: We want to trulyLIBERATE our brands... BUT

Does everyone have the tools to engage with us?

NO they don’t... BUTIf you mobilise,YES THEY DO In the palm of their hands!

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?

South African Mobile Data Usage Send / Receive Emails Mobile InternetDownload / Listen to Music Short Code SMS MMS Play Games Video Recording Take Photos Please Call Me SMS 0 5 10 15 20 25 30 35 40 45 50 * Source Nielsen AMPs data 2009

South African Mobile Data Usage By the hour! *Source - TNSGlobalMobile has changed us from an access at work nation

12 million on mobile web 6 million on desktop webOnly a 2 million cross-over = 10 million new people

has spoken!...the numbers say it all

Mobile Search - rapid growth in SA60% of all Google Searches are done from a mobiledevice during the weekend in South Africa! 120 Mobile Search Web Search 100 80 mobile 25% 60% 60 mobile 40 20 desktop desktop 0 Weekdays Weekend

So who are these mobile web users in SA?

South African Mobile Web users LSM LSM 10 LSM 9 LSM 8 LSM 6 Black mid 20’s, LSM 7 Slight Male skew LSM 6 LSM 5 LSM 4LSM 1 -3 0% 5% 10% 15% 20% 25% 30% * Source Admob July 2010

Mobile is the Power-house of SA digital touch points

Touching the Masses – OPPORTUNITY! WEBSITE MOBISITE STER KINEKOR Select Options 1 – View MoviesSorry, had to kill these 2 – My Cinema 3 – Book Movieimages as sites release 4 – My profilein the next month or -------------------- Replytwo.Was for Heavy Chef livepresentation only.

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 complex It 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 designNo space, 6000 devices (more variants) crude input controls

The first considerations (especially in SA) Speed and cost

CONSIDERATIONS DATA COSTSA Pay as You Go society in SA means your mobisite costs users VERY VISIBLE Rands and CentsOnly deliver the content they need or ask for!R2.00 per Mb for most Pay as You Go customersLower rates are available for bundles or contract customers

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 pagetarget size of35 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! Wow! I can see a cloud! Samsung E250 - 128 pixels wide

One size does not fit all! If you design for the average sized phone... LG K360 - 240 pixels wide

One size does not fit all! It won’t be an ideal experience for anyone else!

One very important thing that 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 = 6000 mobi sites HCA Handset Content Adaptation

Some real world examples Who could do better?

Real world examples supersport.mobi 44kb No images 8.6c 44kb No images 8.6c No device resizing (HCA) No touch provision

Real world examples mweb.mobi 101kb 20c 101kb 20c No device resizing (HCA) Only for larger phones

Real world examples 24.mobi 25kb 4.9c 34kb 6.8c Limited device resizing No touch space

Real world examples m.iol.co.za 19kb 3.7c 24kb Device resizing No images 4.7c No touch space

Real world examples ewn.mobi 14kb With images 2.7c 24kb With images 4.7c Device resizing (Full HCA) Touch provision

Real world examples timeslive.mobi 27kb With images 5.4c 52.2kb With images 10.4c Device resizing (HCA) No touch space

Real world examples entertainmentafrica.mobi 19kb With images 3.7c 29kb Device resizing With images 5.6c Touch provision

So, to mobilise properly...Let the tech do some work

Handset downscale and upscalingPerfect rendering to all handsetsTouch aware and layout adaption HCA Dynamic image resizing/optimising Handles compatible file delivery

The mobile web is not as expensive as you think!

Greater, richer interactiveexperience for little cost 19kb with images = 3.7c per page V 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 The ideal experienceSK (2) We are encoding20 variants per trailerfor perfect experience! Easy, small and low quality... NO!

Streaming Video – Now on mobile! Sorry, had to remove this image as is confidential client work. For Heavy Chef live presentation only.Compelling, Emotive and straight to the point...A ‘moving’ picture paints 2000 words!

So that’s some technology ...what else is there?

Consider your user... everyone! Always design for the lowest common denominator and enhance upwards for the most content hungry usersConsider those who have limited mobile experience - educationConsider those who have lower literacy capabilities - intuitiveConsider those who want the basic information – FAST - snackConsider those who are experts and want everything - expand

CONTEXT is KING(Content) Consider 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. Contentbecomes 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 MORE INFO MAIN CATEGORY LOGIN OR REGISTER ALL EVENTS MAIN ACTION AREA 70% OF BOOKINGS W/WHERE/WHEN W/W/WHEN STORE FINDER GEO MAPPING HIGHLIGHTED TERMS+CONS DISPLAY/ACCEPT MAIN EVENTS ACTION LESS IMPORTANT LESS IMPORTANT SEARCH ALL AREA EVENTS EVENT DETAIL BOOKING DETAIL BUS/TRAVEL HOME PAGE CALL US CLICK TO CALL

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 wherethey are... Show change to the user in ‘Action Areas’ (Visible Screen) Top menusEach click shows a clear change on each page refresh No obvious changeand re-affirms user’s previous selection criteria. Cursor Nightmare!

Enhancing upwards... unlock device capabilities For the minorities (but future majorities)

Enriched functions & UX for handsets Mobi can access advanced handset features such as geo-location for mapping and geo-targeted content. Custom mobi interfaces can be aimed at handsets Optimise video & rich content GPS integration for for enhanced handsets Custom mobi interfacesmapping and geo-location

Easy mobi management...Use a single cms platform

Sterkinekor.com/mobi(Web, Mobile, Touch, Mobile Apps) Sorry, had to kill these images as apps release in Sorry, had to the next month or kill these images as apps two. release in the next month or Was for Heavy two. Chef live Was for Heavy presentation only. Chef live presentation only. Single content upload... Multiple automated deployments

Computicket.com Computicket.mobi Computicket.mobi record SA mobi transactions in 1st day BETA test!

Poor student to flush student.. ...in 10 minutes!Mystudentloan. standardbank.co.za

Standard Bank – Student Achiever Look & feel by our good Friends at Aqua Online

Seventeen.mobi• 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

EWN.mobi Eye Witness News• 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

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

SHOUT - Prezence CSR Digital donated by• 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.

EntertainmentAfrica.comEntertainmentAfrica.mobi

Mobi is a brand touchpoint It should look the part!

Mobi should leave a great impression When 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 brands getting it so wrong?

CocoPops did everything right.... except the mobisite! Does this mobisite do a great brand (targeting kids) justice? WHY NOT? 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! NO Paperless Ticket – to my mobile perhaps? NO Change my booking – I’m late, that’s great! NO ‘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! ‘Click to call’ WHY? To find PLEASE! out when you do Great! So what’s I cant write it the mobisite well? their number or down & then call.. URL? I am mobile!

Mobile is powerful – use it! Give users the choice!

Facebook mobile... Kulula style!!! 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 CENTRELess is more on mobile...? NOT TRUE!

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 IntegrationYouTube 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 + hardware Mobile experience can add more relevance by using location as hooks. Find and interact withAugmented reality friends while skiing!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 contentBrands shown are for demonstration only

Application or Mobi?In Africa – spend carefully!

App v Mobi - We are not the US!Don’t believe the hype... South Africa is very different! Less important US DATA – NOT SA DATA

App v Mobi - We are not the US!Don’t believe the hype... South Africa is very different! Less important

Think of the SA market... only 150k iPhones in SA! (40% active app users = 60,000 + 20,000 iPads max!)

HANDSET PENETRATION - South Africa45.0% 39.8%40.0%35.0% 29.9%30.0%25.0%20.0% Samsung 29.9%15.0% Nokia 39.8%10.0% 7.7% 5.9% 4.6% Smartfone = 8% 5.0% (will grow eventually) 3.0% 2.0% 0.9% 0.8% 0.4% 0.0% Nokia Samsung SonyEricsson LG RIM Motorola Apple HTC Openwave MAUI * Source Admob July 2010

Apps can help exposure... Let the stores to the work!

20 Million Nokia handsets in SA....100+ Devices

NOKIA Ovi – EntertainmentAfrica.com250,000 downloads – March 2011

APPs for all platforms Nokia OviFor max penetration: In this order.... Blackberry(depending on target market) Android iPhone Sorry, had to kill these images as apps are in iPad development and Windows Mobile (will become more important) 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... MSISDN + PROFILING You can personalise USSD and be RELEVANT XXXXX MOBi: Hi Subusiso Select Options Hi Subusiso SMS 1 – Register The latest XXX 2 – News Alerts newsletter is 3 – Competitions Out! Click HERE 4 – Refer Friend -------------------- or reply and Reply you could win a R500 voucher

Your mobi must be a great user and brand experienceand perform beautifully regardless of the device

You must focus on ‘context’ before considering contentBe relevant and give users a reason to come back

Dont cut back on usefulness(kulula ;) give people the choiceMobile is THE channel for 24/7 engagement in SA

MOBILISE properly!Making things smaller is just not enough!

So don’t F*%k it up for the rest of us ;)

timprezenceTim Bishoptim@prezence.co.za

http://www.heavychef.com	90
http://markpretorius.com	6
http://www.markpretorius.com	3
http://10.1.254.16:15871	2
url_unknown	1

Heavy Chef March: Building Great Mobisites

by The Heavy Chef Project

Accessibility

Categories

Upload Details

Usage Rights

5 Embeds 102

Statistics