I'm designing a feature where the user can create forms which then other will be able to fill out ( and either pass or fail). The user will be able to write questions and set which answers (yes or no) are needed to pass the form. There will be cases when user will want to create dependencies between questions.

For example, the user creates a form with a couple of questions. The person taking the form will pass it if he answers correctly on question A, B, C and EITHER D, E or F. If he fails to answer D , E or F correctly he fails the test.

My problem is creating the interaction that allows the user to set/link the dependencies between the questions. How do I show it in the UI? Are there any patterns out there I can use?

Quick mock for sketching attached below!

enter image description here

EDIT: OK thought of something. I'm not certain this solves the issue entirely but it's a step in the right direction. Imagine a column next to the questions with a label called something like 'link/group/dependency' where the user could select a colour or number from a dropdown.

Then explain in a paragraph above the form what the user can do in this view. In this case, explaining that the user can set a number/colour and that questions with the same link/group colour or number only require one of them to be answered correct to be able to pass the form?

New mock attached, in the image, answering correct on either of the questions in the blue 'group' would result the user taking the form to pass it. Thoughts?

enter image description here

  • 1
    I can think of various ways to achieve this, but if honest (and considering a really complex logic some may wish to have), I doubt any will be better than simply providing a test field to type in the condition as they would in a programming language. For instance, the pass condition field may have the value A and B and C and (D or E or F). You can obviously go further and provide more natural syntax like so:A is correct and B is correct... – Izhaki Jun 25 '14 at 20:59
  • Thanks for the reply. I have considered that option but I'm not sure our end user will understand it if I go the 'like programming' way. What I'm trying to accomplish is a more visual and intuitive way of doing it.. – Mumas Jun 26 '14 at 6:39
  • 1
    I can totally understand, but it's worth remembering that sometimes a (visual-)verbal form is easier to interpret than a pure visual one, and I suspect that such might be the case with logic. One visual solution would be to allow users to select questions, group them, apply a logic operator (AND or OR) than ditto for the groups - essentially creating a visual hierarchy. But doubt interpreting this would be easier than a simple logic line of letters and brackets. – Izhaki Jun 26 '14 at 11:43
  • Have a look at this image showing a simple equation in a graphical form (quite a bit of genetic AI uses this type of notation). You are probably to end with something similar to the graphical form on your interface (replacing the * and + signs with AND and OR). I'd ask myself which notation is clearer - the graphical or the plain textual one? – Izhaki Jun 26 '14 at 11:49
  • 1
    Also, any one can use a line of text. Making this interactive would require users to learn how to achieve such task. – Izhaki Jun 26 '14 at 11:52

Have you considered using a drag-and-drop type of interface that allows the user to add and set the questions and then drag lines between them to indicate relationships and dependencies? It could make for a much simpler use experience than trying to create algorithms or expressions.

| improve this answer | |
  • Thanks for the reply! Drag-and-drop has been considered, I thought about two modes, one where you create and arrange the questions, and the second where you set up the 'logic'. However, we can't implement it until we can support drag-and-drop gracefully on both desktop and mobile devices at the same time. – Mumas Jun 26 '14 at 20:36
  • D&D seems horribly slow if you have more than 4 or 5 questions... – Steve Dodier-Lazaro Jun 26 '14 at 21:00
  • Perhaps look at how some of the on-line survey creation tools (Google Surveys, Surveymonkey, etc) accomplish this sort of conditional branching. Not pretty for the user, but it gets the job done fairly efficiently. – Mattynabib Jun 26 '14 at 21:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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