SlideShare a Scribd company logo
Touch Gesture R E F E R E N C E G U I D E                      By Craig Villamor, Dan Willis, and Luke Wroblewski
                                                                               Last updated April 15, 2010




CO RE GE ST U R E S Basic gestures for most touch commands


Tap                                Double tap                          Drag                                Flick




Briefly touch surface              Rapidly touch surface               Move fingertip over                 Quickly brush surface
with fingertip                     twice with fingertip                surface without                     with fingertip
                                                                       losing contact

Pinch                              Spread                              Press                               Press and tap




Touch surface with                 Touch surface with                  Touch surface for                   Press surface with
two fingers and bring              two fingers and                     extended period                     one finger and briefly
them closer together               move them apart                     of time                             touch surface with
                                                                                                           second finger

Press and drag                                          Rotate



               OR                                                                     OR                           OR




Press surface with one finger and                       Touch surface with two fingers
move second finger over surface                         and move them in a clockwise
without losing contact                                  or counterclockwise direction




    Supporting materials for this guide can be found online at: http://www.lukew.com/touch/

This work is licensed under the Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.
To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/3.0/
touch gesture reference guide                                                                        r

Major User Actions
Currently supported by touch gesture systems

  BASIC ACTIONS

  user action                   gesture                            description


  Change mode                                 press                Touch surface for extended period of time




  Open                                        double tap           Rapidly touch surface twice with fingertip




  Select                                      tap                  Briefly touch surface with fingertip




  OBJECT-RELATED ACTIONS

  user action                   gesture                            description


  Adjust                                                           Press surface with one finger and move
                                                  OR               second finger over surface without
                                                                   losing contact

                                  press and drag


                                                                   Make circular motion with finger, then
                                                                   cross over selected object

                                          1                    2

                                  lasso and cross


  Bundle                                                           Touch first object while second finger
                                                                   taps other objects, the move selected
                                                                   objects by dragging first finger
                                              1            2
                                 press and tap, then drag




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/
touch gesture reference guide                                                                                    t


  OBJECT-RELATED ACTIONS (continued)

  user action                   gesture                                            description


  Delete                                                       drag                Move fingertip over surface without
                                                               (across item or     losing contact
                                                               off-screen)



  Duplicate                                                    tap                 Touch object, then touch elsewhere
                                                               (source and         on surface
                                                               destination)
                                                           2
                                            1



  Move                                                         drag                Move fingertip over surface without
                                                               (and drop)          losing contact




                                                                    multi-finger   Move two to five fingertips over
                                            OR                      drag           surface without losing contact



                                 OR               OR




                                                               flick               Quickly brush surface with fingertip




                                                               press and tap       With one finger on object, touch elsewhere
                                                                                   on surface with second finger




  Rotate                                                                                                    rotate

                                                               OR                      OR




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/
touch gesture reference guide                                                                           u


  OBJECT-RELATED ACTIONS (continued)

  user action                   gesture                              description


  Scale down                                               pinch     Touch surface with two fingers and
                                                                     bring them closer together




                                                           squeeze   Touch surface with five fingers and
                                                                     bring them closer together




  Scale up                                                 spread    Touch surface with two fingers and
                                                                     move them apart




                                                           splay     Touch surface with five fingers and
                                                                     move them apart



  NAVIGATING ACTIONS

  user action                   gesture                              description

  Adjust view                                                                              rotate
  (rotate)
                                                           OR            OR




  Adjust view                                              pinch     Touch surface with two fingers and
  (zoom in)                                                          bring them closer together




                                            double tap               Rapidly touch surface twice with fingertip




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/
touch gesture reference guide                                                                          i


  NAVIGATING ACTIONS (continued)

  user action                   gesture                             description


  Adjust view                                              spread   Touch surface with two fingers and
  (zoom out)                                                        move them apart




                                            double tap              Rapidly touch surface twice with fingertip




  Display commands                          press                   Touch surface for extended period
                                                                    of time




                                            press and tap           Press surface with one finger and briefly
                                                                    touch surface with second finger




                                            double tap              Rapidly touch surface twice with fingertip




                                            corner tap              Touch specific corner of surface with
                                                                    fingertip




  Move through list                             two-finger drag     Move to previous/next item in list




                                                                                          rotate
                                                           OR           OR




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/
touch gesture reference guide                                                                        o


  NAVIGATING ACTIONS (continued)

  user action                   gesture                             description


  Pan                                                  drag hand    Move fingers and palm of one hand
                                                                    over surface without losing contact




  Scroll                                                   drag     Move fingertip over scrollbar without
                                                                    losing contact




                                                  two-finger drag   Move two fingers up or down across
                                                                    surface




                                            press                   Touch scrollbar for extended period
                                                                    of time




  Scroll (fast)                                flick                Quickly brush surface with fingertip in
                                                                    the direction you want to scroll




  Scroll (fast)                             tap                     Briefly touch surface with fingertip when
                                                                    a scroll is in progress




  Scrub                                                    drag     Move fingertip over scrollbar without
                                                                    losing contact




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/
touch gesture reference guide                                          p


  DRAWING ACTIONS

  user action                   gesture

  Accept                        Draw a checkmark on surface with fingertip

  Cut                           Draw a slash on surface with fingertip

  Get help                      Draw a question mark on surface with fingertip

  Reject                        Draw an “X” on surface with fingertip

  Undo                          Scratch out area on surface with fingertip




