Mobile UX
91
Refresh Bellingham Mobile User Experience Nick Finck August 18, 2010
-
Upload
nick-finck -
Category
Documents
-
view
3.042 -
download
0
description
A 45 minute presentation I did for Refresh Bellingham on Mobile User Experience.
Transcript of Mobile UX
Refresh Bellingham
Mobile User ExperienceNick FinckAugust 18, 2010
?Who the f#@k is this dude?
‣ Principal & Director of User Experience
‣ Over 15 years of experience working in the web field
‣ Has worked with Adobe, Boeing, CBS, Cisco, CitiGroup, Comcast, Fandango, FDIC, HP, IBM, and Microsoft
‣ Co-organized and curated more than 10 national and international web conferences & events
‣ Judged the Webby’s and several other web awards
‣ Founder of Digital Web Magazine
‣ Expertise in information architecture, interaction design, and user research
Blue FlavorNick Finck
‣ BlueFlavor.com
‣ NickFinck.com
‣ Google “Nick”
Outline‣ Some bullshit about me
‣ Re-thinking computing
‣ Some technical examples
‣ A deep dive into mobile
‣ Really cool shit
The way we think about computing
A mobile phone is now used more for data than
actual phone calls
New York TimesJenna Worthham May 13, 2010
Photo by Rion Nakayahttp://www.flickr.com/photos/rion/47437262/
The iPad reached more than one million units sold in half the
time it took the iPhone
Yahoo NewsBen Patterson May 3, 2010
We need to change the way we think about the Web
The User Experience of Mobile
The is no One Web
There are many contexts
Mobile should not be first
Lets Get Technical!
Fitts’s Law
In ergonomics, Fitts's law is a model of human movement which predicts the time required to rapidly move to a target area, as a function of the distance to the target and the size of the target.”
Description of Fitts’s LawWikipedia
“
Not so good
Way better
Optimized Markup
digital-web.comScreen based CSS & Print based CSS
Developing for the Mobile Context
• XHTML✓Well formed✓Semantically correct✓Highly optimized
• CSS✓Handheld media type (sometimes even screen media type)✓Highly optimized
NYTimes.comMinimum 30 Seconds to lo load 796kbplus requests to multiple servers
NY Times on LeafletMaximum of 7 seconds to lo load 30kb
http://nytimes.com http://app.getleaflets.com/nyt/
Non-optimized header markup
Highly optimized header markup
Optimized UI
Non-optimized UI
Highly optimized UI
A Deep Dive into Mobile Web
Content
Readability & Page Width
The problem
Unreadable
Must zoom
UnreadableAgain
Text does not fit within screen
Possible solutions
Readablewithoutzooming
Fits perfectly within screen
Readablewithoutzooming
Text fits on screen
Interaction
Navigation
The problem
Navigation
Hotspots visible & clickable only after zoomed 10x
Content issomewhere way the fuck up here
Navigationcould havelargerhotspots
Microscopichotspots
Barelynavigable
Possible solutions
Navigationalong sidethe content
Nice bigand juicy hotspots
Super sizehotspots
Visuallycalled outnavigation
Use largerheadings &visual hints
Pagination
The problem
The world’ssmallestpagination
A possible solution
Excellentpaginationsolution
Search
The problem
A possible solution
A perfectcase forsearch ahead
Buttons
The problem
Very typicalweb button
Possible solutions
Big ass buttons!
555-5555
Designedwith thespecificcontext inmind
Calls to Action
The problem
Calls to action are lost in page
A possible solution
Make calls to actionvery obvious
?What is Next?
LegoAugmented Reality Kiosk
ToyotaAugmented Reality Advertisement
ARhrrrrAugmented Reality Game
InsqribeLocation Based Augmented Reality
Nintendo WiiMotion based gaming
Microsoft SurfaceSurface-based computing
Microsoft’s Project NatalController-less Interface
Minority Report20th Century Fox
Oblong's g-speakSpatial Operating Environment
Sixth SenseWearable Gestural Interface
We have just barely begun to understand
the potential of Mobile
Thank you!
?Questions
Refresh Bellingham
Mobile User ExperienceNick [email protected] Flavor - http://blueflavor.comPersonal - http://nickfinck.com
