SlideShare a Scribd company logo
1 of 158
1


Thursday, November 29, 12
MULTI-DEVICE
                     DESIGN STRATEGY




                      WARM GUN 2012   LUKE WROBLEWSKI




                                                        1


Thursday, November 29, 12
MULTI-DEVICE
                     DESIGN STRATEGY




                      WARM GUN 2012   LUKE WROBLEWSKI




                                                        1


Thursday, November 29, 12
2
Thursday, November 29, 12
4.3”




         Motorola Droid
            RAZR M



                            2
Thursday, November 29, 12
4.3”


             Screen: 4.3" with 960 x 540 & 256 ppi
             Browser: Chrome for Android (Chrome 18)
             OS: Google Android 4.0

         Motorola Droid
            RAZR M



                                                       2
Thursday, November 29, 12
4.3”




         Motorola Droid
            RAZR M



                            2
Thursday, November 29, 12
4.3”                5.5”




         Motorola Droid     Samsung Galaxy
            RAZR M              Note II



                                             2
Thursday, November 29, 12
4.3”                5.5”


                                 Screen: 5.5" with 720 x 1280 & 276 ppi
                                 Browser: Android Webkit
                                 OS: Google Android 4.1 (modified)

         Motorola Droid     Samsung Galaxy
            RAZR M              Note II



                                                                          2
Thursday, November 29, 12
4.3”                5.5”




         Motorola Droid     Samsung Galaxy
            RAZR M              Note II



                                             2
Thursday, November 29, 12
4.3”                5.5”              7.9”




         Motorola Droid     Samsung Galaxy
            RAZR M              Note II      Apple iPad Mini



                                                               2
Thursday, November 29, 12
4.3”                5.5”              7.9”


                                                   Screen: 7.9" with 768 x 1024 pixels and 163 ppi
                                                   Browser: Apple Safari 6
                                                   OS: iOS 6

         Motorola Droid     Samsung Galaxy
            RAZR M              Note II      Apple iPad Mini



                                                                                             2
Thursday, November 29, 12
4.3”                5.5”              7.9”




         Motorola Droid     Samsung Galaxy
            RAZR M              Note II      Apple iPad Mini



                                                               2
Thursday, November 29, 12
4.3”                5.5”              7.9”          12.5
                                                                 ”




         Motorola Droid     Samsung Galaxy
                                             Apple iPad Mini   Dell XPS 12
            RAZR M              Note II



                                                                             2
Thursday, November 29, 12
4.3”                5.5”                 7.9”                       12.5
                                                                                 ”

                                             Screen: 12.5" with 1920 x 1080 pixels
                                             Browser: Internet Explorer 10
                                             OS: Microsoft Windows 8 RT

         Motorola Droid     Samsung Galaxy
                                                Apple iPad Mini                Dell XPS 12
            RAZR M              Note II



                                                                                             2
Thursday, November 29, 12
4.3”                5.5”              7.9”          12.5
                                                                 ”




         Motorola Droid     Samsung Galaxy
                                             Apple iPad Mini   Dell XPS 12
            RAZR M              Note II



                                                                             2
Thursday, November 29, 12
PC                                     Desktop Internet      Mobile Consumer
               100M+                                  1B+                   10B+




       1990                                 2000                     2010                2020



                            Source: Morgan Stanley Research                                   3


Thursday, November 29, 12
3”           5”    7”   9”   11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                      4
Thursday, November 29, 12
SMARTPHONE




         3”           5”    7”   9”   11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                      4
Thursday, November 29, 12
SMARTPHONE




                            5
Thursday, November 29, 12
SMARTPHONE




                               3.5”




                            iPhone 3GS




                                         5
Thursday, November 29, 12
SMARTPHONE




                              3.1”        3.5”




                            Palm Pre   iPhone 3GS




                                                    5
Thursday, November 29, 12
SMARTPHONE




                              3.1”        3.5”         3.7”




                            Palm Pre   iPhone 3GS   HTC Nexus One




                                                                    5
Thursday, November 29, 12
SMARTPHONE




         3”           5”    7”   9”   11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                      6
Thursday, November 29, 12
TABLET
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                          6
Thursday, November 29, 12
TABLET




                            7
Thursday, November 29, 12
TABLET




                              9.7”




                            Apple iPad




                                         7
Thursday, November 29, 12
IPAD




                            Source: http://www.lukew.com/ff/entry.asp?1640   8


Thursday, November 29, 12
IPAD
                            94%             of tablet traffic
                                            May 2012




                            Source: http://www.lukew.com/ff/entry.asp?1640   8


Thursday, November 29, 12
IPAD
                            94%             of tablet traffic
                                            May 2012

                            98%             of tablet traffic
                                            Sept 2012




                            Source: http://www.lukew.com/ff/entry.asp?1640   8


Thursday, November 29, 12
IPAD
                            94%             of tablet traffic
                                            May 2012

                            98%             of tablet traffic
                                            Sept 2012

                            91%             of tablet traffic
                                            on Web




                            Source: http://www.lukew.com/ff/entry.asp?1640   8


Thursday, November 29, 12
TABLET
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                          9
Thursday, November 29, 12
TABLET          LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                          9
Thursday, November 29, 12
DESKTOP



                                 TABLET          LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”       27”




                                                                                          9
Thursday, November 29, 12
DESKTOP



                                   TABLET          LAPTOP
  SMARTPHONE




         3”           5”      7”       9”   11”   13”   15”   17”   19”   21”   23”   25”       27”

                            WEB SITE




                                                                                            9
