Drag and drop is one of the most underused features on web applications. Although there are really cool libraries, we haven’t seen a lot of adoption on this front. Using drag and drop on a web application can make it user friendly. It gives users flexibility to easily place and sort objects which can be very difficult and sometimes ugly to accomplish with buttons or links.
Here is a look at seven of the most creative drag and drop web applications:
Incredibly cool application of twitter and drag and drop on a web based application. Play chess with your friend over twitter. Make your move on the chess board by dragging and dropping pieces. ChessTwit uses JQuery library for drag and drop.
Creating a web form requires users to add questions to particular locations and re-arranging questions. This can be best accomplished using drag and drop. JotForm is the first web based drag and drop WYSIWYG form builder. Although it now seems very obvious and now applied on many web form builders, it has taken me many years and 5 iterations to come up with it. You can read about my journey on this 2005 post. JotForm uses script.aculo.us framework for drag and drop.
I’ve stopped using Netflix a few years ago but one of the greatest features I remember was the drag and drop sortable movie queue. You can basically browse around, find the best movies and add them into your queue. Then simply drag and drop movies in your queue to sort order in which you will receive them.
Mockingbird is a web based tool that makes it easy to create mockups of your website or application. Its ease of use and simplicity comes from being able to drag and drop elements into your mockup. Mockingbird uses Cappuccino framework and works on canvas.
280Slides is a beautiful web based drag and drop presentation builder. 280Slidesalso uses Cappuccino framework and works on canvas.
We wish we knew about this application when we designed our recently released iPhone application. We basically cut small iPhone size papers and draw our interfaces on them. This product would have saved us a lot of time. It is simple and quick way to create iPhone mockups.
Pivotal Tracker a cool agile project management tool we use every day in our office. It enables real-time collaboration around a shared, prioritized backlog. Basically, for each feature or bug you create “Stories”, then you carry around these stories from box to box. When you want to start working on a feature simply drag and drop the story to your “Current” bin. How simple and powerful idea! Uses script.aculo.us framework for drag and drop.
Bonus: Devthought’s Header
Devthought is not a web application. It is a personal blog. However, draggable clouds on the blog header is pretty cool. Implemented using MooTools, it is so much fun to play with them. Go ahead. Have a try!