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.

I am interested in defining and maintaining the concept of groups in an html page.

Example:

  • The user define the group of english speaking language countries.
  • Then assign to this groups all countries that are english speaking.
  • The user can see all available groups and assign/modify them.

Is there some standard design for such kind of page in a functionality?

share|improve this question
1  
Sounds like a card sorting exercise. There are multiple sites that provide the function online that you could review. –  Evil Closet Monkey Feb 12 at 20:52
    
@EvilClosetMonkey:I am not sure what is the term "card sorting". I am interested mainly in "capturing a group". What are these sites you are referring in case you are talking about the same thing and I am missing the point? –  Jim Feb 12 at 20:56
    
@EvilClosetMonkey:I found online what you mean.No, this is not what I am looking for. My needs are really simple –  Jim Feb 12 at 21:37
    
Could you give another example? I'm interested in the problem but need more to work off of. –  Mayo Dec 10 at 14:47
    
Have you considered inverting the model? Instead of putting users in groups, why not put tags on users? This sight has an excellent example of tagging which you encountered when you created this question and put it in the "categorization" and "grouped-list" ...groups. –  Henry Taylor Dec 10 at 17:20

3 Answers 3

Does this information already exist?

  • If you're not talking about a quiz, consider using an existing data store to prepopulate your UI. Pulling data on a country's primary language from the CIA World Factbook would help.
  • Something like the Google Earth API can provide the geocoding and user interface allowing you to select territories and to visualize geographical information.
  • On your examplie, it would be interesting to see capability to go back in time to visualize the migration of languages over a geographic area over time.

Define the taxonomy or relationship between these items. Is there nesting in the relationship between territories or are there relationships between languages across countries and dialects that should be presented when depicting the item?

What kind of information is important to a user, and when an item is selected, is it moved from one container to another or is it mirrored?

This is important as the existence of and relationship between these members and groupings can dictate how the user interacts with their representation.

share|improve this answer

This is exactly the kind of process that, because there's so much room to play around, results in multiple solutions that could all be considered reasonable. You might not find a "standard design". You should just use the simplest version that you will work for you.

Take a look at RBAC (Role-Based Access Control) products. RBAC systems, for managing users by assigning them roles and access levels, will have a lot of the UI constructs you are looking for. i.e. create a group (role) and assign items (users) to that role.

I've worked on a basic RBAC we built for internal use. I've provided an overview in the wireframes below.

There's not a lot to it. The key design decision we made was to go with the "layered page" approach to interacting with existing groups. i.e. in the last wireframe below, the user has clicked to edit a group. In this case, the group appears as a "page" layered on top of the main list UI. This is a pattern we borrowed from the Basecamp project management app. The user can interact with the group and get back to the page beneath by either clicking the 'X' or the title of the deeper page (i.e. 'Groups') which has become a link.

You can achieve quite a lot with a carefully applied mix of page layers and modal dialogs.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer

1) Identify your audience (the "user").

2) Learn their goals and which categories they want. Use the language they use as labels.

3) Make a database. This is more technical than UX. Node.JS and MongoDB are good.

share|improve this answer

We're looking for long answers that provide some explanation and context. Don't just give a one-line answer; explain why your answer is right, ideally with citations. Answers that don't include explanations may be removed.

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.