4

assigning items to a list is well-known UI pattern and is already discussed at ux.se.

Example:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

The case I've stumbled on a few times recently is: Assigning items to a list and display details for the items. The UI pattern is only used for desktop web applications as mobile has different requirements.

I can imagine two approaches:

1. One shared detail view for both lists

Wouldn't the user be confused that one area is used for two different areas?

Side note: The current approach is using one list with checkboxes and provide a filter to show the selected checkboxes only. I like the idea, but it's quite uncommon and it can't handle the 2nd approach:

2. Details for each list - comparison of detailed information possible

Requirement is that I have the possibility to have all 4 views on the same page.

I'm wondering if anyone come up with a proper solution?

How it could look like:

mockup

download bmml source

3
  • I've hated this UI element for years. Takes up too much horizontal space, imo. I'd love to see alternatives.
    – phyrfox
    Commented Jun 8, 2015 at 14:24
  • The details list only presents info on items? Commented Jun 10, 2015 at 2:43
  • I've updated the question with a mock what elements are expected (not the interaction)
    – Gustav
    Commented Jun 10, 2015 at 10:53

2 Answers 2

2

Adding to ThaSaleni, you could separate the list into two parts. "Oscar Awards" at the top and "Oscar Nominees" below that, this way it would be easier to find what the awarded movies are.

enter image description here

1

Here's my suggestion:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Basically you have a list with everything and an inline label to show the movies which actually got the awards.

9
  • 1
    Hi thanks, I like the concept. The major use case is to see the awarded Oscars, who is really interested in the nominated ones? ;)
    – Gustav
    Commented Jun 11, 2015 at 9:30
  • the idea is this is the whole oscar nominees list, highlighting the actual winners, but you could tweak as you like
    – ThaSaleni
    Commented Jun 11, 2015 at 15:43
  • 1
    the problem in my scenario is that their are 1000 nominations and only 5 awards. The user would really lose the overview of the important entries.
    – Gustav
    Commented Jun 12, 2015 at 8:06
  • I get it, :) have you found another way to do it yet|?
    – ThaSaleni
    Commented Jun 12, 2015 at 12:29
  • 1
    whats the whole use case of this scenario? what will the user be looking for and willing to achieve?
    – ThaSaleni
    Commented Jun 12, 2015 at 13:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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