SlideShare a Scribd company logo
1 of 37
Boomerang: Suspendable Drag-and-Drop Interactions Based on a Throw-and-Catch Metaphor Masatomo Kobayashi Takeo Igarashi (The University of Tokyo)
Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
Background Drag & drop is versatile and easy to use. Move Copy Create a shortcut Open (Application specific operations)
Problems while dragging Demo
[object Object],[object Object],[object Object],[object Object],[object Object],Problems while dragging Window-scrolling, switching, etc. are difficult or impossible while dragging.
Problems while dragging    Difficult or impossible while dragging. Switching the active window Scrolling a window Opening a deep folder Switching the active view
Previous work Window-switching Window-scrolling Hovering-based interactions are less efficient than clicking-based ones. hovering hovering
Previous work Using heuristics/prediction Window-switching Fold & Drop [Dragicevic 2004] Drag & Guess [Nishida & Igarashi 2007] Drag & Pop [Baudisch et al. 2003] Many other operations are still difficult or impossible. Rock & Roll [Chapuis & Roussel 2007]
How can we make it possible to perform various operations before dropping, without designing and learning alternative interactions for each operation?
Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
Suspending a dragging operation Catch Throw Suspend  dragging Resume  dragging Any operation
Suspending a dragging operation Demo
Demo summary ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Differences between boomerang  and  cut-and-paste ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Boomerang  is an extension of  drag-and-drop .
Differences between boomerang  and  cut-and-paste ,[object Object],[object Object],Boomerang  is an extension of  drag-and-drop .
Differences between boomerang  and  flicking   ,[object Object],[object Object],Boomerang  is an extension of  drag-and-drop .
How to throw an item & catch it Release the mouse button while dragging Throw Catch Spinning Mark Move the cursor near the mark and press the mouse button
How to throw an item & catch it Release v  >   v 1 v   <  v 2 S 1 S 0 Tracking Dragging S 2 S 3 Tracking Dragging Release Press Drop Throw Press Catch
How to manage a group Make a group Drop item(s) onto thrown item(s) Drag the group Drag the center of the group Separate an item Drag the item directly
How to copy/delete item(s) Copy Throw item(s) upward Delete Throw item(s) downward
How to copy/delete item(s) Copy Delete (Nothing) (Nothing) (Nothing) (Nothing) (Nothing) (Nothing)
Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
Informal study ,[object Object],[object Object]
Early Feedback    Will be useful Feature Feedback Throw-and-catch Grouping Copying, deleting    Exciting    Maybe difficult for novices    Will be useful    Easy to use    Difficult to use    Likely causes errors
Early Feedback Boomerang will be useful. The throw-and-catch interaction is exiting…! Grouping is easy to use.   
Early Feedback The throwing gesture is difficult for novices, isn’t it? 
Early Feedback The copying/deleting feature likely interferes normal throwing gestures…!  I just wanted to throw, but the item was copied.
Early Feedback A mark makes it impossible to interact with the item under the mark.  I cannot click this folder.
Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
Conclusion The throw-and-catch interaction makes dragging operations suspendable. Catch Throw Any operation Boomerang supports grouping, copying, & deleting. Grouping Copying Deleting
Conclusion Temporary Glass Pane Gesture
Conclusion A simple gesture can enhance a common WIMP interface, preserving existing functionalities.
Limitations ,[object Object],[object Object]
Limitations ,[object Object],[object Object]
Limitations ,[object Object],[object Object]
Future Work Perform experiments to assess the advantages and disadvantages of the boomerang technique. Window-switching Window-scrolling ?   Can it improve the performance? ?   How does the user fail to throw and catch?
Thank you.

More Related Content

Similar to Boomerang

Animations in User interfaces
Animations in User interfacesAnimations in User interfaces
Animations in User interfacesKim Nørskov
 
Application Design - Part 3
Application Design - Part 3Application Design - Part 3
Application Design - Part 3Kelley Howell
 