Thursday, November 29, 12
DESKTOP



                                   TABLET          LAPTOP
  SMARTPHONE




         3”           5”      7”       9”   11”   13”   15”   17”   19”   21”   23”   25”       27”

      MOBILE                WEB SITE




                                                                                            9
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           10
Thursday, November 29, 12
SMARTPHONE




                            11
Thursday, November 29, 12
SMARTPHONE




                            3.5”




                            iPhone 3GS




                                         11
Thursday, November 29, 12
SMARTPHONE




                            3.5”          4.0”




                            iPhone 3GS   HTC Windows
                                           Phone 8S



                                                       11
Thursday, November 29, 12
SMARTPHONE




                            3.5”          4.0”           4.3”




                            iPhone 3GS   HTC Windows   Motorola Droid
                                           Phone 8S       RAZR M



                                                                        11
Thursday, November 29, 12
SMARTPHONE




                            3.5”          4.0”           4.3”              4.5”




                            iPhone 3GS   HTC Windows   Motorola Droid   Nokia Lumia 920
                                           Phone 8S       RAZR M



                                                                                          11
Thursday, November 29, 12
SMARTPHONE




                            3.5”          4.0”           4.3”              4.5”             4.7”




                            iPhone 3GS   HTC Windows   Motorola Droid   Nokia Lumia 920   LG Nexus 4
                                           Phone 8S       RAZR M



                                                                                                   11
Thursday, November 29, 12
4.3”                  4.5”             4.7”




      Motorola Droid        Nokia Lumia 920   LG Nexus 4
         RAZR M



                                                           12
Thursday, November 29, 12
4.3”                  4.5”             4.7”              5.3”




      Motorola Droid        Nokia Lumia 920   LG Nexus 4   Samsung Galaxy Note
         RAZR M



                                                                                 12
Thursday, November 29, 12
4.3”                  4.5”             4.7”              5.3”                    5.5”




      Motorola Droid        Nokia Lumia 920   LG Nexus 4   Samsung Galaxy Note   Samsung Galaxy Note II
         RAZR M



                                                                                                 12
Thursday, November 29, 12
MOBILE




                            Source: http://www.lukew.com/ff/entry.asp?1640   13


Thursday, November 29, 12
MOBILE                        Android
                            29%
                                           smartphones sold
                                           in last 3 months
                                           were over 4.5”




                            Source: http://www.lukew.com/ff/entry.asp?1640   13


Thursday, November 29, 12
MOBILE                        Android
                            29%
                                           smartphones sold
                                           in last 3 months
                                           were over 4.5”

                            5M              iPhone5 (4”)
                                            sales in first 24
                                            hours




                            Source: http://www.lukew.com/ff/entry.asp?1640   13


Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           14
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           14
Thursday, November 29, 12
TABLET




                            15
Thursday, November 29, 12
TABLET




                              9.7”




                            Apple iPad




                                         15
Thursday, November 29, 12
TABLET




                              9.7”       10.1
                                          ”



                                         Lenovo ThinkPad Tablet 2
                                         Acer Iconia Tab W510
                                         Dell Latitude 10
                                         Dell XPS 10
                            Apple iPad   Asus Vivo Tab RT




                                                                    15
Thursday, November 29, 12
TABLET




                              9.7”




                            Apple iPad




                              16
Thursday, November 29, 12
TABLET




                                8.9”           9.7”




                            Kindle Fire HD   Apple iPad




                                               16
Thursday, November 29, 12
TABLET




                                 7.9”             8.9”           9.7”




                            Apple iPad Mini   Kindle Fire HD   Apple iPad




                                                                 16
Thursday, November 29, 12
TABLET




                                 7.0”             7.9”             8.9”           9.7”




                            Google Nexus 7   Apple iPad Mini   Kindle Fire HD   Apple iPad




                                                                                  16
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           17
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           17
Thursday, November 29, 12
LAPTOP




                            18
Thursday, November 29, 12
LAPTOP




                                 11”




                            Apple Macbook Air




                                                18
Thursday, November 29, 12
LAPTOP




                                 11”                 13”




                            Apple Macbook Air   Apple Macbook Air




                                                                    18
Thursday, November 29, 12
LAPTOP




                                 11”                 13”                 15”




                            Apple Macbook Air   Apple Macbook Air   Apple Macbook Pro




                                                                               18
Thursday, November 29, 12
13”              15”




           Apple Macbook Air   Apple Macbook Pro




                                                   19
Thursday, November 29, 12
13”              15”                 17”




           Apple Macbook Air   Apple Macbook Pro   Apple Macbook Pro




                                                                       19
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           20
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           20
Thursday, November 29, 12
DESKTOP




                                      21
Thursday, November 29, 12
DESKTOP




                                          17”




                                      Samsung Display




                                                        21
Thursday, November 29, 12
DESKTOP




                                          17”               19”




                                      Samsung Display   Samsung Display




                                                                          21
Thursday, November 29, 12
DESKTOP




                                          17”               19”




                                      Samsung Display   Samsung Display




                                                                          21
Thursday, November 29, 12
17”             19”




             Samsung Display   Samsung Display




                                                 22
Thursday, November 29, 12
17”             19”               21”




             Samsung Display   Samsung Display   Samsung Display




                                                                   22
