際際滷

際際滷Share a Scribd company logo
Bridging the Mobile Design Gap

                           Midwest UX Conference
                                    June 1, 2012

JEN MATSON
     @nstop
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
FAIL #1: The Content Kiss-Off
Source: http://wtfmobileweb.com
FAIL #2: The Eyestrain Special




                                 Source: http://wtfmobileweb.com
Bridging the Mobile Design Gap
FAIL #3: The Slow Load to Nowhere
Source: http://wtfqrcodes.com
FAIL #4: The Inappropriate Code Scan




                                       Source: http://wtfqrcodes.com
Bridging the Mobile Design Gap
FAIL #5: The Unwelcome Splash
Bridging the Mobile Design Gap
FAIL #6: The Permanent Roadblock
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Photo: Robert Couse-Baker (Flickr)
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
LESSONS



Content Strategy
  Governance
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
LESSONS



Styled Content
  Restraint
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
LESSONS


         Site Performance
         Layout Flexibility
Designing for Hardware Capabilities
Photo: swanksalot (Flickr)
Source: http://www.joelonsoftware.com/articles/fog0000000037.html
Source: http://www.instructables.com/id/Make-a-portable-barcode-scanner-with-an-arduino-an/step7/Declaw-CueCat/
LESSONS



Hardware Hacking / Maker Culture
   Path of Least Resistance
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
LESSONS


Complex Animation
In-Browser Games
 In-Browser Video
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
Bridging the Mobile Design Gap
LESSONS



Progressive Enhancement
 Capabilities Detection
Bridging the Mobile Design Gap
Source: http://dashes.com/anil/2012/04/why-you-cant-trust-tech-press-to-teach-you-about-the-tech-industry.html
WHAT IS THE WEB TO YOU?
Reporting,                              Monetizing,
communicating,                          leveraging,
connecting                              converting



Exploring,                              Adapting,
experimenting,                          learning,
expressing                              struggling
                                        Top left photo: Mr T. in DC (Flickr)

                 Bottom right photo: Marshall Astor - Food Fetishist (Flickr)
Bridging the Mobile Design Gap
$$$$
Bridging the Mobile Design Gap
Try On A Different POV
Share Your Mistakes
  Know Your History
THANK YOU
JEN MATSON |        @nstop
    jenmatson.com

More Related Content

Bridging the Mobile Design Gap