2

Our accordion currently works as follows:

If you click on an item inside the accordion it opens the accordion if there is content under it and it opens a screen next to it. If you click on an open accordion item it closes it. You can navigate to deeper levels by clicking each level. If you click on another item on the same level it closes the others if there is anything open. (so if you click root parent 2 or 3, root parent 1 will close)

Check out this codePen to see how the accordion currently works

Example accordion

The problem:

For example: If you are working on the screen of child 3 and want to return to the screen of parent 1 for a short period of time, it closes the accordion so you'd have to open parent 1 again if you want to return to child 3 which seems like bad a UX.

suggested solution by our team:

  • Just don't be able to close it by clicking an open accordion, and only being able to close it by clicking on something else on the same level or a higher level.

  • Only open and close the accordion by clicking on the chevrons.

  • single click to open the screen and double click to open the accordion.

Improve this question

2 Answers 2

Reset to default
1

From what you describe, it seems that you use the accordion in a sidebar to navigate between screens on a desktop. If this is the case, I would adopt the same behavior as a file explorer: - clicking on the element displays the element (main action), but there's no automatic opening or closing. - another type of action is necessary to open or close a parent category (either a double-click, or a click on a plus / minus icon, or chevrons). (This is the behavior of Windows file explorer, maybe not the best, but at least well known by all Windows users)

Improve this answer
0

I don't see much wrong with the original approach you've described (the one on codepen). I think the accordion is working as expected. The 3 suggested solutions imply two different actions within the accordion blocks, which doesn't seem like a common pattern (and so harder for the user to understand).

Improve this answer
1
  • The problem is that a user might still want to go back to a level deeper and I feel like an extra click is unnecessary. But thank you for your answer
    – Martijn Vissers
    Jun 8, 2018 at 6:31

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.