Thursday, November 29, 12
23
Thursday, November 29, 12
21.5
                              ”




                            Apple iMac




                                         23
Thursday, November 29, 12
21.5         27.5
                              ”            ”




                            Apple iMac   Apple iMac




                                                      23
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           24
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           24
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           24
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           24
Thursday, November 29, 12
DESKTOP



                                 TABLET          LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”        27”




                                                                                          25
Thursday, November 29, 12
DESKTOP



                                 TABLET          LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”   23”   25”        27”
        PALM




                                                                                          25
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”   23”   25”        27”
        PALM                                LAP




                                                                                            25
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK




                                                                                             25
Thursday, November 29, 12
DESKTOP



                                 TABLET          LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”   13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP
                                             SIZE CONTINUUM.                  DESK




                                                                                           25
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK




                                                                                             26
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

               TOUCH/GESTURES




                                                                                             26
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

               TOUCH/GESTURES                   CURSOR/KEYBOARD




                                                                                             26
Thursday, November 29, 12
TABLET
  SMARTPHONE




                                     27
Thursday, November 29, 12
TABLET
  SMARTPHONE




                                      4.0”




                                     HTC Windows
                                       Phone 8S



                                                   27
Thursday, November 29, 12
TABLET
  SMARTPHONE




                                      4.0”              7.0”




                                     HTC Windows
                                       Phone 8S    Google Nexus 7




                                                                    27
Thursday, November 29, 12
TABLET
  SMARTPHONE




                                      4.0”              7.0”          9.7”




                                     HTC Windows
                                       Phone 8S    Google Nexus 7   Apple iPad




                                                                                 27
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

               TOUCH/GESTURES                   CURSOR/KEYBOARD




                                                                                             28
Thursday, November 29, 12
LAPTOP




                            29
Thursday, November 29, 12
LAPTOP




                                 11.6
                                  ”




                            Lenovo IdeaTab Lynx




                                                  29
Thursday, November 29, 12
LAPTOP




                                 11.6                  12.5
                                  ”                     ”




                            Lenovo IdeaTab Lynx   Lenovo ThinkPad Twist




                                                                          29
Thursday, November 29, 12
11.6               12.5
                     ”                  ”




            Lenovo IdeaTab Lynx   Lenovo ThinkPad Twist




                                                          30
Thursday, November 29, 12
11.6               12.5                     13.3
                     ”                  ”                        ”




            Lenovo IdeaTab Lynx   Lenovo ThinkPad Twist   Lenovo IdeaPad Yoga




                                                                         30
Thursday, November 29, 12
31


Thursday, November 29, 12
12.5
                              ”




                            Dell XPS 12




                                          32
Thursday, November 29, 12
33


Thursday, November 29, 12
11.6               12.5                     13.3
                     ”                  ”                        ”




            Lenovo IdeaTab Lynx   Lenovo ThinkPad Twist   Lenovo IdeaPad Yoga




                                                                         34
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           35
Thursday, November 29, 12
DESKTOP



                                  TABLET            LAPTOP
  SMARTPHONE




         3”           5”     7”      9”     11”   13”    15”   17”      19”   21”   23”   25”        27”

     MOBILE                 TABLET           WEB SITE


                                          Where do you draw the line?




                                                                                                35
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           35
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

               TOUCH/GESTURES                   CURSOR/KEYBOARD




                                                                                             36
Thursday, November 29, 12
DESKTOP



                                  TABLET            LAPTOP
  SMARTPHONE




         3”           5”     7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                 LAP                                 DESK

                            TOUCH/GESTURES

                                                 CURSOR/KEYBOARD




                                                                                              37
Thursday, November 29, 12
DESKTOP




                                      38
Thursday, November 29, 12
DESKTOP




                                        20”




                                      Sony Tap 20




                                                    38
Thursday, November 29, 12
39


Thursday, November 29, 12
40


Thursday, November 29, 12
41


Thursday, November 29, 12
DESKTOP




                                      42
Thursday, November 29, 12
DESKTOP




                                       21.5
                                        ”




                                      Apple iMac




                                                   42
Thursday, November 29, 12
DESKTOP




                                       21.5         27.5
                                        ”            ”




                                      Apple iMac   Apple iMac




                                                                42
Thursday, November 29, 12
Source: http://live.leapmotion.com/about.html   43


Thursday, November 29, 12
Source: http://live.leapmotion.com/about.html   43


Thursday, November 29, 12
Source: http://live.leapmotion.com/about.html   44


Thursday, November 29, 12
Source: http://live.leapmotion.com/about.html   44


Thursday, November 29, 12
DESKTOP



                                  TABLET            LAPTOP
  SMARTPHONE




         3”           5”     7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                 LAP                                 DESK

                            TOUCH/GESTURES

                                                 CURSOR/KEYBOARD




                                                                                              45
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD




                                                                                             46
Thursday, November 29, 12
SMARTPHONE




                            47
Thursday, November 29, 12
SMARTPHONE




                              3.1”




                            Palm Pre




                                       47
Thursday, November 29, 12
SMARTPHONE




                              3.1”        3.7”




                            Palm Pre   HTC Nexus One




                                                       47
Thursday, November 29, 12
SMARTPHONE




                              3.1”        3.7”              4.0”




                            Palm Pre   HTC Nexus One   Samsung Captivate




                                                                       47
Thursday, November 29, 12
3.7”                  4.0”




      HTC Nexus One         Samsung Captivate




                                                48
