When dragging is a big drag

Nicholas Allen wrote to me to comment on a piece of UI in our October CTP:
I’m trying out putting an existing domain language into the editor and I’m having some frustration with creating nested concepts and inheritance to existing elements. I have to drag between two elements that are physically far apart and the scrolling is very slow. If I zoom out until the two nodes are on the screen at the same time, I can’t read the text to make the connection. Is there an easier way to create relationships between two existing elements?
There’s an inherent issue with a tree-layout like ours that sometimes things you want to relate semantically can be spatially distant.  We’ve tried to compensate for this by providing two modes in all of our link-creation tools, drag-link and click-click.
In drag-link mode, you mouse-down on the source of the link and drag to the target where you let go. If your target is currently off screen then you can drag to the edge of the screen and it will gradually “bump-scroll” until you get to where you need to be.  As Nicholas found out, if the distance is great then this can be tedious.
In click-click mode, you click on the source of the link and then click again on the target.  Whilst between the two clicks you are free to use the scrollbars on the diagram as normal which is a lot easier when it comes to making a large movement.


Comments (9)

  1. Thanks again for the help! I’ve finished up entering my list of issues into the bug tracker now as well.

  2. This is a big problem with drag-and-drop.

    NeXT solved it, pretty much, with a "shelf" that you could drag stuff to and leave until you needed it. Mac OS 9 and earlier let you use the desktop this way, but the desktop is an inconvenient place to drop stuff.

    For some reason Apple dropped the "shelf" functionality in OS X. Yu can drag stuff to the dock, but when you drag it out again it vanishes. BAD APPLE, NO BISCUIT.

    Luckily, the underlying functionality still works. A clever bloke by the name of Karl Hsu created a program called "XShelf" that gives you the NeXT shelf functionality back.

    OK, Microsoft, the challenge is on. Can you do this?

    XShelf: http://homepage.mac.com/khsu/XShelf/XShelf.html

    The NeXT shelf:


  3. GarethJ says:

    Thanks Peter,

    In Visual Studio, you can usually use the toolbox in just this manner, i.e. drag something to it and later go and grab it. (Although it stays on the toolbox until you explicitly delete it as we assume you might want to use something more than once – I’m not sure if that’s the same as the Shelf you describe).

    We haven’t implemented toolbox support for our designer yet, so this won’t work at present in our tools.

    How would you see a Shelf/Toolbox concept working for a link?

    Would the shelf contain half a link?(i.e. source -> nothing) What would be the experience if the source was deleted? Would the shelf-item disappear?

  4. XShelf removes items from the shelf when you drop them on something: it acts like a temporarily interrupted drag.

    What the shelf would contain would depend on how it’s implemented, but ideally it would be some kind of opaque reference to the object (link, handle, whatever) that could act as a proxy for it.

    If the object was deleted, the icon would disappear.

    If you drag a link onto the shelf, you’d leave a virtual endpoint there. How it’s indicated depends on the user interface. If an object has a fixed number and location of link points, you’d want to leave some indication that one had a proxy in the shelf (dotted line fading out, link to a circled number, whatever), in that case you’d probably want to delete it when you’re done.

    For the toolbox, I think a better approach would be to drag the object into the toolbox, and then let it act as a proxy for the object. You’d drag a link onto it, and it’d connect for a moment then swing out (opportunity for cool special effect here) and connect to the object. Correspondingly, if the toolbox allows it, you could drag a link from the object and it’d again whip over to the real thing when it’s completed…

  5. GarethJ says:

    Great ideas Peter.

    I’ll put them into the mix when we’re reviewing link tool usability.