usability - TreeTable as a flexible condition/filter editor

I face the task to create condition/filter editor every time I need to develop a data/request/event processing system. As usual, there is no universal one and only solution.

Google shows a lot of various examples:

Some solutions are designed to handle only short logical operations and will explode with longer functions (example 1). Other solutions are ugly because of the layout and information noise. Frankly speaking any approach with some custom layout and default controls seems to be a little big ugly and artificial.

So can universal editor be created?

My answer was: yes, sure. Simple TextArea with syntax highlighting can be used as a universal and flexible editor. It does provide natural support for all operations including copy/paste, free editing, infix notation, simplified navigation, etc. Templates and error highlighting will make such approach user-friendly and simple to start with.

This approach was not fully approved, because free text editing sounds complex almost for everyone.

By the way, I've also spend some time searching for similar questions. My results are:

First suggests to use a form with tree-like layout and default components. Second invents Lisp. Don't get me wrong, I like Lisp quite a lot, but parenthesized Polish prefix notation will drive crazy any ordinary user in 5 minutes max. So I decided to keep strict hierarchy, infix notation, provide some tweaks and make free text editing available in parallel.

Early implementation I can show looks like the following:

So the questions are:

• Do you think this is good approach?


• What will you suggest for condition editing?

Examples

Wireshark filters can be used as an example of the task being solved:

(ip.src >= 192.168.1.0 && ip.src <= 192.168.1.255) || (ip.dst >= 192.168.1.0 && ip.dst <= 192.168.1.255)

Please note, expressions can be complex (4,8 .. 16 lines in C-like form) and some specific functions (COMPARE_ALL for example) sometimes can be used instead of simple AND/OR.

Target audience

The idea is to satisfy experienced users and also let newbies to find their way.

Answer

I find none of the suggested solutions from your question very intuitive. The main problem, IMHO, is the very unnatural ordering of the operators and the components. Everywhere, the 'AND' is the first thing you see. That doesn't fit a users' model how how the components belong together.

As a solution, I'd suggest something like this:

^{download bmml source – Wireframes created with Balsamiq Mockups}

Clicking on a split icon, would allow selecting the split type: and, or, or either...or (exclusive or).

In this solution, you can read the whole structure like you would natural language.