26

I am looking for inspiration on this. We have a Dot.Net web application, where we are building pretty complicated criteria. It works, but I would like to change this, re-shape this, possibly from the ground up.

The idea: Basically there is a background process, we are receiving data. In order for us to parse it, they will set up criteria. We can call it "filter". It probably makes more sense

Example:

  1. If the parsed data, has a "created date" field, that is a weekday, then do something
  2. If the parsed data, has a "code" field, that contains these letters "ABC", then do something else
  3. If the parsed data, has a "amount" field, and that amount is greater than 1000, than do something
  4. If the parsed data, has a "color" field, and that is one of these: "red, blue, green", then do something We are going to let the user go even deeper.

Example: If 1 AND 2 AND 3 AND 4 (from above) are all true, then "do something really specific"

You can go even further: If ((1 AND 2) OR (3 AND 4)) , from above, then "do something different"

I hope you see what I mean

So we have basically 2 steps A. let the user introduce 1, 2, 3, 4 somehow B. let the user make it more complicated

This all works. But in a totally non-user-friendly way.

I was wondering if there is something out there, that is well known, easy to use, easy to understand, that is doing the same thing.

I would really like to get some inspiration to rebuild our User Interface, which is currently using too much dropdownlists, checkboxes and such.

Any suggestions?

4
  • Is user enough competent or motivated (maybe it is professional software for engineers) to use such functions? For general instance, Google has such possibilities in search, but almost nobody uses them. Commented Aug 21, 2012 at 12:08
  • that is a very good question Alex. I am optimistic. :) And I would like to come up with something that even non-competent users should be able to use.
    – Ash
    Commented Aug 21, 2012 at 14:57
  • 3
    You should be very careful when introducing boolean algebra to the end user. If they're not familiar with this, then the semantics of the boolean operators can be really confusing and even misleading. Let's say you have an user that wants a report of all BeNeLux customers. He/she might think something along the lines of: "Show me all customers located in Belgium, Netherlands and Luxembourg". This user wont get any customers in that report! Because noone is located in Belgium, Netherlands AND Luxembourg, they're located in Belgium, Netherlands OR Luxembourg... :-/ Commented Aug 21, 2012 at 20:08
  • Similar questions: ux.stackexchange.com/questions/1737/…, and ux.stackexchange.com/questions/11177/…. Commented Aug 22, 2012 at 11:41

4 Answers 4

10

Perhaps you will find some inspiration through one of these:

9

I am not sure if you have ever worked with the condition builder in Axure Pro 6.5 but it implements the functionality you are trying to handle in a simple and user friendly way

enter image description here

enter image description here

1
  • 1
    this is something I am looking for. i think this is perrty much the same level of user interface / usability as our project ... might be a bit better, but not radical enough for me. I would like to make it easier to understand somehow. problem is, i have no idea how
    – Ash
    Commented Aug 21, 2012 at 12:28
3

Any set of conditions are representable using conjunctive normal form or disjunctive normal form. If you stop supporting conditionals of arbitrary complexity and picked either conjunctive normal form or disjunctive normal form, your UI could become much simpler. Then you could use something akin to campaign monitor's segment creation UI (Replace "Segment: US Residents" with "do something else 2"): Campaign Monitor Segment Creation UI

If you want to allow more complex conditions, then allow users to reference rules directly:

Rule1: If AAA and BBB
Rule2: If not Rule1

If you anticipate complex conditionals, allowing for the creation of subconditions can be incredibly helpful.

1

I think if you abstract the construction of each condition away from the construction of the rule-set (i.e. conditions and actions) it may make things easier.

A prototype speaks a thousand words, so I've put together a rough jsfiddle outline of how I imagine it working. I have also included some screen shots below.

I haven't put anything together for the condition builder, but I think it would work nicely if the result of each condition was as plain-text as possible.

I also haven't added a mechanism for making sub-conditions, but I imagine that after two conditions have been added to a rule it could give the option to create a group. The user could then drag and drop the conditions into the group.

Initial state:

Initial State

First Condition Added:

1 Condition

Second Condition (and an action) Added:

enter image description here

Another Rule added:

enter image description here

4
  • Note: I think I would re-label the "Add another Action" button to "Add another Rule". But then I would have to re-do the screen shots
    – Alex
    Commented Aug 22, 2012 at 9:25
  • Alex, your example is realy nice. Really appreciate that you have wrote this up like this. But as long as functionality goes, I really love superduperfly's first link out of those 3 ... Thanks again!
    – Ash
    Commented Aug 22, 2012 at 15:37
  • No problem @Swoosh, it was an interesting exercise
    – Alex
    Commented Aug 22, 2012 at 23:32
  • Good, very good. perfect work
    – durtto
    Commented Apr 8, 2016 at 19:29

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.