Request details

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 :)

337 votes
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    Signed in as (Sign out)

    We’ll send you updates on this idea

    Ayhan shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    28 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      Signed in as (Sign out)
      Submitting...
      • renatowaj commented  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        This would be great and hopefully the step needed to stop me having to use Axure for prototypes requiring logic.

      • H. Postma commented  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        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 implemented

        Koen van Niekerk

      • Anonymous commented  ·   ·  Flag as inappropriate

        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

      • Anthony commented  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        This is a must for me to starting using Adobe XD and streamline my workflow to stop using Sketch/Axure. Thanks!

      • Fiona commented  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        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  ·   ·  Flag as inappropriate

        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.

      • Sabine commented  ·   ·  Flag as inappropriate

        Absolutely true! Especially in Lean UX when you want to rapidly iterate and test.

      • John commented  ·   ·  Flag as inappropriate

        Being able to assign a few global variables would be a game-changer IMO.

        An intuitive way is to add simple "if var = x" conditions to the "pick-whip" style hook-ups between each artboard. You could even color code them for easy identification.

        In our workflow, we have an app that has several release phases. Having a "if version=1.2 show/go here" and a "if version=1.3 show/go elsewhere" connection to a button, would help us to keep working in a single XD file, instead of having duplicate files per milestone/build.

        It would also be valuable to implement proper layers or layer comps where those variables could determine visibility. This might be easier and more intuitive to manage and implement than doing variables on an object by object basis (although that should come at some point also).

      • Erin Standley commented  ·   ·  Flag as inappropriate

        This would be very helpful to simulate a user journey. Something even as simple as changing the state of an artboard after an interaction would help.

        For instance, a "My orders" view for an shopping app has an empty cart until a user adds something to their cart. Instead of two separate artboards, there is just one "My orders" that changes its state. This would reduce the possibility of the user ending up back at the first one via some other path because the other interactions on the "My orders" artboard are hooked up to other things.

      • Christian Villegas commented  ·   ·  Flag as inappropriate

        On a mobile device or tablet some interactions are based on specific user input... be it a form field with specific data entry, touch based gesture, or selecting specific items on a single screen in order... this request would be the ability to add those conditional interactions into our prototypes.

      • paul pod commented  ·   ·  Flag as inappropriate

        Would second that, a little more logic will go a long way.

        It's great that we have nice transitions and scrolling but at the end of the day, if building branches based on choices becomes complicated (or not sustainable) it's just more useful to drop into HTML/JS/etc.

        Also allowing variables to be passed and displayed throughout a flow is much more convincing from a user research perspective.

      • Michael Gehrmann commented  ·   ·  Flag as inappropriate

        This is somehow related to https://adobexd.uservoice.com/forums/353007/suggestions/13031871

        To Show the Point for the feature Review, I extended my example to add the ability to switch between two font-faces. This results in 18 Screens and a lot of links between them.

        Check it out here: http://adobe.ly/2dpEmnC

        This is a quite simple Interaction and I limited myself to 2 fonts and 3 colors. And I refrained from adding a third level of interaction because … well … I have a life.

        With Logic and States in the prototyping tool, maybe even hooked to Data, this mess of screens could be massively simplified.

      ← Previous 1

      Feedback and Knowledge Base