I have to design a screen for configuring notifications for a tool that manages tasks. Tasks are organized into projects.

There are general (or default) user preferences on what notification to be received (e.g. new item is created, status is changed).

And then there is the possibility to customize (i guess people will rarely do that) notification per project (e.g. for a support project I don't want to receive updates that I normally want on my other projects.

The list with projects can be quite long and the list with notification rules also.

I guess some inheritance would be good - all projects inherit the default settings but then you need to know:

  • that there is the possibility to make customization per projects
  • that there are customized projects

How would you do that? Any examples?


I would use a collapsible tree of tri-state checkboxes.

The first level (which would be the only one visible at the beginning) would be for each notification rule. And if no customization by project is made each of those checkboxes will be simply checked or not checked.

And when a user wants customization of a rule he will simply click the "+" symbol to see the projects below the rule. So finally, when only some of the projects are checked, the checkbox in the rule will show the indeterminate state (the 3rd state).

Customized rules will be:

  • easily visible at first glance with the leaf of the tree collapsed: as customized notification rules will be shown with the indeterminate state.
  • easily un-customized by just clicking the checkbox in the notification rule level: the whole sub-tree will change to checked or unchecked all at once.
  • I think that tri-state example is broken (Chrome), I'm checking items and they are checking completely unrelated items from higher levels. Broken or I'm not understanding how to use it, which is a bad sign. May 8 '12 at 4:16
  • @Tyriar: yes I noticed, but I guess is not a bug as the items being checked are not completely unrelated as the nodes seems to share the name and state in different branches... anyway I shared the link to that weird example only to help visualize the idea. May 8 '12 at 4:25
  • @Tyriar: I changed the link to another sample (using another js library) which does share crazy nodes like the previous. And this begins collapsed as I think it should be for this case. May 8 '12 at 4:35
  • Yea, that one works as I expect :) May 8 '12 at 6:04
  • Good suggestion! One thing though - do you think that people will know what that third checkbox state (partially checked) means? May 8 '12 at 16:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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