Interaction with a grid with complex cells

Question

Problem definition:

• A grid where each column represents an attribute of a task and each row is a task
• One of the columns represents the progress reported on that task
• Multiple persons can be assigned to each task
• Each person reports their own progress
  i.e. let's take a task with only 2 persons working on it (they have an equal amount of work)
  Person1 reports they're done (their progress is 100%)
  Person2 reports 50% done with their part The total progress of the task is 75%
• The cell in the grid displays the total progress (unless clicked)
• Each resource can only report their own progress

How do you convey all this easily?

I've quickly drafted the following mockups (bear in mind it's a wireframe - no graphic design, the transparency is for illustration and will probably not stay):

Friendly, not necessarily clear:

More info, but not necessarily clear:

Scary, all the info, clear if you stick around:

Advanced question: The cells have to show the overall progress when not pressed, since on the very same grid, some tasks might allow only individual reporting, like described above, while others might have shared reporting (i.e. if on the same 2 person task, Person1 is done, they have to report just 50% and when Person2 comes along, they report "say" they're 50% done, but fill in 75%. In this case, the tiny window will look a bit different (suggestions appreciated)

Feedback, thoughts, suggestions, solutions - all welcome and appreciated!

Additional note: my concern is not that the user sees all the extra info. As Ryan pointed out, it's often unnecessary. The problem is that the user might not understand why he typed in "50%", but the cell suddenly shows "75%" (especially since in another cell that is only has the "shared" reporting, what the user types is exactly what he gets...)

Answer 1

I would suggest having one column for individual progress and one for team progress. That way when your user enters his 50%, it will stay 50% and the team progress will show 75%. Your popup then could be only on the team progress cell and simply list all the team members and their progress.

Answer 2

I think the amount of data you display initially would depend a lot on how relevant it is to the user at hand. So, for example, I would imagine that if Martin is logged in, he may only be interested in his progress and the overall progress of the task, not necessarily Ludwig's. This would allow us to eliminate Ludwig's progress from the display.

Of course, we can always have more detailed information presented to the user via a collapsible section to keep it out of the way if it's not necessary (or not usually necessary). This I think is a good compromise.

Answer 3

I like to call this the "itch" - when something gets this awkward-feeling or complicated I try to analyse what doesn't feel right and see if I can get rid of them. It feels awkward to me because the hovering metadata reminds me of the "hover and cover" anti-pattern (see also this PDF on page 32). It also feels like the data wants to "get out" of such a constricting space.

I would look for some kind of information visualisation that can represent multiple users' contributions as part of a whole and think about pulling this information out of one cell.

Since you're presumably locked into the grid format (would love to discuss options other than that, but not really relevant for this question) perhaps you could create a bar accompanying each row that stretches over the full length and fills depending on who's done what. I'm gonna go out on a limb here and try sketching it in ASCII:

[    ][    ][    ][    ][    ][    ] <-- cells in a row
---------|----|--------------------- <-- with each row, a smaller row beneath it
                                         representing completion state
[    ][    ][    ][    ][    ][    ]
-------------------------------|----

[    ][    ][    ][    ][    ][    ]
-------|----------------------------

Each row could be filled to indicate completion. A 100% completed task would have a fully coloured completion row with "100%" in it (or 50%|50% for 2 users, etc). A 75% completed task would have 75% filled with "75%" in the filled part, and a white remainder with "25%" in it. You could use different colours for when multiple people are using it. Perhaps consider entering their names in each segment, though the question is whether it would fit. I would aim for having the row be visually less significant than each major task and use a smaller font size (around 10px). You could have rows like this be hidden immediately and use a button in a cell at the end to show them:

[    ][    ][    ][    ][    ][show completion] <-- hidden state

[    ][    ][    ][    ][    ][hide completion] <-- displayed state
-------|------------------------|--------------

You might find this answer completely useless since you're forced to stick with the cell/popup, but I thought I'd be honest and tell you what I would at least prototype.

Answer 4

Another idea hit me while writing out the previous one: users might not care about specific percentages. If you consider that, it frees you to use plain English for some things instead of mapping them out to boxes with percentages. Taking from your own example:

**Your progress** - [Done!]

For you and 2 others:

**Your progress** - [Nearly done! - 85%] 
- Martin is done!
- Ludwig is halfway done.

For more than 2 people working with you:

**Your progress** [Halfway there! 55%]
- Martin, Ludwig and Esther are done!
- Simon and Chauncey are halfway done.
- Henrik just got started.

For more than 10?

**Your progress** [A ways to go... 15%]
- 5 people are done!
- 7 people are nearly there!
- 1 person just got started.

If you were to go with the popup option I'd test this one and see if people care about other people's percentages. I tend to find that when presented with detailed information, it's more a "make me think" moment than it is added clarity, but YMMV (I don't know who you're designing this for, obviously).

Answer 5

Instead of percentages, you might want to use fractions. To put it another way, you might want to say that each person is responsible for n units of work, of which x units have been completed. You can display the total cell as a percentage, if necessary.

John   :  3  of  5 
Paul   :  4  of  4
George :  0  of  2
You    :  _  of  1
------------------
               58%

Switching to units of work accomplishes two things.

1. It makes estimating much easier. (I'm assuming the users are estimating -- not measuring -- the amount of work done.) The number of choices is reduced from 100 to probably not more than 10.
2. It allows the share of work to be divided unevenly. (John's responsible for 5 units, while you only have 1.)

Here's another way to display the data.

Answer 6

Maybe you just need to clearly indicate what's being calculated.

Hans     50%  x 30% = 15%
Lotti    30%  x 20% =  6%
Jane      0%  x 25% =  0%
You     [80%] x 25% = 20%
-------------------------
                      41%