1

I have this, which is horribly unstyled but shows the inputs and grouping (which is also described in terms of the HTML structure in more depth here).

enter image description here

Basically, you have a form for a "dictionary term". The term has multiple "meanings". Each meaning has multiple senses. And a sense is just a simple text input for now. So you have a group of meanings, which you can add/remove individual meanings. Within the meaning, you can add/remove senses. Within the sense, you can set the sense in the input.

How can this sort of complicated nested form structure UX be improved (maybe by an entirely non-nested form approach)?

One thing I tried considering is making a multi-page form. You enter the term name on screen one. Click add meaning, takes you to a new page. Click add sense, takes you to a new page. On save, takes you back to the meaning, etc.. But that is clunky, slow, and you lose a lot of context. So not really sure how it can be improved yet.

I'm also taking into consideration how this would work on mobile.

Some research:

1 Answer 1

2

You could try a data tree so that it is clear to users what the hierarchy is. Date tree

Although you can probably implement this in mobile using dropdowns/accordions, I feel that is not very user friendly. In that case you can possibly do some sort of hierarchy on different pages Mobile

I would say just think about what your user would want. Will they be switching back and forth between different hierarchies(i.e. meaning 1 -> sense 1.1 -> meaning 2) or will they stay within the hierarchy (i.e. meaning 1 -> sense 1.1 -> sense 1.2)? If they are switching back and forth, they should be able to switch back and forth between hierarchies seamlessly (data tree). If they are most likely staying within a hierarchy, I see no reason why each cant be on separate pages to reduce excess noise

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.