I'm building a WPF UI for configuring some complex business rules; each rule can have many conditions, so I figured I would include a drop-down list of logical operators so that the user could have the flexibility required by the business case.

Basically a rule has a logic and a behavior, and under each rule, each condition also has a logic:

  • Rules' behavior is one of the following:

    • RuleConditionsMustPass: this means a rule is said to pass when the logical operations of all conditions under it evaluate to true.
    • RuleConditionsMustFail: this means a rule is said to pass when the logical operations of all conditions under it evaluate to false.
  • Rules' logic can be one of the following:

    • And: all rules with an "And" logic must pass.
    • Or: among all rules with an "Or" logic, at least one must pass.
    • Xor: among all rules with an "Xor" logic, only one must pass.
  • Similarly, conditions' logic works the same way: given a "RuleConditionsMustPass" behavior, the rule will pass if all "And" conditions pass and if among all "Or" conditions at least one passes and among all "Xor" conditions only one passes.

What I'm wondering, is whether the icons I've chosen for each logical operator make any sense from a UX point of view, and if using a TreeView for this rule configuration feature is the best approach:

enter image description here

Clicking the green "+" button here would add a condition under that rule; clicking the red "-" button would delete that rule. I realize the ComboBox.ItemTemplate is a bit off here, when I'm done with it I'll make sure all items in the dropdown have the same width, and I won't be using the enum names in the directly in the UI.

  • As an aside, I'm also planning to use a red shield-shaped "-" icon instead of the red circle, when the underlying record exists in the database - the shield shape becomes a cue saying "this action will require a confirmation". With that in mind, is it ok to use shield shape green tick /red cross for the "Behavior" dropdown? Oct 25, 2013 at 2:53
  • 1
    At first I was confused, because "and" is listed twice. Then I saw the first "and" is the current selected value and the second "and" on of the list to choose, but still it's irritating.
    – Reeno
    Oct 25, 2013 at 9:37
  • I think your concern has more to do with the width of the dropdown than with the selected value showing up in it. What you're describing is vanilla combobox behavior imho; it would be infuriating to lose your selection whenever you click the control, no? Oct 25, 2013 at 10:46
  • 1
    Why do you needs the icons? How technical are the users of this software?
    – Mark Bubel
    Oct 25, 2013 at 15:50
  • 1
    The icons make no sense, logically speaking. Oct 27, 2013 at 13:41

2 Answers 2


The icons are alright, but I would consider the terminology in general.

  • OR - Same as "match any of the following rules"?
  • AND - Same as "match all of the following rules"?
  • XOR - Same as "match one of the following rules"? At least if there are only 2 options to pick from... If there are more than 2 it gets more complicated.

Maybe it's enough just to have Match all / match one / match any / match none to cover all options, together with the possibility to nest rules.

Example (Itunes Smart Playlists):

Logical operator flow

  • 1
    Actually, your explanation for XOR is wrong. XOR = an odd (uneven) number of the following rules (e.g. 1, 3, 5, ...). Oct 27, 2013 at 16:14
  • Thanks, appreciate it! Updated my answer to hopefully make it clearer. Oct 27, 2013 at 16:35
  • Personally, I would give novice users an option to use XOR or XNOR, it doesn't usually matter for them if both conditions apply anyway. Oct 27, 2013 at 16:47
  • I like this approach - match all/one/any. Nice & simple! Oct 27, 2013 at 18:05
  • Great! Another related question covering the same topic: ux.stackexchange.com/questions/44870/… Oct 27, 2013 at 18:29

Use Venn-diagram symbols as icons.

OR = two overlapping circles, both colored in.

AND = two overlapping circles, overlapping area colored in.

XOR = two overlapping circles, all but overlapping area colored in.


Example from Google search:

enter image description here


A few comments:

  1. The icons in the question don't make logical sense, one is a branch icon, another is a merge icon and I am not sure what the third symbolizes. Logical diagrams that do explain the operators are either Venn diagrams which are easy to understand or switch diagrams, which may seem strange to many users.

  2. XOR is absolutely NOT a "one of" operator, its a "odd (uneven) number of conditions are true" operator.

  3. It doesn't usually matter to simple users if one condition is true or multiple ones.

  4. In a rule system, you need to let users define operators such as NOT and () brackets, otherwise users will have to complicate their rules e.g. X XOR X AND Y OR X XOR X AND Z instead of NOT X AND (Y OR Z).

See this question and its answers for a way to visualize this.

Your Answer

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

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