Supporting materials for this guide can be found online:
http://www.lukew.com/touch/

More Related Content

More from Pierre Foucart

White paper your guide to successful product launches on facebook
White paper   your guide to successful product launches on facebookWhite paper   your guide to successful product launches on facebook
White paper your guide to successful product launches on facebookPierre Foucart
 
Good brands report 2010
Good brands report 2010Good brands report 2010
Good brands report 2010Pierre Foucart
 
10things
10things10things
10things
Pierre Foucart
 

More from Pierre Foucart (6)

White paper your guide to successful product launches on facebook
White paper   your guide to successful product launches on facebookWhite paper   your guide to successful product launches on facebook
White paper your guide to successful product launches on facebook
 
Bicycle tire belts
Bicycle tire beltsBicycle tire belts
Bicycle tire belts
 
Rich Media AdFX
Rich Media AdFXRich Media AdFX
Rich Media AdFX
 
Good brands report 2010
Good brands report 2010Good brands report 2010
Good brands report 2010
 
Designing apps
Designing appsDesigning apps
Designing apps
 
10things
10things10things
10things
 

Recently uploaded

Connect Conference 2022: Passive House - Economic and Environmental Solution...
Connect Conference 2022: Passive House -  Economic and Environmental Solution...Connect Conference 2022: Passive House -  Economic and Environmental Solution...
Connect Conference 2022: Passive House - Economic and Environmental Solution...
TE Studio
 
Mohannad Abdullah portfolio _ V2 _22-24
Mohannad Abdullah  portfolio _ V2 _22-24Mohannad Abdullah  portfolio _ V2 _22-24
Mohannad Abdullah portfolio _ V2 _22-24
M. A. Architect
 
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
708pb191
 
Game Concept Presentation for Ukrainian Mythology Based Game With Designs
Game Concept Presentation for Ukrainian Mythology Based Game With DesignsGame Concept Presentation for Ukrainian Mythology Based Game With Designs
Game Concept Presentation for Ukrainian Mythology Based Game With Designs
184804
 
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdfPORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
fabianavillanib
 
Top Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdfTop Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdf
PlanitIsrael
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
cy0krjxt
 
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANEEASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
Febless Hernane
 
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
taqyed
 
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
asuzyq
 
Portfolio.pdf
Portfolio.pdfPortfolio.pdf
Portfolio.pdf
garcese
 
Book Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for DesignersBook Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for Designers
Confidence Ago
 
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
9a93xvy
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
PrabhjeetSingh219035
 
Timeless Principles of Good Design
Timeless Principles of Good DesignTimeless Principles of Good Design
Timeless Principles of Good Design
Carolina de Bartolo
 
Transforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting ProfitabilityTransforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting Profitability
aaryangarg12
 
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptxUNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
GOWSIKRAJA PALANISAMY
 
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
gpffo76j
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
7sd8fier
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
boryssutkowski
 

Recently uploaded (20)

Connect Conference 2022: Passive House - Economic and Environmental Solution...
Connect Conference 2022: Passive House -  Economic and Environmental Solution...Connect Conference 2022: Passive House -  Economic and Environmental Solution...
Connect Conference 2022: Passive House - Economic and Environmental Solution...
 
Mohannad Abdullah portfolio _ V2 _22-24
Mohannad Abdullah  portfolio _ V2 _22-24Mohannad Abdullah  portfolio _ V2 _22-24
Mohannad Abdullah portfolio _ V2 _22-24
 
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
一比一原版(UAL毕业证书)伦敦艺术大学毕业证成绩单如何办理
 
Game Concept Presentation for Ukrainian Mythology Based Game With Designs
Game Concept Presentation for Ukrainian Mythology Based Game With DesignsGame Concept Presentation for Ukrainian Mythology Based Game With Designs
Game Concept Presentation for Ukrainian Mythology Based Game With Designs
 
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdfPORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
PORTFOLIO FABIANA VILLANI ARCHITECTURE.pdf
 
Top Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdfTop Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdf
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
 
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANEEASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
EASY TUTORIAL OF HOW TO USE CAPCUT BY: FEBLESS HERNANE
 
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理一比一原版(毕业证)长崎大学毕业证成绩单如何办理
一比一原版(毕业证)长崎大学毕业证成绩单如何办理
 
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
 