Thursday, November 29, 12
3.7”                  4.0”                 4.3”




      HTC Nexus One         Samsung Captivate   Motorola Droid Razr




                                                                      48
Thursday, November 29, 12
3.7”                  4.0”                 4.3”




      HTC Nexus One         Samsung Captivate   Motorola Droid Razr




                                                                      48
Thursday, November 29, 12
3.7”                  4.0”                 4.3”




      HTC Nexus One         Samsung Captivate   Motorola Droid Razr




                                                                      48
Thursday, November 29, 12
3.7”                  4.0”                 4.3”




      HTC Nexus One         Samsung Captivate   Motorola Droid Razr




                                                                      48
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD




                                                                                             49
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD




                                                                                             50
Thursday, November 29, 12
TABLET
  SMARTPHONE




                                     51
Thursday, November 29, 12
TABLET
  SMARTPHONE




                               4.0”




                            Apple iPhone 5




                                                      51
Thursday, November 29, 12
TABLET
  SMARTPHONE




                               4.0”




                            Apple iPhone 5




                                                      51
Thursday, November 29, 12
TABLET
  SMARTPHONE




                               4.0”                     9.7”




                            Apple iPhone 5            Apple iPad




                                                                   51
Thursday, November 29, 12
TABLET
  SMARTPHONE




                               4.0”                     9.7”




                            Apple iPhone 5            Apple iPad




                                                                   51
Thursday, November 29, 12
LAPTOP




                  9.7”




               Apple iPad




                                     52
Thursday, November 29, 12
LAPTOP




                  9.7”                      15”




               Apple iPad            Apple Macbook Pro
                                           Retina



                                                         52
Thursday, November 29, 12
LAPTOP




                  9.7”                      15”




               Apple iPad            Apple Macbook Pro
                                           Retina



                                                         52
Thursday, November 29, 12
5-inch LG display with 440ppi and 1080p resolution




                                                                    53


Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD



                                                                                             54


Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD

                                 HIGH-DPI

                                                                                             54


Thursday, November 29, 12
MULTI-DEVICE DESIGN
         1. Support a Continuum of Screens
         2. Account for High Resolution
         3. Optimize for Touch
         4. Support Cursor & Keyboard




                                             55


Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           56
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           56
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE


     Limited content/




                                                                                           56
Thursday, November 29, 12
DESKTOP



                                  TABLET          LAPTOP
  SMARTPHONE




         3”           5”     7”      9”    11”   13”   15”   17”   19”   21”   23”   25”        27”

     MOBILE                 TABLET          WEB SITE




                                                                                           56
Thursday, November 29, 12
DESKTOP



                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD

                                 HIGH-DPI


                                                                                             57
Thursday, November 29, 12
DESKTOP
                  DESIGN & BUILD MOBILE FIRST

                                 TABLET            LAPTOP
  SMARTPHONE




         3”           5”    7”     9”     11”     13”   15”   17”   19”   21”    23”   25”        27”
        PALM                                LAP                                 DESK

                                                TOUCH/GESTURES

                                                CURSOR/KEYBOARD

                                 HIGH-DPI


                                                                                             57
Thursday, November 29, 12
MULTI-DEVICE DESIGN
         1. Work Mobile First
         2. Account for High Resolution
         3. Optimize for Touch
         4. Support Cursor & Keyboard
         5. Support a Continuum of Screens




                                             58


Thursday, November 29, 12
GOOD NEWS




                            59


Thursday, November 29, 12
GOOD NEWS

         You only need one Web design: a
         multi-device design.




                                           59


Thursday, November 29, 12
BAD NEWS




                            60


Thursday, November 29, 12
BAD NEWS

         It’s a new & different way of doing
         Web design.




                                               60


Thursday, November 29, 12
THANKS




                                     61


Thursday, November 29, 12
THANKS


                            @LUKEW       LUKEW.COM




                                                     61


Thursday, November 29, 12

More Related Content

Viewers also liked

Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionBelen Barros Pena
 
Digiday and Yahoo! Present: Mobile Daily Habits, Moving Marketers Forward
Digiday and  Yahoo! Present: Mobile Daily Habits, Moving Marketers ForwardDigiday and  Yahoo! Present: Mobile Daily Habits, Moving Marketers Forward
Digiday and Yahoo! Present: Mobile Daily Habits, Moving Marketers ForwardDigiday
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
How to Get Started in Mobile Marketing
How to Get Started in Mobile MarketingHow to Get Started in Mobile Marketing
How to Get Started in Mobile MarketingSIXTY
 
Etat des lieux du mobile en France et en Europe
Etat des lieux du mobile en France et en EuropeEtat des lieux du mobile en France et en Europe
Etat des lieux du mobile en France et en EuropeMediamaispasque
 
Mobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTsMobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTsTomer Rosenthal
 
Digital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto ExperienceDigital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto ExperienceBrian Regienczuk
 
Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010SEO CAMP
 
L’iPad à l’école : usages, avantages et défis
L’iPad à l’école : usages,  avantages et défisL’iPad à l’école : usages,  avantages et défis
L’iPad à l’école : usages, avantages et défisnawras.univers
 
5 Lessons in Digital Publishing
5 Lessons in Digital Publishing 5 Lessons in Digital Publishing
5 Lessons in Digital Publishing Mag+
 
