My school has a form students complete before attending where they can check off what clubs they may be interested in. (There are over 100 possible clubs so it is a rather large form). The current set up is a page that lists all the clubs and a short description of each. They then go to the next page where they can check off every club they may be interested in joining.

The problem is that there are so many clubs that by the time they get to the page where they can check a box, they forget what clubs are about. We cannot display the club description on the form because it is too cluttered.

What could be a good way to set this up where students can see the description of a club and check off that they are interested without having too much information and text on a page?

  • 2
    Re: close vote: this is not too broad, it is a fairly specific question about how to present a multi-select interface with a large number of items. Mar 26, 2014 at 19:30

3 Answers 3


Why not allow them to select the clubs in the first page itself. I would suggest a simple layout like this


download bmml source – Wireframes created with Balsamiq Mockups

Once the user ticks off a club,give him a visual indicator which informs him of which all clubs he has joined as shown below


download bmml source

Facebook allows you to select interests with a similar layout as shown below

enter image description here


Why not hide the description in a div that slides down or some other such method if you click the title of the club or a button that says "view description".

Then you can have all the descriptions and the checkboxes on the same page without it getting too cluttered.


Start by Categorizing

My high school did the same thing but on one big long paper when it was time for choosing electives. Having the courses listed by category made it easier to go through.

You can create a series of filters in a tabular list that allows users to see and drill down to more detail if needed.

Coursera.org has a pretty great system for this. The entire course list can be dynamically filtered by category and the filters are persistent on the left. They also have search as a primary option for their course list page. Students can select "Add" to save their options on the go while they continue to browse.

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.