Anti Patterns2008
Anti Patterns2008Anti Patterns2008
Anti Patterns2008Ross Lawley
 
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014Equal Experts
 
[Individual presentation] android fragment
[Individual presentation] android fragment[Individual presentation] android fragment
[Individual presentation] android fragmentGabriele Vecchia
 
Web Animations
Web AnimationsWeb Animations
Web Animationsbsuresh2
 
Job Aid Makeover - Captivate
Job Aid Makeover - CaptivateJob Aid Makeover - Captivate
Job Aid Makeover - CaptivateS. Rose
 
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014Chris Atherton @finiteattention
 
Jing Screen Captures And Screen Casts
Jing Screen Captures And Screen CastsJing Screen Captures And Screen Casts
Jing Screen Captures And Screen CastsAnne Negus
 
Newbie UX: Something I learned about UX (Business vs Design)
Newbie UX: Something I learned about UX (Business vs Design)Newbie UX: Something I learned about UX (Business vs Design)
Newbie UX: Something I learned about UX (Business vs Design)Soon-Aik Chiew
 
HCI Group Project Presentation
HCI Group Project PresentationHCI Group Project Presentation
HCI Group Project Presentationweilong1113
 
Featuring Whiteboards
Featuring WhiteboardsFeaturing Whiteboards
Featuring WhiteboardsJo Hart
 
Sample Storyboard Computers 101
Sample Storyboard Computers 101Sample Storyboard Computers 101
Sample Storyboard Computers 101Jacqueline Lewis
 
Swift Paris - Dealing The Cards
Swift Paris - Dealing The CardsSwift Paris - Dealing The Cards
Swift Paris - Dealing The CardsZenly
 
Microinteractions
MicrointeractionsMicrointeractions
MicrointeractionsDan Saffer
 
UX London Redux - Dan Saffer
UX London Redux - Dan SafferUX London Redux - Dan Saffer
UX London Redux - Dan Saffercpetzny
 

Similar to Boomerang (20)

Animations in User interfaces
Animations in User interfacesAnimations in User interfaces
Animations in User interfaces
 
Application Design - Part 3
Application Design - Part 3Application Design - Part 3
Application Design - Part 3
 
Anti Patterns2008
Anti Patterns2008Anti Patterns2008
Anti Patterns2008
 
Movement Pursuits
Movement PursuitsMovement Pursuits
Movement Pursuits
 
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
 
[Individual presentation] android fragment
[Individual presentation] android fragment[Individual presentation] android fragment
[Individual presentation] android fragment
 
Web Animations
Web AnimationsWeb Animations
Web Animations
 
Job Aid Makeover - Captivate
Job Aid Makeover - CaptivateJob Aid Makeover - Captivate
Job Aid Makeover - Captivate
 
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014"Do I have your attention?" Chris Atherton at UX Cambridge 2014
"Do I have your attention?" Chris Atherton at UX Cambridge 2014
 
Usability
UsabilityUsability
Usability
 
Gestalt principles
Gestalt principlesGestalt principles
Gestalt principles
 
Jing Screen Captures And Screen Casts
Jing Screen Captures And Screen CastsJing Screen Captures And Screen Casts
Jing Screen Captures And Screen Casts
 
Newbie UX: Something I learned about UX (Business vs Design)
Newbie UX: Something I learned about UX (Business vs Design)Newbie UX: Something I learned about UX (Business vs Design)
Newbie UX: Something I learned about UX (Business vs Design)
 
HCI Group Project Presentation
HCI Group Project PresentationHCI Group Project Presentation
HCI Group Project Presentation
 
Featuring Whiteboards
Featuring WhiteboardsFeaturing Whiteboards
Featuring Whiteboards
 
Sample Storyboard Computers 101
Sample Storyboard Computers 101Sample Storyboard Computers 101
Sample Storyboard Computers 101
 
Eblogger tools
Eblogger toolsEblogger tools
Eblogger tools
 
