Home • Thoughts and Musings • Thomas M. Tuerke on Design • Logical Expressions Visualized |
|||||||||||

## Logical Expressions Visualized
n a deliberate plan for the creation or development of an object. vt: to create something according to plan.good design: /'gud —/ the product of deliberate forethought and careful understanding of the purpose of a subject, resulting in a subject which significantly improves its utility, allowing it to integrate seamlessly and naturally into the role for which it is intended.false synonyms: fashion, decor.Table of Contents [show/hide] Logical Expressions Visualized
If there's one thing that computing has brought to the forefront, it's dealing with logical expressions. We deal with them on a daily basis, but communicating anything more than the most trivial expression to non-technical folks remains a barrier. Part of this is the looseness (some might say illogical sloppiness) that the English language brings to the table. The casual understanding of the terms "and" and "or" is often different than the rigorous understanding, and this leads to confusion on the part of the lay person. For example, "or" is often assumed to mean "exclusive or", as in "would you like carrots or potatoes" (implying you can have one or the other, but generally not both.) And there are times when, linguistically, "and" is used to mean "or" and vice versa. The nebulous use of these conjunctions makes it difficult to use "natural language" to describe complex conditions without carrying forward a lot of that ambiguity. Equally oppressive is the use of mathematical notation. While there are those (typically of a technical nature) that have no problem swallowing, say, a SQL select statement, this is a huge turn-off to the casual software user. So the issue is, how does a designer expose the ability for users—technical or non-technical—to create Mathematical expressions, despite being compact and precise, are off the table for being too hard to understand, as are Natural Language expressions for being a bit too lax. Both of these notations are essentially symbolic, and that, I think, is part of the problem. A more natural way to relate to things is visually, as it's more "tangible" in an everyday sense.
What do I mean? Well, let's take the It turns out that there is a simple, visual way of presenting this. If you place the two
On the other hand, if you place two
This is very useful, because the Visually, too, it should be clear that order does not matter in determining the ultimate result of the expression, reflecting the commutative nature of both In order to make this more visual, the individual operands should be put in boxes, and a box should surround each For example, representing From this representation we could see that the By the same token, and we clearly see that the expression is true, because despite x not being less than 3, y is greater than 5, and so a horizontal path exists. As I said, the state of truth of an expression can be shown by presenting true expressions one way and false another. Here, I've picked green for true, red for false (based on the red stop-light metaphor) but any other visually distinct pairs could be used, too. For example, a heavy ("impenetrable") border might represent false, while a hairline border might represent true. (And, of course, consistent combinations are appropriate, too.) More complex expressions can be built up from these fundamental building blocks. For example, (Note, by the way, that this is just another way of saying a xor b, but in a way that the average person is likely to understand.) Interacting with such an expression, visually, would similarly be intuitive, and could be done without exposing any of the underlying complexities of creating a logical expression. A drag-and-drop gesture would allow the introduction of new term in an expression. "Docking" such a term beside an existing term defines a conjunction ( This covers the two basic Boolean operations, but the one that's missing is negation. Visually, this is represented by the following: Visually, you can see that the single operand of negation is isolated from at least one side of the containing box, while the negated state does extend fully left to right. Theoretically, it could be completely enclosed on all sides, but I wanted the symbol to bring to mind the classical "¬" symbol, also used to represent negation. It's also more compact. From this, it should be obvious to see that you can make very complex expressions quite economically, and in a way that's visually intuitive. Simply by coloring the nodes during evaluation, you can see what the result of an operation is. In spite of the perhaps novel visualization, it's still quite easy to computationally work with expressions that are presented this way (to convert back and forth between TEN and other notations, or evaluate them) since the internal structure is essentially the same hierarchy as traditional expression evaluations. Further aiding presentation is the fact that sub-expressions (that is, any "box") can be collapsed down for visual simplicity; the interior boxes can be hidden, and any text aggregated into a classic written expression, or just an ellipsis.
Share:
This page and all constituent elements are copyright © Thomas M. Tuerke 2017
unless otherwise indicated. The TMT-Diamond Logo is a Servicemark of Thomas M. Tuerke All Rights Reserved Reproduction or distribution without prior written permission is strictly prohibited. Privacy Policy Scripting and DHTML by Technomancer Software technomancer.ws |