How to make input/output connections between lots of items easier to make and manage?

Question

I have an application that I'm trying to finish for release that allows a user to link "channel values" together. Here is an example workflow of how this currently works - taking an on-screen fader control, and having its value displayed on a virtual LCD display. This is a straightforward example, but the fader could control one of a hundred lights, cause sound effects to play, and a ton of other scenarios. I feel like the UI will prevent users from being productive with the application.

1. User adds controls to screen

2. User goes to the Channel Actions screen, clicks on the channel they want to add an action for, and clicks Add New to add an Action

3. User picks the Destination through 2 drop-down lists, in this case defining that the value of the fader should go to the LCD text.

4. User adds the selected destination and "enables" the action.

The channel actions list becomes populated:

... and the fader's value now updates the LCD text.

This process can become quite tedious with a number of channels in play:

How can I make this process more intuitive, and as easy/painless as possible for the user?

Answer 1

Have you considered a graphical way to connect these elements?

Check out how Quartz Composer does it: http://sintixerr.files.wordpress.com/2009/02/simplevizjpg-ready.jpg

This is how you could set this up through a nodal UI:

Using drag and drop, this makes it very easy for the user to create his setup in a super intuitive and fast way. Of course you could also start different connections on the slider's 'OUT' node to make e.g. LEDs light up.

If you feel like this makes it too cluttered, I'd consider adding a "Show/Hide setup connections" button.

I realize that this might not be trivial to implement, but it's really one of the most user-friendly ways out there.

Answer 2

You could try something like Object Manager:

This panel allows to configure controls easilly with visual support. Also pay attention, there are source (emitters) elements and destination (receivers) elements in your system. So be smart enough to place only receivers into Channel Destination dropdown list. Consider also other restrictions and limitations.

Some tricks to increase performance are:

• use the tool for receiver direct selection, look at "target" button to the right of channel destination dropdown list. So you could pick a receiver with mouse
• mark binded receivers to show their status, look at yellow triangle in Pipe1 Score. This allows you to determine unbinded receivers in a very quick way. Instead of some mark you could just display value of binded emitter element, that has more sence
• order the properties by importance/frequency and use smart defaults

Answer 3

Beginnner and casual expert tweak mode: any graphical method that (a) works (b) is quick and (c) looks cute so it sells the product on demos.

Expert and bulk update Mode: a TableView, so you can cut-n-paste whole patches, import and export whole setups, edit them as CSV or in excel even; this view is a overview of the setup which can show patterns and highliight errors in a big setup. allow sorting of rows/columns, hiding, everything to allow an operator to do a midnight fix under pressure and LOVE you for it. Colour coding can help (I saw a system that optionally coloured cells according to the numeric values, stepped randomly, so you got contrasts and patterns to spot unusual configurations. Remember, operators get to treat the whole machine and its setup as a single thing, and any way you can help them deal with pproblems at a higher level rather than grubbing around in the basement with a torch and soldering iron (so to speak) will create the loyalty you want as a maker. Good luck Brandon