Swift Paris - Dealing The Cards
Swift Paris - Dealing The CardsSwift Paris - Dealing The Cards
Swift Paris - Dealing The Cards
 
Microinteractions
MicrointeractionsMicrointeractions
Microinteractions
 
UX London Redux - Dan Saffer
UX London Redux - Dan SafferUX London Redux - Dan Saffer
UX London Redux - Dan Saffer
 

Recently uploaded

Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGSujit Pal
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Allon Mureinik
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Igalia
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxOnBoard
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 

Recently uploaded (20)

Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAG
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 

Boomerang

  • 1. Boomerang: Suspendable Drag-and-Drop Interactions Based on a Throw-and-Catch Metaphor Masatomo Kobayashi Takeo Igarashi (The University of Tokyo)
  • 2. Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
  • 3. Background Drag & drop is versatile and easy to use. Move Copy Create a shortcut Open (Application specific operations)
  • 5.
  • 6. Problems while dragging  Difficult or impossible while dragging. Switching the active window Scrolling a window Opening a deep folder Switching the active view
  • 7. Previous work Window-switching Window-scrolling Hovering-based interactions are less efficient than clicking-based ones. hovering hovering
  • 8. Previous work Using heuristics/prediction Window-switching Fold & Drop [Dragicevic 2004] Drag & Guess [Nishida & Igarashi 2007] Drag & Pop [Baudisch et al. 2003] Many other operations are still difficult or impossible. Rock & Roll [Chapuis & Roussel 2007]
  • 9. How can we make it possible to perform various operations before dropping, without designing and learning alternative interactions for each operation?
  • 10. Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
  • 11. Suspending a dragging operation Catch Throw Suspend dragging Resume dragging Any operation
  • 12. Suspending a dragging operation Demo
  • 13.
  • 14.
  • 15.
  • 16.
  • 17. How to throw an item & catch it Release the mouse button while dragging Throw Catch Spinning Mark Move the cursor near the mark and press the mouse button
  • 18. How to throw an item & catch it Release v > v 1 v < v 2 S 1 S 0 Tracking Dragging S 2 S 3 Tracking Dragging Release Press Drop Throw Press Catch
  • 19. How to manage a group Make a group Drop item(s) onto thrown item(s) Drag the group Drag the center of the group Separate an item Drag the item directly
  • 20. How to copy/delete item(s) Copy Throw item(s) upward Delete Throw item(s) downward
  • 21. How to copy/delete item(s) Copy Delete (Nothing) (Nothing) (Nothing) (Nothing) (Nothing) (Nothing)
  • 22. Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
  • 23.
  • 24. Early Feedback  Will be useful Feature Feedback Throw-and-catch Grouping Copying, deleting  Exciting  Maybe difficult for novices  Will be useful  Easy to use  Difficult to use  Likely causes errors
  • 25. Early Feedback Boomerang will be useful. The throw-and-catch interaction is exiting…! Grouping is easy to use.   
  • 26. Early Feedback The throwing gesture is difficult for novices, isn’t it? 
  • 27. Early Feedback The copying/deleting feature likely interferes normal throwing gestures…!  I just wanted to throw, but the item was copied.
  • 28. Early Feedback A mark makes it impossible to interact with the item under the mark.  I cannot click this folder.
  • 29. Outline Background & Motivation Our Approach Early Feedback Conclusion & Future Work
  • 30. Conclusion The throw-and-catch interaction makes dragging operations suspendable. Catch Throw Any operation Boomerang supports grouping, copying, & deleting. Grouping Copying Deleting
  • 32. Conclusion A simple gesture can enhance a common WIMP interface, preserving existing functionalities.
  • 33.
  • 34.
  • 35.
  • 36. Future Work Perform experiments to assess the advantages and disadvantages of the boomerang technique. Window-switching Window-scrolling ? Can it improve the performance? ? How does the user fail to throw and catch?