In a landrush to go mobi... It is essential Brands and publishers are aware of the challenges and the very different approach they must take to mobilise their brands properly within Africa. We look at who is doing it well and who could do better. The Prezence Digital approach addresses our extensive technology built for handset adaptation as well as the most important elements of mobie design - User Experience and the Context of the mobile user (Context before Content). Prezence Digital - Mobile for the (African) masses!

1. timprezence
Tim Bishop
tim@prezence.co.za

2. Only a 2 million cross-over
= 10 million more people
12 million on mobile web
6 million on desktop web

3. has spoken!
...the numbers say it all

4. 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%

5. So who are these mobile
web users in SA?

6. 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

7. What exactly is a ‘Mobi’
device anyway?

8. 6000+ of these things!
A non-desktop device, that due
to its size and context of
use, needs to be treated
differently

9. Mobi building is complex
It is not the same as web!

10. Bliss! - The luxury of web design!
Lots of space, a few browsers and easy input controls

11. F*%k - The problems of mobi design
No space, 6000 devices(more variants) crude input controls

12. The first considerations
(especially in SA) Speed and cost

13. 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!
Maximum
mobi page
target size of
35 Kilobytes 15 secs 6 secs 3 secs >2 secs
+

14. 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 customers
Lower rates are available for bundles or contract customers
Only deliver the content they need or ask for!

15. Size, length and width
IS important!

16. No really.... with mobile
size IS important!

17. Unlike web: One size does not fit all!
If you build your mobi to cater for small phones...
Samsung E250 - 128 pixels wide

18. One size does not fit all!
It is unusable on larger ones!
Blackberry 9000 - 480 pixels wide
?
?

19. One size does not fit all!
If you build for larger phones...
Blackberry 9000 - 480 pixels wide

20. 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!

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

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

23. One very important thing
that is always overlooked

24. TOUCH The rules change yet again...
Fingers are not matchsticks
So leave room!

25. TOUCH What to give your users...
Menu space clickable areas large buttons more links

26. There are many challenges
when building for mobile

27. So many devices
So many screen sizes
So many browser types
So many file formats
So many device manufacturers
So many connection speeds
So many platforms and op systems
Touch or cursor inputs...
So much to deal with before we
even start considering the design!

28. Mobilising the masses...
We start with technology

29. 6000+ different devices =
HCA
Handset Content
Adaptation
6000 mobi sites

30. Some real world examples
Who could do better?

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

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

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

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

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

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

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

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

39. Handset downscale and upscaling
Perfect rendering to all handsets
Touch aware and layout adaption
Dynamic image resizing/optimising
Handles compatible file delivery
HCA

40. Deliver perfect experiences
...regardless of handset

41. Multimedia VIDEO
Easy, small and low quality... NO!
The ideal experience
SK (2) We are encoding
20 variants per trailer
for perfect experience!

42. Future proofing with HCA NEW Blackberry
TOUCH
NEW Samsung
WAVE
NEW ANYTHING!

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

44. 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!

45. (Content) CONTEXT is KING
They may be on the loo!

46. ‘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!

47. 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!

48. Mobile design approach...
...its a little cramped!

49. Mobi design = organising a tiny desk
Place the most important things
close by and work outwards

50. Hierarchy design computicket.mobi
W/W/WHEN
LOGIN
OR REGISTER
EVENT DETAIL
BOOKING DETAIL
MORE INFO
MAIN CATEGORY
STOREFINDER
GEOMAPPING
CALL US
CLICK TO CALL
TERMS+CONS
DISPLAY/ACCEPT
ALL EVENTS
W/WHERE/WHEN
BUS/TRAVEL
HOME PAGE
LESS IMPORTANT
LESS IMPORTANT
HIGHLIGHTED
EVENTS
SEARCH ALL
EVENTS
MAIN
ACTION
AREA
MAIN
ACTION
AREA
70% OF
BOOKINGS

51. MOBILISE...
Do not MINIATURISE

52. User’s need FAST snacky info + Nav
Remember CONTEXT - Make it OBVIOUS AND EASY...

53. Make a click meaningful
...use Action Areas

54. 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 change
Cursor Nightmare!
Top menus
Each click shows a clear change on each page refresh

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

56. 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

57. Easy mobi publishing...
Use a single cms platform

58. Single content upload..
Multiple automated deployments
Sterkinekor.com
mobile.Sterkinekor.com

59. Computicket.mobi
launching in October 2010
Computicket.com
Computicket.mobi

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

61. • 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

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

63. EntertainmentAfrica.mobi
EntertainmentAfrica.com

64. 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

65. Mobi is a brand touchpoint
It should look the part!

66. Mobi should leave a great impression
When built properly, your mobi site
will be a perfect brand ambassador

67. So why are great brands
getting it so wrong?

68. CocoPops did everything right....
Does this mobisite do a great brand
(targeting kids) justice? WHY NOT?
except the mobisite!
Great engagement opportunity lost?

69. Personalisation helps UX
Know who your users are!

70. If you know who is visiting....
Pre-select favourite
cinema, regions, events or genres to
make UX better!
You can personalise!MSISDN + PROFILING

71. Application v Mobi?
In Africa – spend carefully!

72. 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

73. Think of the SA market...
only 100k iPhones in SA!
(20% active app users = 20,000 + 27 iPads!)

74. 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
South African handset penetration
Smartfone = 6%
Samsung 29.9%
Nokia 39.8%

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

76. NOKIA Ovi – EntertainmentAfrica.com

77. (Social) power to the people!
Giving the nation a voice

78. 0
5
10
15
20
25
30
page views per unique browser
page views per session
Power of social interaction: Stickiness

79. Getting it right in Africa: That’s AYOBA
Context
Content
UGC
Voting polls
Commentary
Sticky Social
“Is the Tswana Derby better to
watch than the Soweto derby
these days?”

80. • My profile
• My inbox
• My friends
• My wall
• My albums
• My picture
• My photos
The language of Africa: That’s AYOBA

81. Location location location
Proximity brings relevance
(Where I am and where my friends are is important)

82. Location based social – network + hardware
Mobile social networks can add more
relevance by using location as hooks.
Find and interact with
friends while skiing!Augmented reality
location SM apps

83. Grow a social network...
Just add water $50!

84. Mobile Social Media in a box: Motribe
“When you can’t always speak to your brand fans...
Let them speak to each other!”

85. Mobile Social Media in a box: Motribe
“Gather your brand fans together to engage with
you and socialise with each other!”

86. and perform beautifully
regardless of the device
Your mobi must be a great
user and brand experience

87. Be relevant and give users
a reason to come back
You must focus on ‘context’
before considering content

88. Mobilise properly...
Just making it smaller
is not enough!

89. timprezence
Tim Bishop
tim@prezence.co.za