2

I am struggling to google a UI framework that would simplify building UI/UX for interactions like this: (on the example of choosing a car):

  • how many passengers you would expect to be driving: 1, 2, 4, 5-7 (choice is made, let's say 2)
  • do you prefer electric, petrol or diesel? (let's say I choose electric)
    • recommendation: VW e-Up

this is dummy example, but what I mean is .. I'll want to define a certain set of "rules", or "predicates" and I'd like some tool to build that UI for me based on those rules.

I was trying to google for "decision tree" or "expert system", but that brings a ton of some other stuff..

maybe there's proper UX term for such UIs?

thanks in advance and sorry for a noob question.. :)

1
  • It seems like you're seeking a tool that generates a "flow chart" or "decision logic."
    – Tim Huynh
    Jan 6, 2021 at 15:40

3 Answers 3

4

If you're looking for the logic part, this is just an algorithm. Just like you say, a Decision Tree algo (although if you want to use AI you could dive into Incremental Decision Tree)

The UI pattern itself is called Progressive Disclosure.

Progressive disclosure is an interaction design pattern often used for making applications easier to learn and less error-prone. It does that by defering some advanced or rarely used features to a secondary screen.

The classic example of this pattern in action is from the print dialog box in the Mac OS. When you command the system to print a page, only a small subset of choices are exhibited in the dialog box, and if the user wants more advanced options, they can click on the "Show Details" button and reveal these features in a secondary screen.

https://en.wikipedia.org/wiki/Progressive_disclosure

About how to display the UI, it could be different depending on your needs and your own UI library. In general, the most common way is to use a stepper or wizard , but you can create any kind of progressive disclosure experience, such as accordions, tabs or even forms that display different information according to the user's choice.

1
  • 1
    awesome! thanks!
    – 62mkv
    Jan 7, 2021 at 10:26
2

don't know a tool that does this, but I like to use a Decision Matrix:

  • Add variables to take into account and
  • Use a column or row for outcomes

so maybe that fits the bill.

More info in Wikipedia

btw, found there's a Wikipedia entry for Decision Making Software

0

I'm a bit late here... but those sound like filters to me! Zillow does a really good job of this, allowing you to filter homes by bedrooms (eg. 2 or more), price (eg. $1000-$1500), or many other items. You may even have slightly different specific patterns for each category. Again you can check out how Zillow treats specifying beds with a different interaction than specifying price.

Even if your use case is such that you can't show all the options up front and then have them filter down, you can still treat them like filters. AirBnb is a good example of this, where you basically HAVE to select a location and number of people in a form/wizard before it shows you anything. But afterwards, they are still editable with similar interactions you would expect of a filter (plus more filtering options).

Hope its helpful!

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.