Giles Phillips discusses the challenges and opportunities of mobile UX for web pages, emphasizing the need for optimization given the limitations of small viewports and the importance of efficient navigation and content presentation. He advocates for designing with intent and understanding user scenarios, focusing on quick, task-driven interactions rather than sustained engagement. Key strategies include minimizing load times, using succinct labels, and adapting to mobile-specific affordances.

1. Giles Phillips - @gilesphillips
Notes on mobile UX

2. Web pages are clickable newspapers

3. The concepts map,
but the design isn’t
optimized

4. Newspapers have
pretty large viewports
You can fit lots of content

5. HEADER

6. HEADER + LOGO
PAGE HEADLINE
IMAGE AND CAPTION
COLUMN
COLUMN
COLUMN
COLUMN
important messaging

7. HEADER + LOGO + GLOBAL NAV
PAGE HEADLINE
IMAGE AND CAPTION
SECONDARYNAV
COLUMN
COLUMN
SIDEBARNAV
important annoying message

8. HEADER + GLOBAL NAV
PAGE HEADLINE
SECONDARYNAV
SIDEBARNAV
annoying message!!

10. Newspapers are also highly mobile
But sort of hard to read this way...

11. Too bad this doesn’t fold up

12. mobile devices have created a
revolutionary new medium

13. KVM (Keyboard, Video, Mouse)
is a transitional interface

14. Somewhere between dials and knobs...

15. ...and
natural
human
interaction

16. Mobile is more natural: touch & voice inputs
Carried on the body, mobile extends us
We’ve become Cyborgs

17. mobile is disrupting the user experience:
design paradigms,
constraints,
metaphors

18. Design is creation for use
Design has intent
Expressing intent as simply as possible
is good design
OPTIMIZE

19. OPTIMIZING MOBILE UX - FORM FACTOR
• Small viewport = limited screen real estate
- Old nav paradigms not efficient, use new lighter models
- Shorten content for affordances and headings
• Make your affordances big (40x40px +10 px)
• Hovers = fail
• Popups stink
• Reference the platform interface guidelines

20. OPTIMIZING MOBILE UX - PERFORMANCE
• Load times are just as important as ever
• Minimize payload - including using the UX to
break up requests
• Perceived performance as an element
of your user experience

21. OPTIMIZING MOBILE UX - CONTEXT OF USE
• Map your user scenario & touchpoint
• Design for a 1-minute timebox
• Divided attention, not sustained attention
• Mobile usage is not about engagement
- Usage tends to be destination-driven
- The completion of a specific task
- Responding to an alert or checking update

22. OPTIMIZING MOBILE UX - CONTENT
• Different labels work better on mobile
• Always be succinct
• Map or storyboard your content along a linear
sequence