Drag and Drop is one of those interactions that can really help to make an interface simple to use. — Matt West, Treehouse Blog

Drag and Drop 101

The way we interact with software frequently mimics the way we operate in the physical world. When you want to throw something in the trash you grab it, move the object over the trash can, and drop it inside. Simple, easy, mission accomplished. Now, when you go to delete that useless “MacCleanup” app you downloaded last week, you can do it in the exact same way. What is responsible for this wizardry? It’s thanks to an interface and design paradigm we all know as “drag and drop.”

With drag and drop technology all you have to do is click on an object to hold it and “drag” it while moving your mouse. You then “drop” the object in its desired space by releasing your mouse.

Originally called “click and drag,” drag and drop was introduced in 1984 by Jef Raskin, an expert in human-computer interaction. Jef is best known for starting Macintosh. It’s rumored that drag and drop was created after Jef saw the “click-move-click” method used in Xerox PARC’s Star Information System.

Although Jef claims that he invented the drag and drop tool and introduced it to Apple, other accounts attribute his protégé, Bill Atkinson, with implementing and coding drag and drop into Apple’s software. After its first implementation and many new versions of the Macintosh computer, System 7 was released, which included a new ability to open a document in an application by dropping the document icon onto the application’s icon.

The next major release, System 7.5, extended drag and drop capabilities to common clipboard operations, such as copying or moving text around in a document. While Apple first brought drag and drop into the world of computers, it is now the gold standard of design and UI interfaces.

So what?

Over time, drag and drop has evolved into an incredibly powerful tool, used for much more than just file manipulation. We use drag and drop to organize, design, and even use it within software development. Companies such as Apple, Microsoft, RedHat, IBM, Cisco, etc. all use drag and drop techniques in some form to design and develop their software products.

An obvious alternative to drag and drop design and development is to write code. Coding, while extremely robust, is a very lengthy process that requires a lot of testing to make sure everything works correctly. In addition, most people don’t have the skills or experience to write code successfully. Using drag and drop tools makes design more accessible, speeds up this process and helps lead to fewer errors along the way.

To Code or To Drag?

So what if if you’re trying to create your own app, but want to skip a lot of the repetitive code writing? Drag and drop app development is the answer.

We’ve built a drag and drop development environment for native mobile apps within Dropsource and our early users find it to be a fun and effective way to build apps. Using this method for designing and building out a mobile app dramatically reduces development time and is extremely familiar to most designers and developers. You can choose from pre-designed UI elements and drag and drop them onto the page display, or even use custom user-submitted elements found in our marketplace. Then once you find the perfect element, you can customize it the same way you would in nearly all design software like Canva or Photoshop. When the app is complete, you just click the “Run” button and Dropsource will generate the succinct, native source code for you. It’s that simple.

We’re big fans of drag and drop in development, and have found that when building an app using the drag and drop design method, you can focus much more on design and functionality, rather than sweat the routine details and avoid many common basic coding errors. This makes your job easier and development more fun.

Michael Tchong, founder of Trendscape, said it best:

What IT workers need, like everyone else, is more drag and drop: software so simple that it makes IT ordinary.

We couldn’t agree more.

What do you think about drag and drop?
Would you use a drag and drop tool to build a website?
A mobile app? Desktop app? Enterprise software?
Why or why not? Go ahead and get your comment on.


Check out Dropsource for your next app development project. Our platform helps dev teams efficiently build & ship quality native apps by converting your team’s app designs into concise, extendable native source code.