Mobile Marketing Attitude 2013 - SNCD
Mobile Marketing Attitude 2013 - SNCDMobile Marketing Attitude 2013 - SNCD
Mobile Marketing Attitude 2013 - SNCDRomain Fonnier
 
Baromètre mobile marketing association france 3ème trimestre 2013
Baromètre mobile marketing association france  3ème trimestre 2013Baromètre mobile marketing association france  3ème trimestre 2013
Baromètre mobile marketing association france 3ème trimestre 2013Thierry Pires
 
3eme observatoire de l'internet mobile 2011
3eme observatoire de l'internet mobile 20113eme observatoire de l'internet mobile 2011
3eme observatoire de l'internet mobile 2011servicesmobiles.fr
 

Viewers also liked (14)

Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fiction
 
Chiffres du mobile en france
Chiffres du mobile en franceChiffres du mobile en france
Chiffres du mobile en france
 
Digiday and Yahoo! Present: Mobile Daily Habits, Moving Marketers Forward
Digiday and  Yahoo! Present: Mobile Daily Habits, Moving Marketers ForwardDigiday and  Yahoo! Present: Mobile Daily Habits, Moving Marketers Forward
Digiday and Yahoo! Present: Mobile Daily Habits, Moving Marketers Forward
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
 
How to Get Started in Mobile Marketing
How to Get Started in Mobile MarketingHow to Get Started in Mobile Marketing
How to Get Started in Mobile Marketing
 
Etat des lieux du mobile en France et en Europe
Etat des lieux du mobile en France et en EuropeEtat des lieux du mobile en France et en Europe
Etat des lieux du mobile en France et en Europe
 
Mobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTsMobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTs
 
Digital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto ExperienceDigital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto Experience
 
Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010
 
L’iPad à l’école : usages, avantages et défis
L’iPad à l’école : usages,  avantages et défisL’iPad à l’école : usages,  avantages et défis
L’iPad à l’école : usages, avantages et défis
 
5 Lessons in Digital Publishing
5 Lessons in Digital Publishing 5 Lessons in Digital Publishing
5 Lessons in Digital Publishing
 
Mobile Marketing Attitude 2013 - SNCD
Mobile Marketing Attitude 2013 - SNCDMobile Marketing Attitude 2013 - SNCD
Mobile Marketing Attitude 2013 - SNCD
 
Baromètre mobile marketing association france 3ème trimestre 2013
Baromètre mobile marketing association france  3ème trimestre 2013Baromètre mobile marketing association france  3ème trimestre 2013
Baromètre mobile marketing association france 3ème trimestre 2013
 
3eme observatoire de l'internet mobile 2011
3eme observatoire de l'internet mobile 20113eme observatoire de l'internet mobile 2011
3eme observatoire de l'internet mobile 2011
 

More from 500 Startups (20)

Get on Board
Get on BoardGet on Board
Get on Board
 
Connected Analytics
Connected AnalyticsConnected Analytics
Connected Analytics
 
Sira Medical
Sira MedicalSira Medical
Sira Medical
 
The Atlas
The AtlasThe Atlas
The Atlas
 
Trash Warrior
Trash WarriorTrash Warrior
Trash Warrior
 
Thematic
ThematicThematic
Thematic
 
Shiplyst
ShiplystShiplyst
Shiplyst
 
Renetec
RenetecRenetec
Renetec
 
Predina
PredinaPredina
Predina
 
Pluto
PlutoPluto
Pluto
 
Plant an App
Plant an AppPlant an App
Plant an App
 
Pilota
PilotaPilota
Pilota
 
Mero Technologies
Mero TechnologiesMero Technologies
Mero Technologies
 
Omnitron Sensors
Omnitron SensorsOmnitron Sensors
Omnitron Sensors
 
Juked
JukedJuked
Juked
 
GamerzClass
GamerzClassGamerzClass
GamerzClass
 
eino
einoeino
eino
 
Cenos
CenosCenos
Cenos
 
Bliinx
BliinxBliinx
Bliinx
 
Butlr
ButlrButlr
Butlr
 

Recently uploaded

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfphriedaoyigada
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdfardanaadam1
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Yantram Animation Studio Corporation
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesmilalabial
 

Recently uploaded (20)

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdf
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposes
 

