Understanding the people behind the screen

1. INTERNET WORLD 2013
Mobile UX:
We’re still human
--------------------
UNDERSTANDING
THE PEOPLE
BEHIND THE SCREEN
1

2. What we’ll be covering
With mobile and tablet now Who are we designing for?
accounting for 10 -20% of Understanding the design target and context
traffic to most websites its scenarios
increasingly important that
mobile user experience is as Our “take anywhere” electronic friend
good as desktop. How to build better experiences by understanding
human relationships
I’ll cover some practical
approaches to help you It’s all in the memes
design better mobile user Why the principles of memetics are important to
experience, with case mobile UX designers
studies from the field
Test with real users and real devices
Some experiences from the field

4. Which of these devices
are you designing for?

5. None of them. You are designing for
the human holding it.

6. Spot the difference?
o Sat down in a familiar location o Stood up – and on the move
o Alone in a quiet room o Surrounded by other people
o Concentrating hard o Lots of sensory distractions
o Concentrating on something else (not missing
o Plenty of time to do what she wants
his train)
o Typing with both hands o Fitting what he’s doing into an idle moment
o Has full access to everything in her o Holding the device with one hand
office and on her computer
o Only has access to what he is carrying

7. Takeaway
The most important difference
between mobile and desktop UX is the
human holding it and the situation
they are in, not the device.

8. Lewis Silkin: Mobile UX design for user context
Designing a responsive website
for a leading UK law firm
Mobile and tablet important as
clients are at executive and C-
level, and often spend
protracted periods away from
their desks.
First step was to understand
the context and usage – how
does web and mobile-web fit?

9. First understand how the business operates
Business insights
People buy legal services based on
reputation and personal relationships
They buy into an individual, not just the
firm that person works for
Sales do not happen online, you do not
add legal services to a shopping basket
and go to the checkout
Digital needed to support the offline
business, not replace it

10. Lewis Silkin: Mobile UX design for user context
Mapping out the customer journey helped us to
understand where mobile web could make a difference
Telephone Email Mobile-web Face-to-face
“We’re interested “I’ll send you an 2 days later “Hi Simon.. I was just
in legal services email to confirm Diary reminder: reading your journal
for marketing. and a link to your meeting with Lewis post – really
Yes, sure I’d love to Simon’s profile.” Silkin is in 30 minutes. interesting stuff.”
meet Simon.”
“Who is this guy I’m
meeting – what’s he like?

11. Our “take anywhere” electronic friend

12. “ Your plastic pal who’s fun
to be with ”
--------------------------------------
Sirius Cybernetics Corporation's definition of a
robot, Hitch Hikers Guide to the Galaxy

13. Our new friend is not complicated
“At 18 months old, my
son already knows
how to do the iPhone
swipe. Luckily he
doesn't know the
password to unlock
my phone just yet.”
Kari Aakre, Intel employee

14. Our friends are a constant source of entertainment

15. Phones are becoming more human

16. 1984: science fiction
“ Hello Computer? ”

17. 2012
2012: reality

18. We like positive feedback from our friends

19. Putting some of these approaches together...

20. State Library of Queensland
The challenge
o Parents bring kids to the library and
dump them in the kids corner
o Often they leave them their
Smartphone or Tablet to play with
whilst they go round
o Can we entertain and educate those
kids using that device whilst their
parents are off doing stuff?

21. State Library of Queensland

22. State Library of Queensland
o Augmented reality activities
o Encouraging real world exploration
o Multi-modal input
o Avatar characters
o Instant feedback

23. Takeaway
Think of your
website/app/
service as if it
is a human
----------------------
How would they behave if
they wanted to make
friends with the end user?

24. Takeaway
“Ideate in the wild ”
“Ideate in the wild”
Rachel Hinman, Senior Research Scientist, Nokia
“Pretend it’s magic”
Alan Cooper, usability extraordinaire

25. It’s all in the memes

26. Sorry LOL cats...
You are amusing but not useful to a UX designer

27. Memes in society
Memes are concepts that spread within
society without any central organisation
Memes evolve through transmission

28. Memes in technology
Memes are also found in interface design –
physical, software and web
They provide familiar idioms, controls and learned
behaviours ... And they also evolve

29. But .. aren’t you talking about design patterns?
Design patterns are not memetic
– in fact they put a brake on the
evolutionary process

30. Takeaway
“Memetic” interfaces are more
important on mobile
------------------------------------------
No space to explain functions with labels, no hover
states – the most intuitive interfaces are those that
offer an evolution from learned behaviours

31. Memetic interface design in the wild
“Friending”
A concept invented in the mid
90s, copied and evolved by social
networks ever since.
“Follow”
A concept popularised by Twitter;
evolved from Friending and now evolving
elsewhere as a personalisation tool

32. European Medicines Agency
The challenge
50,000+ HTML pages
2.5m documents
Mobile must offer 100% of content
The users
Mainly EU pharmaceutical industry.
Very frequent visits (often more than
once a day), people learn the
navigation.
Not general browsing – specific things
they are looking for or specific places
to check for updates.

33. European Medicines Agency: “Memetic” mobile navigation

34. Memetic UI concepts make a system more intuitive
Menu icon and fly-in behaviour
+/- to expand and close, click
title to go open page

35. Testing with real users and real devices

36. Ministry of Justice
Ministry of Justice “Can I get
legal aid?” tool.
Research showed that target audience (C2DE) were
actually quite likely to be using a smartphone or tablet.
20% of access to Gov.uk is now mobile / tablet.
Important to test on these devices with real users –
don’t just flick through screens and think “oh, it’s all
there”. Testing focussed on interaction –
buttons, swiping, scrolling.
Findings:
• Scrolling through long pages was annoying
• ‘Unexpected’ page reloads were disorientating
• “What happens if I press this button?” – mobile users
like to experiment – let them undo operations

37. Takeaway
Test on real devices with real users
------------------------------------------------------------------------------------
Don’t rely on desktop/mobile emulators or shrinking your
browser to see what happens

38. Closing thought:
Mobile is just a tool
that allows humans to do something

39. Questions?
Ian Huckvale – Head of user engagement
B.Eng Computing (Imperial College, London)
Get in touch:
Email: ian.huckvale@readingroom.com
Twitter @IanHux
Blog: blog.readingroom.com
Interests:
• Digital strategy, user experience, information
architecture, usability, accessibility, mobile, social
media
• Outside work: cooking, rowing, fencing
Reading Room
65-66 Frith Street
Soho
London
W1D 3JR
www.readingroom.com