1

I'm wondering if anyone here can shed some light on working with visualising logic for beginning users.

I am struggling with finding a proper way to display logic such as:

"Item name #1 AND (Item name #2 OR (Item name #3 AND Item name #4))".

It's group within a group. My solution becomes a very literal horizontal representation and becomes very disorienting, while I'm looking for a way to display this sequence more vertically so it fits in the application window better. The problem is that it can contain more than 10 items if the user wants to target a very specific group.

The aim with the application is that it filters users down into a target group for further marketing use. It will be used by people who are not tech-savvy. Thoughts?

Rough sketch: https://i.stack.imgur.com/amhKg.jpg

Improve this question
2
  • Do you have a rough mock of what you have so far?
    – Mike M
    Aug 15, 2017 at 14:26
  • I have added a sketch of what I'm trying to achieve.
    – Wendy Wojenka
    Aug 15, 2017 at 16:01

2 Answers 2

Reset to default
3

Google Data Studio has a filter builder which uses AND / OR. It sounds like you need a display for this.

Google does it by tethering the OR group with an AND that connects them with a line. (It does take a lot of space though):

enter image description here

If you have just simple values, and you only need to display, you can squeeze them together to save space (you could probably get pretty small and still be legible):

enter image description here

If you need interactivity on the users part, you can have them add another AND group similar to the filter builder from Data Studio.

Will users be building their own filters, or is this just for display purposes? If they need to change the order, you could allow some drag handles to move an OR group up and down the chain.

Improve this answer
1
  • I suppose this is indeed the closest to what I'm trying to achieve. Thanks for the input :)
    – Wendy Wojenka
    Aug 16, 2017 at 8:09
-1

Are you asking for a vertical embedding UX for non-techies? Would the traditional Outlining methodology work for you? Use indents, letters and numbers. enter image description here

Or if you need a better horizontal system with parens, use colors. enter image description here

Improve this answer

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