Logic in prototyping - conditional behavior, branching, if/then
To be able to prototype for usability testing and demonstrations there needs to be a bit more intelligence around how experiences are joined up togehter.
If clause example:
If user makes choice a, do x. If user makes choice b, do z. And so on.
Variables:
When user makes a choice/clicks/fills in a field etc. assign a variable. Then allow designer to use variables in an if-clause to make decision which roots to go down.
Thank you :)
Ayhan
shared this idea
36 comments
-
Jonathan Boice
commented
The ability to create a true Drag n Drop Interface, or reorganisable elements.
For example create a list the can be move, and allow another item to move above or blew.
This could be part of a new functional overall call "Behavioural Conditionals"What are Behavioural Conditionals?
Just like you apply swipe left, right up, down or add timer to screen or elements, Behavioural Conditionals. are behaviours that can be applied to elements in the screen, for example it can be moved, or react to sound, to transform between two states based on a variable. a good example might be you design two UI's, one in dark mode and one in light, you can add a Behavioural Conditional, of switching, if ambient light sensor is above or blew a number, or based on time of day.I strongly believe their is a range os these that make a huge difference, and will set Adobe XD apart from other tools.
-
Lucian Cicos
commented
Facebook Origami has an interesting way of handling this. https://origami.design/tutorials/common-interactions/Adding-Logic.html
This logic added, is a MUST HAVE.
its very hard designing in XD all possible stages without this logic. Just take as example a simple "Account"
User is signed in or not? the design and content are totally different. -
Tomasz Czarnecki
commented
Please consider adding Conditional Statements in Prototype Mode.
I imagine this function working somehow as shown on image.
When in prototype mode it would be possible to change Simple Boolean values for example by 1st time visiting page (or other action).
When for example Tester visits Login Page once, it would not appear again in Prototyping Session (it changed its Boolean value from Unvisited (false) to Visited (true).
-
Gonzalo Figueroa
commented
This is a need in order to compete with Axure RP or other softwares that allow you to reduce the amount of screens needed just by using variables. We use a lot of complex prototyping and conditions as of today and not having it is blocking us from moving 100% to XD and drop Axure.
-
Vick Sleiman
commented
Conditional logic is a MUST if you want to create more complex prototypes. The existing setup works well for 'Dribbble designs' and very simple apps, but with the use-cases that we're dealing with in our company, it's impossible to create a functioning prototype without variables and conditional logic. We currently use 'Just in Mind', but as Adobe users and followers we would obviously love to switch to an Adobe tool that can do just as much. Fingers crossed something will be included in the next update!
-
Mahmoud Hijazi
commented
Let's try and create a journey trigger, where the user can create different journeys in the prototype section, and trigger them on action e.g. when user reaches this page or when user does this action start this page, or when this journey ends revert to this page. I believe this could open a great door for people who do testing on big projects such as my self where i need to create a big project and test different aspects without having to switch file all the time.
-
Andri87
commented
Really really waiting for variables management, to make the user flow easier, with fewer artboards, and expand the possibilities of interaction, with multiple navigations.
-
Rajeev
commented
In my view, this is the single most valuable feature in any prototyping tool. Without this, I consider XD as just an eye candy tool like so many on the market today.
-
renatowaj
commented
I would like to be able to apply conditional to an animation.
Example: When you click on certain button, depending on the screen, the action should take a particular screen -
Grant Howarth
commented
This would be great and hopefully the step needed to stop me having to use Axure for prototypes requiring logic.
-
H. Postma
commented
For XD to be useful for any game designer, it must have logic, conditional statements in any form so that a prototype can show some form of gameplay.
-
Anonymous
commented
I object to my idea (logical operators for voice triggers that are in the trigger syntax) being merged with this post.
- My idea is low-hanging fruit that could be implemented very quickly.
- The post my idea has been merged with is on a GENERAL solution to logic, which may be months or years away from being implementedKoen van Niekerk
-
Anonymous
commented
It would be great to have logical operators (AND/OR/NOT etc.) for voice triggers.
Usecase:
- Suppose your prototype asks your user to choose from 3 options (e.g. flavors)
- Suppose only 3 options are available (Strawberry, Chocolate and Vanilla)
- Suppose the user responds (voice) with something else than these 3 options
- Suppose you want your prototype to respond "We don't have that, please choose between Strawberry, Chocolate or Vanilla"
The amount of "wrong" responses is infinite, so you cannot make a trigger for the whole dictionary. But what if:
You can combine voice triggers in an OR function:
trigger : voice
command : strawberry OR chocolate OR vanilla
voice response : coming up!
And cover all other scenarios in a NOT function:
trigger : voice
command : NOT strawberry NOT chocolate NOT banana
voice response : I did't get that, please choose between strawberry, chocolate and vanilla
Possibilities would be almost endless!!
BTW the prototype I attached ONLY responds to the 3 flavors. Saying something else does not trigger a response...
Koen van Niekerk
UX Director, VanBerlo -
Best Of All Films
commented
I will think about it if possible i can make a plugin for that
-
Anthony
commented
Yes I agree we very much need conditional logic!
Once you get to a certain level of sophistication with your model it becomes frustrating for the customer that you can't take it to the next level of reality. Sometimes the customer mistakes this constraint for lack of effort or diligence, which make me look at other tools. -
George Livieratos
commented
Live menu for an item where options related to item can be selected/deselected to configure aforementioned item.
Eg.
Let's say I want to configure a pizza. Let's say I have crust, topping and size and variables.
If I select option #2 from crust, option #4 from the toppings, and the extra large size, I want to the pizza-configuration menu to remember my options before the last one (in this case size).
If I have to create a state for every pizza configuration and I would have to create a massive amount of states. Might as well program it then.
Thanks for your attention.
-
Jess
commented
This is a must for me to starting using Adobe XD and streamline my workflow to stop using Sketch/Axure. Thanks!
-
Fiona
commented
Support conditions in prototyping?
For example, if {{userName}} has {{1 or more items in basket}} then show populated checkout page, else show empty checkout page.
-
Ocube
commented
With all the tools out there, this is why I have always stayed with Axure... I was so delighted when when Adobe came up with XD so you can imagine how let down I was when it did not have any conditional logic.
-
ImpendingDoon
commented
Agreed! For now, I've created a "demo scenario picker" in my prototypes (a type of overlay). Once you hit a fork in the road, you pop up the overlay and then choose your own adventure. Kind of breaks the flow, but I can keep everything in one file. Not awesome, but it's still better than creating multiple versions of prototypes and separate files.