Drag-and-Drop Controls

Q: Are there any usability issues with using drag-and-drop controls in a web application?

Contact us

Drag-and-Drop Controls

Q: Are there any usability issues with using drag-and-drop controls in a web application?

Fill out form to continue
All fields required.
Enter your info once to access all resources.
By submitting this form, you agree to Expero’s Privacy Policy.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Q: Are there any usability issues with using drag-and-drop controls in a web application?

AJAX technology makes it easier to add drag and drop controls to a web application. This is great news. Many times we’ve tested complex web applications where the users asked for drag and drop controls that were not available at the time for the given technology platform.

Download this file to see a video demo of how drag and drop works. (You’ll also need the QuickTime player.)

The advent of AJAX does present at least one major usability issue, though. With drag and drop controls, there is no automatic perceived affordance (the user’s ability to perceive that an action is possible). Since web technologies haven’t commonly supported drag and drop until now, it’s difficult for users to understand when an object in the UI is draggable or droppable. It is especially difficult since the objects don’t usually look different from objects that do not have this functionality. Adding visual affordances such as shading, cursor changes, text and other elements can help to communicate that an item is draggable.

One way to make it more obvious to users that an object has this interaction is to tell them so in the UI. Jared Spool shows an example of how Netflix is teaching users about drag and drop in a June 2005 column.

There is another issue with this functionality, too: performance. Thomas Baekdal notes that in shopping cart applications, drag and drop is over 1000% slower than clicking an “add to cart” button.

Before you decide to implement drag and drop, consider whether it is the right solution for your users. Don’t just implement new technology for new technology’s sake. If you do decide to use drag and drop functionality, make sure to give users a way to notice and learn the interaction.

User Audience

Services & capabilities

Project Details

Technologies

Expero Staff

August 8, 2006

Drag-and-Drop Controls

Q: Are there any usability issues with using drag-and-drop controls in a web application?

Tags:

Q: Are there any usability issues with using drag-and-drop controls in a web application?

AJAX technology makes it easier to add drag and drop controls to a web application. This is great news. Many times we’ve tested complex web applications where the users asked for drag and drop controls that were not available at the time for the given technology platform.

Download this file to see a video demo of how drag and drop works. (You’ll also need the QuickTime player.)

The advent of AJAX does present at least one major usability issue, though. With drag and drop controls, there is no automatic perceived affordance (the user’s ability to perceive that an action is possible). Since web technologies haven’t commonly supported drag and drop until now, it’s difficult for users to understand when an object in the UI is draggable or droppable. It is especially difficult since the objects don’t usually look different from objects that do not have this functionality. Adding visual affordances such as shading, cursor changes, text and other elements can help to communicate that an item is draggable.

One way to make it more obvious to users that an object has this interaction is to tell them so in the UI. Jared Spool shows an example of how Netflix is teaching users about drag and drop in a June 2005 column.

There is another issue with this functionality, too: performance. Thomas Baekdal notes that in shopping cart applications, drag and drop is over 1000% slower than clicking an “add to cart” button.

Before you decide to implement drag and drop, consider whether it is the right solution for your users. Don’t just implement new technology for new technology’s sake. If you do decide to use drag and drop functionality, make sure to give users a way to notice and learn the interaction.

User Audience

Services

Project Details

View Transcript

Similar Resources

Feature Bloat or Genuine Value? Understanding Usefulness vs. Usability

Q: In usability tests, people say our application is easy to use. But in the field, very few users are actually using the app. What should we do?

Watch Demo

The Art of Building Front End Applications for Capital Markets

The webinar will delve into key considerations when designing front-end applications for capital markets, including how to incorporate real-time data visualization and analysis. The role of user engagement in the design stage and during the vetting and implementation of designs will be explored, particularly in how it works with in-house teams, particularly engineering and back-end teams.

Watch Demo

Financial Services Toolkit: Dashboard Demo

  • Transaction History and Recommendations
  • Items for Compliance and Shareable Elements
  • What If' Portfolio Analysis
  • Asset Correlations and Visualizations for Recommendation
Watch Demo

Financial Services Toolkit: Portfolio Demo

  • An In-Depth Look into the Performance Recommendation Widget
  • What If' Scenario Building
  • Sharing Interactions with Jupyter Notebook
  • Running and Editing Scenarios in Jupyter Notebook
Watch Demo