SlideShare une entreprise Scribd logo
1  sur  7
Télécharger pour lire hors ligne
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

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


  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 out)                                                         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 in)                                                         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


  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


  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/

Contenu connexe

En vedette

2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by HubspotMarius Sescu
 
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTExpeed Software
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsPixeldarts
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthThinkNow
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfmarketingartwork
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024Neil Kimberley
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)contently
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024Albert Qian
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsKurio // The Social Media Age(ncy)
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Search Engine Journal
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summarySpeakerHub
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best PracticesVit Horky
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project managementMindGenius
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
 

En vedette (20)

2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
 
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 

Touch gestureguide

  • 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 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 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 out) 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 in) 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 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 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/