ASP.Net - Good UI Design Question for Managing large number of items

Question

Hello all,

We're currently working on a solution that involves managing a large number of parts for a project. In our database, we have a project table and we have a parts table. Those parts can be assigned to multiple projects and vise-versa. This is done through a link table.

We're happy on the database side and it wont be changed, however we're a bit stuck on how to display the UI in a user-friendly intuitive way.

There are about 6000 parts (...at the moment) and we need to be able to easily assign/unassign these parts from a project quickly and easily.

Does anyone have any good examples of this?

Answer 1

I'd try a number of things, from a pure UI point of view, if your collection falls naturally into categories, I'm a big fan of cascading lists or a sortable, filterable grid. (or both combined)

Your choice will depend on your users computer literacy as well as space or technology constraints.

If you can spare the space, I think that two lists, perhaps selected items on the left, and the collection of items on the right with affordances such as checkmarks or >> << buttons are great. I'd probably take a page out of Excel's book, it has some perfectly workable examples of this sort of thing.

I'd also take the time to add multi-level undo, working with large datasets is an absolute pain as a user when you have no recourse for simple mistakes, it should ideally track and handle whatever fiddly interaction your user needs to make.

Answer 2

There are two distinct parts to this. The first is selecting parts and projects from the database and the second is associating parts to/from projects. You should try to avoid doing both actions in a single dialog.

From your post, it appears that parts can be assigned to projects and that projects can be assigned to parts. So, a wizard approach might work:

                 project or part?
              /                    \
select project                      select part
        |                               |
show list of parts                  show list of projects
        |                               |
add/remove parts to project         add/remove projects to part

When showing a list of projects/parts, use a simple, sorted list with a filter box. Using a tree or other categorised system can be ambiguous for the user. For example, if the list was of foods and there were categories for fruit and vegetable, where would you put tomato? A shopkeeper whould probably put in in vegetables whereas a botanist would put it in with fruits. So, a simple sorted list with a search box (like FF's about:config) works surprisingly well.

Skizz

Answer 3

I have always found real-time filtering to be pleasant to work with and narrow down things. This can require your users to be somewhat computer literate though...

Furthermore I would consider something with D&D. I would imagine two lists (one with projects and one with modules) where I can multiselect on either list and drag a single item from the other list to that selection.

And if it is going to be an interface that's going to be heavily/repeatedly used, consider good keyboard support. Me personally find that repetetive tasks can be done MUCH faster if they can be accessed by hotkeys.

Just thinking out loud ...