Slides from my presentation on Mobile User Experience at the J Boye Web & Intranet Conference 2014 in Philadelphia

1. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Elements of the
Mobile User Experience
Lyndon Cerejo
J. Boye Web & Intranet Conference
Philadelphia, May 2014

2. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
ABOUT LYNDON
UX Lead for Capgemini
Rapid Design & Visualization
14 years
www.linkedin.com/in/lycerejo/
http://bit.ly/appgraveyard
Gave up on Inbox Zero a long time ago
Author, writer

3. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
“Build Us A Sexy App“
“Help me understand what you mean“
Sexy = look and feel, visual design
Important, but only one of many aspects that impact the user experience
UI = UX
UX is...

4. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Building A Sexy App
Enjoyable Mobile
User Experiences
Understand Mobile User Experience
Review Elements with examples
How you can use it
Links to detailed write up and resources at the end

5. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
MOBILE USER EXPERIENCE
A user’s perceptions and feelings before, during and after their mobile interaction
using a mobile device
Breaking it down
12 elements
( not all may apply )
Let’s dig into each!

6. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Functionality
Tools and features that enable users to complete tasks and achieve their goals
Core functionality
Mobile optimized
Relevant to category
All channel experience
kayak

7. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Information Architecture
Arranging the functionality and content into a logical structure to help users find
information and complete tasks. Includes navigation, search and labeling
Main features on landing page
Concise, clear, consistent, descriptive
labels
Navigational cues
Design for touch

8. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Content
Various types of material in different formats, such as text, images and video, that
provide information to the user.
Balanced content mix
User control over media (no auto-start)
Mobile appropriate content (chunk,
scale images)
Pictures, video as appropriate
supportive content
Product information Marketing Content
Social
Content

9. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Design
The visual presentation and interactive experience of mobile, including graphic
design, branding and layout
Glanceability and quick
scanning
Visual flow
Orientation
Cross channel visual
consistency
iOS Weather Yahoo! Weather

10. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net

11. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
User Input
The effort required to enter data, which should be minimized on mobile devices
and not require the use of both hands
Minimize input
Smart defaults
Alternate mobile input
Appropriate keyboards

12. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Mobile Context
The environment and circumstances of usage, which can change constantly and
rapidly.
Common examples are distractions,
multitasking, motion, low lighting and
poor connectivity
Use device capabilities
User-provided information
User preferences & settings
http://www.giantant.com/antenna/2007/06/design-sketch-the-context-of-m.html
Nadav Savio

13. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Usability
An overall measure of how well the information architecture, design, content and
other elements work together to enable users to accomplish their goals.
Affordance
Tap sized & spaced
Conventions &
platform standards
Contrast, color,
typography and font
size
Luke W,
Mobile First

14. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Trustworthiness
The level of confidence, trust and comfort that users feel when using a mobile
website or app.
Privacy & Security concerns
Ask permission
Explain business practices
Mobile friendly legalese
Give users control

15. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Feedback
Methods for attracting the user’s attention and displaying important information
Minimize number of alerts
Brief and clear message with
options
Onscreen feedback and
confirmation

16. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Help
Options that are available to assist the user in using the website or app.
First launch guide ( w/ skip)
Multiple help options (@AskCiti)
Global and contextual help
Optimize click-to-call
Weathercube

17. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Social
Content and features that create a sense of social participation, that enable user
interaction and that facilitate sharing on established social networks.
Incorporate social presence and
activity on site
Generate content with your brand
Shareable content
Seed content
Red Robin Customizer
@Tweetacoffee

18. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
Marketing
Methods by which a user finds a website or app and the factors that encourage
repeated usage.
Optimizing for mobile search and
discovery
QR codes to mobile optimized
page
Promote app in other channels
Prompt for ratings reviews (w/
“don’t remind me”)

19. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
PUTTING THE ELEMENTS TO WORK
During Design, Reviews &
Evaluations
Personalizeit for your users,
industry, competition
Framework as a starting point
(DigitalGov: http://bit.ly/digitalgovmux)
Ongoing updates

20. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
QUESTIONS
?
RELATED RESOURCES
bit.ly/muxelem
(detailed article, links to books, articles and further reading)

21. Lyndon Cerejo | lyndon.cerejo@capgemini.com | @lycerejo Strategist.Net
THANK YOU!