Portfolio.pdf
Portfolio.pdfPortfolio.pdf
Portfolio.pdf
 
Book Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for DesignersBook Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for Designers
 
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
 
Timeless Principles of Good Design
Timeless Principles of Good DesignTimeless Principles of Good Design
Timeless Principles of Good Design
 
Transforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting ProfitabilityTransforming Brand Perception and Boosting Profitability
Transforming Brand Perception and Boosting Profitability
 
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptxUNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
UNIT IV-VISUAL STYLE AND MOBILE INTERFACES.pptx
 
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
原版定做(penn毕业证书)美国宾夕法尼亚大学毕业证文凭学历证书原版一模一样
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
 

Touch gesture guide

  • 1. Touch Gesture R E F E R E N C E G U I D E By Craig Villamor, Dan Willis, and Luke Wroblewski Last updated April 15, 2010 CO RE GE ST U R E S Basic gestures for most touch commands Tap Double tap Drag Flick Briefly touch surface Rapidly touch surface Move fingertip over Quickly brush surface with fingertip twice with fingertip surface without with fingertip losing contact Pinch Spread Press Press and tap Touch surface with Touch surface with Touch surface for Press surface with two fingers and bring two fingers and extended period one finger and briefly them closer together move them apart of time touch surface with second finger Press and drag Rotate OR OR OR Press surface with one finger and Touch surface with two fingers move second finger over surface and move them in a clockwise without losing contact or counterclockwise direction Supporting materials for this guide can be found online at: http://www.lukew.com/touch/ This work is licensed under the Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/3.0/
  • 2. touch gesture reference guide r Major User Actions Currently supported by touch gesture systems BASIC ACTIONS user action gesture description Change mode press Touch surface for extended period of time Open double tap Rapidly touch surface twice with fingertip Select tap Briefly touch surface with fingertip OBJECT-RELATED ACTIONS user action gesture description Adjust Press surface with one finger and move OR second finger over surface without losing contact press and drag Make circular motion with finger, then cross over selected object 1 2 lasso and cross Bundle Touch first object while second finger taps other objects, the move selected objects by dragging first finger 1 2 press and tap, then drag Supporting materials for this guide can be found online: http://www.lukew.com/touch/
  • 3. touch gesture reference guide t OBJECT-RELATED ACTIONS (continued) user action gesture description Delete drag Move fingertip over surface without (across item or losing contact off-screen) Duplicate tap Touch object, then touch elsewhere (source and on surface destination) 2 1 Move drag Move fingertip over surface without (and drop) losing contact multi-finger Move two to five fingertips over OR drag surface without losing contact OR OR flick Quickly brush surface with fingertip press and tap With one finger on object, touch elsewhere on surface with second finger Rotate rotate OR OR Supporting materials for this guide can be found online: http://www.lukew.com/touch/
  • 4. touch gesture reference guide u OBJECT-RELATED ACTIONS (continued) user action gesture description Scale down pinch Touch surface with two fingers and bring them closer together squeeze Touch surface with five fingers and bring them closer together Scale up spread Touch surface with two fingers and move them apart splay Touch surface with five fingers and move them apart NAVIGATING ACTIONS user action gesture description Adjust view rotate (rotate) OR OR Adjust view pinch Touch surface with two fingers and (zoom in) bring them closer together double tap Rapidly touch surface twice with fingertip Supporting materials for this guide can be found online: http://www.lukew.com/touch/
  • 5. touch gesture reference guide i NAVIGATING ACTIONS (continued) user action gesture description Adjust view spread Touch surface with two fingers and (zoom out) move them apart double tap Rapidly touch surface twice with fingertip Display commands press Touch surface for extended period of time press and tap Press surface with one finger and briefly touch surface with second finger double tap Rapidly touch surface twice with fingertip corner tap Touch specific corner of surface with fingertip Move through list two-finger drag Move to previous/next item in list rotate OR OR Supporting materials for this guide can be found online: http://www.lukew.com/touch/
  • 6. touch gesture reference guide o NAVIGATING ACTIONS (continued) user action gesture description Pan drag hand Move fingers and palm of one hand over surface without losing contact Scroll drag Move fingertip over scrollbar without losing contact two-finger drag Move two fingers up or down across surface press Touch scrollbar for extended period of time Scroll (fast) flick Quickly brush surface with fingertip in the direction you want to scroll Scroll (fast) tap Briefly touch surface with fingertip when a scroll is in progress Scrub drag Move fingertip over scrollbar without losing contact Supporting materials for this guide can be found online: http://www.lukew.com/touch/
  • 7. touch gesture reference guide p DRAWING ACTIONS user action gesture Accept Draw a checkmark on surface with fingertip Cut Draw a slash on surface with fingertip Get help Draw a question mark on surface with fingertip Reject Draw an “X” on surface with fingertip Undo Scratch out area on surface with fingertip Supporting materials for this guide can be found online: http://www.lukew.com/touch/