Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

We are working to show data from a variety of inputs and outputs at a given facility. Each facility can have any number of inputs and any number of outputs.

For example:

Facility 1 takes in the values 323 and 556. It outputs the values 123, 34, 213 and 24. Our current implementation shows that facility four (4) times because every combination of variables must be shown:

Screenshot of table with four rows and three columns. Column 1 is Facility Name, column 2 is Input and column 3 is Output. Each row maps a Facility + Option to Input and Output

I am trying to figure out if there is a more user-friendly way to display the data. We are NOT using Excel (just used it for demonstration purposes, can't show the program), but we can execute any arbitrary code and change the layout of our internal program any way we like.

  • The relationship between the input and output is what is being looked at
  • Range of in and out varies from 0 to 10,000; number also varies but should not be more than 20.
  • There is not a 1:1 mapping between inputs and outputs. Some places may have 3 inputs and 2 outputs or 1 input and 5 outputs, etc.
  • Grid will be live updating
  • The goal is to read the values on the right, have the text on the left give the numbers meaning/context, and for the reader to make some decisions based on that

Each input and output has different critical points. Sometimes the input may be too low, the output may be to high, or vice versa. Manipulating the input affects the corresponding out put but the high and low points vary on a day to day basis and on a per facility basis. This knowledge is all contained in the head of the person using the program, it is not a point that can be referenced.

share|improve this question
    
What is the range of In and Out? Can the inputs and outputs be same for different faculties? I.e. F1(1->2, 1->3) and F2(1->3 ) –  Alexey Kolchenko Jul 30 '13 at 18:46
    
I guess for starters, I'd suggest you don't need to list an item multiple times, so in this particular example, list 'facility 1' once and then show all the options on the right. –  DA01 Jul 30 '13 at 18:49
    
The range of in and out will vary greatly from row to row (0 to 10,000). They could be the same, but it would be coincidental and very short lived (<2 minutes). And the grid will be live updating. Listing all the options to the right is a fine idea, and may be the best I can do, but I was hoping to try to figure out something a little more innovative. –  chris Jul 30 '13 at 18:59
    
And what is the task: to observe selected facility or display all picture? Or some other task? –  Alexey Kolchenko Jul 30 '13 at 19:04
    
The goal is to read the values on the right, have the text on the left give the numbers meaning/context, and for the reader to make some decisions based on that. –  chris Jul 30 '13 at 19:15

3 Answers 3

For the moderate sized set the visualization could be as shown. As numbers are shared, duplicates are eliminated. This allows you to watch for all the three parameters.
enter image description here

UPD. I felt into implementation trap, top right could bring ambiguous results. But the idea is to define which data influence the pointed parameter. So watching for particular parameter becomes easy.

EDIT
May be such views be demonstrative. Although learning curve might be a bit slow, but it's much easy to visually trace the changes than in table. Critical values could be marked in some way. Interactions are supported, too.
enter image description here

Or just simplified version:
enter image description here

share|improve this answer
    
That is a pretty good idea, but, we're looking at over 200 facilities. The area available to display the values is 2104 x 386. EDIT: Upon further reflection I don't think this will work. Take the lower left quadrant for example: Facility 1 has 2 inputs and 2 outputs. The inputs and outputs are unique and separate. With this way there is no way to tell what input is at 4 and 70 EDIT:: It will be scrollable, but I think having animations and such may make the screen more cluttered than the way we are displaying now. But I will do some testing with this and see what it looks like. Thanks. –  chris Jul 30 '13 at 20:23
    
I updated the screen shot in the original post to give a better example. I may have been unintentionally ambiguous the first time. –  chris Jul 30 '13 at 20:34

You could try grouping the inputs and outputs by facility, and show them with some grayscale or color gradients interpolating between 0-1000 (e.g. Input 1000 -> white, 0 -> black)

The facility name isn't repeated but only shows up once, and then have 2 rows one each for Inputs & Outputs. Each row has a fixed size box per entry, and is wide enough for say 10 entries which are ordered from smallest to highest number. If there are say > 10 inputs, then the new entries automatically flow into a second sub-row within the Inputs row.

For each entry, show the actual value clearly and also have a small grayscale or color gradient for a visual representation. This way, the person using the program can quickly scan entries for a single facility to find out if output values are too high without having to read the numbers.

If there is some pattern to the relation between inputs & outputs, e.g. all facilities dealing with a specific product type typically have similar valued inputs & outputs, then you can use some of the space in Facility box to indicate relevant info (also consider grouping the facilities according to type).

Mockup

Above is a rough Paint mockup to show what I mean. I got the colors by keeping one value at max (Red for inputs, Blue for outputs) and then interpolating other 2 colors acc. to the number in the box (color value = 255 * (1000 - Num ) / 1000)

share|improve this answer

Have you considered the use of Tree type structures? With Interactive Branches, Updating over time or each second or even radial graphs?

Your data is large while your display area is small (2104 x 386 is a rather small) while the structure of your data resembles a tree (from your samples)

Facility (a branch) -> Input (another branch) -> Output (leaf)

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.