Luke Wroblewski, LukeW, Warm Gun 2012

  • 2. MULTI-DEVICE DESIGN STRATEGY WARM GUN 2012 LUKE WROBLEWSKI 1 Thursday, November 29, 12
  • 3. MULTI-DEVICE DESIGN STRATEGY WARM GUN 2012 LUKE WROBLEWSKI 1 Thursday, November 29, 12
  • 5. 4.3” Motorola Droid RAZR M 2 Thursday, November 29, 12
  • 6. 4.3” Screen: 4.3" with 960 x 540 & 256 ppi Browser: Chrome for Android (Chrome 18) OS: Google Android 4.0 Motorola Droid RAZR M 2 Thursday, November 29, 12
  • 7. 4.3” Motorola Droid RAZR M 2 Thursday, November 29, 12
  • 8. 4.3” 5.5” Motorola Droid Samsung Galaxy RAZR M Note II 2 Thursday, November 29, 12
  • 9. 4.3” 5.5” Screen: 5.5" with 720 x 1280 & 276 ppi Browser: Android Webkit OS: Google Android 4.1 (modified) Motorola Droid Samsung Galaxy RAZR M Note II 2 Thursday, November 29, 12
  • 10. 4.3” 5.5” Motorola Droid Samsung Galaxy RAZR M Note II 2 Thursday, November 29, 12
  • 11. 4.3” 5.5” 7.9” Motorola Droid Samsung Galaxy RAZR M Note II Apple iPad Mini 2 Thursday, November 29, 12
  • 12. 4.3” 5.5” 7.9” Screen: 7.9" with 768 x 1024 pixels and 163 ppi Browser: Apple Safari 6 OS: iOS 6 Motorola Droid Samsung Galaxy RAZR M Note II Apple iPad Mini 2 Thursday, November 29, 12
  • 13. 4.3” 5.5” 7.9” Motorola Droid Samsung Galaxy RAZR M Note II Apple iPad Mini 2 Thursday, November 29, 12
  • 14. 4.3” 5.5” 7.9” 12.5 ” Motorola Droid Samsung Galaxy Apple iPad Mini Dell XPS 12 RAZR M Note II 2 Thursday, November 29, 12
  • 15. 4.3” 5.5” 7.9” 12.5 ” Screen: 12.5" with 1920 x 1080 pixels Browser: Internet Explorer 10 OS: Microsoft Windows 8 RT Motorola Droid Samsung Galaxy Apple iPad Mini Dell XPS 12 RAZR M Note II 2 Thursday, November 29, 12
  • 16. 4.3” 5.5” 7.9” 12.5 ” Motorola Droid Samsung Galaxy Apple iPad Mini Dell XPS 12 RAZR M Note II 2 Thursday, November 29, 12
  • 17. PC Desktop Internet Mobile Consumer 100M+ 1B+ 10B+ 1990 2000 2010 2020 Source: Morgan Stanley Research 3 Thursday, November 29, 12
  • 18. 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 4 Thursday, November 29, 12
  • 19. SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 4 Thursday, November 29, 12
  • 20. SMARTPHONE 5 Thursday, November 29, 12
  • 21. SMARTPHONE 3.5” iPhone 3GS 5 Thursday, November 29, 12
  • 22. SMARTPHONE 3.1” 3.5” Palm Pre iPhone 3GS 5 Thursday, November 29, 12
  • 23. SMARTPHONE 3.1” 3.5” 3.7” Palm Pre iPhone 3GS HTC Nexus One 5 Thursday, November 29, 12
  • 24. SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 6 Thursday, November 29, 12
  • 25. TABLET SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 6 Thursday, November 29, 12
  • 26. TABLET 7 Thursday, November 29, 12
  • 27. TABLET 9.7” Apple iPad 7 Thursday, November 29, 12
  • 28. IPAD Source: http://www.lukew.com/ff/entry.asp?1640 8 Thursday, November 29, 12
  • 29. IPAD 94% of tablet traffic May 2012 Source: http://www.lukew.com/ff/entry.asp?1640 8 Thursday, November 29, 12
  • 30. IPAD 94% of tablet traffic May 2012 98% of tablet traffic Sept 2012 Source: http://www.lukew.com/ff/entry.asp?1640 8 Thursday, November 29, 12
  • 31. IPAD 94% of tablet traffic May 2012 98% of tablet traffic Sept 2012 91% of tablet traffic on Web Source: http://www.lukew.com/ff/entry.asp?1640 8 Thursday, November 29, 12
  • 32. TABLET SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 9 Thursday, November 29, 12
  • 33. TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 9 Thursday, November 29, 12
  • 34. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 9 Thursday, November 29, 12
  • 35. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” WEB SITE 9 Thursday, November 29, 12
  • 36. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE WEB SITE 9 Thursday, November 29, 12
  • 37. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 10 Thursday, November 29, 12
  • 38. SMARTPHONE 11 Thursday, November 29, 12
  • 39. SMARTPHONE 3.5” iPhone 3GS 11 Thursday, November 29, 12
  • 40. SMARTPHONE 3.5” 4.0” iPhone 3GS HTC Windows Phone 8S 11 Thursday, November 29, 12
  • 41. SMARTPHONE 3.5” 4.0” 4.3” iPhone 3GS HTC Windows Motorola Droid Phone 8S RAZR M 11 Thursday, November 29, 12
  • 42. SMARTPHONE 3.5” 4.0” 4.3” 4.5” iPhone 3GS HTC Windows Motorola Droid Nokia Lumia 920 Phone 8S RAZR M 11 Thursday, November 29, 12
  • 43. SMARTPHONE 3.5” 4.0” 4.3” 4.5” 4.7” iPhone 3GS HTC Windows Motorola Droid Nokia Lumia 920 LG Nexus 4 Phone 8S RAZR M 11 Thursday, November 29, 12
  • 44. 4.3” 4.5” 4.7” Motorola Droid Nokia Lumia 920 LG Nexus 4 RAZR M 12 Thursday, November 29, 12
  • 45. 4.3” 4.5” 4.7” 5.3” Motorola Droid Nokia Lumia 920 LG Nexus 4 Samsung Galaxy Note RAZR M 12 Thursday, November 29, 12
  • 46. 4.3” 4.5” 4.7” 5.3” 5.5” Motorola Droid Nokia Lumia 920 LG Nexus 4 Samsung Galaxy Note Samsung Galaxy Note II RAZR M 12 Thursday, November 29, 12
  • 47. MOBILE Source: http://www.lukew.com/ff/entry.asp?1640 13 Thursday, November 29, 12
  • 48. MOBILE Android 29% smartphones sold in last 3 months were over 4.5” Source: http://www.lukew.com/ff/entry.asp?1640 13 Thursday, November 29, 12
  • 49. MOBILE Android 29% smartphones sold in last 3 months were over 4.5” 5M iPhone5 (4”) sales in first 24 hours Source: http://www.lukew.com/ff/entry.asp?1640 13 Thursday, November 29, 12
  • 50. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 14 Thursday, November 29, 12
  • 51. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 14 Thursday, November 29, 12
  • 52. TABLET 15 Thursday, November 29, 12
  • 53. TABLET 9.7” Apple iPad 15 Thursday, November 29, 12
  • 54. TABLET 9.7” 10.1 ” Lenovo ThinkPad Tablet 2 Acer Iconia Tab W510 Dell Latitude 10 Dell XPS 10 Apple iPad Asus Vivo Tab RT 15 Thursday, November 29, 12
  • 55. TABLET 9.7” Apple iPad 16 Thursday, November 29, 12
  • 56. TABLET 8.9” 9.7” Kindle Fire HD Apple iPad 16 Thursday, November 29, 12
  • 57. TABLET 7.9” 8.9” 9.7” Apple iPad Mini Kindle Fire HD Apple iPad 16 Thursday, November 29, 12
  • 58. TABLET 7.0” 7.9” 8.9” 9.7” Google Nexus 7 Apple iPad Mini Kindle Fire HD Apple iPad 16 Thursday, November 29, 12
  • 59. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 17 Thursday, November 29, 12
  • 60. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 17 Thursday, November 29, 12
  • 61. LAPTOP 18 Thursday, November 29, 12
  • 62. LAPTOP 11” Apple Macbook Air 18 Thursday, November 29, 12
  • 63. LAPTOP 11” 13” Apple Macbook Air Apple Macbook Air 18 Thursday, November 29, 12
  • 64. LAPTOP 11” 13” 15” Apple Macbook Air Apple Macbook Air Apple Macbook Pro 18 Thursday, November 29, 12
  • 65. 13” 15” Apple Macbook Air Apple Macbook Pro 19 Thursday, November 29, 12
  • 66. 13” 15” 17” Apple Macbook Air Apple Macbook Pro Apple Macbook Pro 19 Thursday, November 29, 12
  • 67. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 20 Thursday, November 29, 12
  • 68. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 20 Thursday, November 29, 12
  • 69. DESKTOP 21 Thursday, November 29, 12
  • 70. DESKTOP 17” Samsung Display 21 Thursday, November 29, 12
  • 71. DESKTOP 17” 19” Samsung Display Samsung Display 21 Thursday, November 29, 12
  • 72. DESKTOP 17” 19” Samsung Display Samsung Display 21 Thursday, November 29, 12
  • 73. 17” 19” Samsung Display Samsung Display 22 Thursday, November 29, 12
  • 74. 17” 19” 21” Samsung Display Samsung Display Samsung Display 22 Thursday, November 29, 12
  • 76. 21.5 ” Apple iMac 23 Thursday, November 29, 12
  • 77. 21.5 27.5 ” ” Apple iMac Apple iMac 23 Thursday, November 29, 12
  • 78. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 24 Thursday, November 29, 12
  • 79. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 24 Thursday, November 29, 12
  • 80. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 24 Thursday, November 29, 12
  • 81. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 24 Thursday, November 29, 12
  • 82. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” 25 Thursday, November 29, 12
  • 83. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM 25 Thursday, November 29, 12
  • 84. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP 25 Thursday, November 29, 12
  • 85. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK 25 Thursday, November 29, 12
  • 86. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP SIZE CONTINUUM. DESK 25 Thursday, November 29, 12
  • 87. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK 26 Thursday, November 29, 12
  • 88. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES 26 Thursday, November 29, 12
  • 89. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 26 Thursday, November 29, 12
  • 90. TABLET SMARTPHONE 27 Thursday, November 29, 12
  • 91. TABLET SMARTPHONE 4.0” HTC Windows Phone 8S 27 Thursday, November 29, 12
  • 92. TABLET SMARTPHONE 4.0” 7.0” HTC Windows Phone 8S Google Nexus 7 27 Thursday, November 29, 12
  • 93. TABLET SMARTPHONE 4.0” 7.0” 9.7” HTC Windows Phone 8S Google Nexus 7 Apple iPad 27 Thursday, November 29, 12
  • 94. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 28 Thursday, November 29, 12
  • 95. LAPTOP 29 Thursday, November 29, 12
  • 96. LAPTOP 11.6 ” Lenovo IdeaTab Lynx 29 Thursday, November 29, 12
  • 97. LAPTOP 11.6 12.5 ” ” Lenovo IdeaTab Lynx Lenovo ThinkPad Twist 29 Thursday, November 29, 12
  • 98. 11.6 12.5 ” ” Lenovo IdeaTab Lynx Lenovo ThinkPad Twist 30 Thursday, November 29, 12
  • 99. 11.6 12.5 13.3 ” ” ” Lenovo IdeaTab Lynx Lenovo ThinkPad Twist Lenovo IdeaPad Yoga 30 Thursday, November 29, 12
  • 101. 12.5 ” Dell XPS 12 32 Thursday, November 29, 12
  • 103. 11.6 12.5 13.3 ” ” ” Lenovo IdeaTab Lynx Lenovo ThinkPad Twist Lenovo IdeaPad Yoga 34 Thursday, November 29, 12
  • 104. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 35 Thursday, November 29, 12
  • 105. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE Where do you draw the line? 35 Thursday, November 29, 12
  • 106. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 35 Thursday, November 29, 12
  • 107. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 36 Thursday, November 29, 12
  • 108. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 37 Thursday, November 29, 12
  • 109. DESKTOP 38 Thursday, November 29, 12
  • 110. DESKTOP 20” Sony Tap 20 38 Thursday, November 29, 12
  • 114. DESKTOP 42 Thursday, November 29, 12
  • 115. DESKTOP 21.5 ” Apple iMac 42 Thursday, November 29, 12
  • 116. DESKTOP 21.5 27.5 ” ” Apple iMac Apple iMac 42 Thursday, November 29, 12
  • 117. Source: http://live.leapmotion.com/about.html 43 Thursday, November 29, 12
  • 118. Source: http://live.leapmotion.com/about.html 43 Thursday, November 29, 12
  • 119. Source: http://live.leapmotion.com/about.html 44 Thursday, November 29, 12
  • 120. Source: http://live.leapmotion.com/about.html 44 Thursday, November 29, 12
  • 121. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 45 Thursday, November 29, 12
  • 122. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 46 Thursday, November 29, 12
  • 123. SMARTPHONE 47 Thursday, November 29, 12
  • 124. SMARTPHONE 3.1” Palm Pre 47 Thursday, November 29, 12
  • 125. SMARTPHONE 3.1” 3.7” Palm Pre HTC Nexus One 47 Thursday, November 29, 12
  • 126. SMARTPHONE 3.1” 3.7” 4.0” Palm Pre HTC Nexus One Samsung Captivate 47 Thursday, November 29, 12
  • 127. 3.7” 4.0” HTC Nexus One Samsung Captivate 48 Thursday, November 29, 12
  • 128. 3.7” 4.0” 4.3” HTC Nexus One Samsung Captivate Motorola Droid Razr 48 Thursday, November 29, 12
  • 129. 3.7” 4.0” 4.3” HTC Nexus One Samsung Captivate Motorola Droid Razr 48 Thursday, November 29, 12
  • 130. 3.7” 4.0” 4.3” HTC Nexus One Samsung Captivate Motorola Droid Razr 48 Thursday, November 29, 12
  • 131. 3.7” 4.0” 4.3” HTC Nexus One Samsung Captivate Motorola Droid Razr 48 Thursday, November 29, 12
  • 132. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 49 Thursday, November 29, 12
  • 133. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 50 Thursday, November 29, 12
  • 134. TABLET SMARTPHONE 51 Thursday, November 29, 12
  • 135. TABLET SMARTPHONE 4.0” Apple iPhone 5 51 Thursday, November 29, 12
  • 136. TABLET SMARTPHONE 4.0” Apple iPhone 5 51 Thursday, November 29, 12
  • 137. TABLET SMARTPHONE 4.0” 9.7” Apple iPhone 5 Apple iPad 51 Thursday, November 29, 12
  • 138. TABLET SMARTPHONE 4.0” 9.7” Apple iPhone 5 Apple iPad 51 Thursday, November 29, 12
  • 139. LAPTOP 9.7” Apple iPad 52 Thursday, November 29, 12
  • 140. LAPTOP 9.7” 15” Apple iPad Apple Macbook Pro Retina 52 Thursday, November 29, 12
  • 141. LAPTOP 9.7” 15” Apple iPad Apple Macbook Pro Retina 52 Thursday, November 29, 12
  • 142. 5-inch LG display with 440ppi and 1080p resolution 53 Thursday, November 29, 12
  • 143. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD 54 Thursday, November 29, 12
  • 144. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD HIGH-DPI 54 Thursday, November 29, 12
  • 145. MULTI-DEVICE DESIGN 1. Support a Continuum of Screens 2. Account for High Resolution 3. Optimize for Touch 4. Support Cursor & Keyboard 55 Thursday, November 29, 12
  • 146. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 56 Thursday, November 29, 12
  • 147. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 56 Thursday, November 29, 12
  • 148. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE Limited content/ 56 Thursday, November 29, 12
  • 149. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” MOBILE TABLET WEB SITE 56 Thursday, November 29, 12
  • 150. DESKTOP TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD HIGH-DPI 57 Thursday, November 29, 12
  • 151. DESKTOP DESIGN & BUILD MOBILE FIRST TABLET LAPTOP SMARTPHONE 3” 5” 7” 9” 11” 13” 15” 17” 19” 21” 23” 25” 27” PALM LAP DESK TOUCH/GESTURES CURSOR/KEYBOARD HIGH-DPI 57 Thursday, November 29, 12
  • 152. MULTI-DEVICE DESIGN 1. Work Mobile First 2. Account for High Resolution 3. Optimize for Touch 4. Support Cursor & Keyboard 5. Support a Continuum of Screens 58 Thursday, November 29, 12
  • 153. GOOD NEWS 59 Thursday, November 29, 12
  • 154. GOOD NEWS You only need one Web design: a multi-device design. 59 Thursday, November 29, 12
  • 155. BAD NEWS 60 Thursday, November 29, 12
  • 156. BAD NEWS It’s a new & different way of doing Web design. 60 Thursday, November 29, 12
  • 157. THANKS 61 Thursday, November 29, 12
  • 158. THANKS @LUKEW LUKEW.COM 61 Thursday, November 29, 12