Suggestion to improve text folding UI

I think that the UI for expanding and collapsing text below headings is clumsy!

Expanding is clean, just click on the ‘three dots’ button, or use the keyboard toggle shortcut.

But collapsing means moving to a completely different location at the foot of the heading dropdown menu, or using the same keyboard shortcut.

If the user is about to use the keyboard for an edit, the keyboard shortcut works well enough.

However, a common use case might be where the user is browsing through a long body of text, using the mouse or trackpad, reviewing its content, by opening and closing successive collapsed sections to take a peek inside.

The present UI offers two awkward choices…

  1. Either
    alternating mouse/trackpad movements between different locations: for scrolling, the expand button, and the click-drag movement for the separate collapse dropdown,

  2. Or
    alternating between mouse/trackpad movements for scrolling, and switching your hand to the keyboard to toggle the shortcut for collapse/expand.

I think that a true ‘toggle button’ would be much better UI. Cleaner, less awkward, and immediately recognisable to all users.

My suggestion would be to change the existing ‘three dots’ button to a true toggle button:

  1. If the text below is hidden then the button to the right of the heading would be a ‘+’ in a circle, always visible

  2. When the button is clicked to expand, the text below is revealed, and the button changes to a ‘-’, but the button disappears as soon as the cursor is moved to another location.

  3. Whenever the cursor is clicked into anywhere in any other heading, its ‘-’ button re-appears.

  4. This means it would be possible to expand and immediately collapse the text below a heading, using a single toggle button, without having to move the cursor.

Hope this all makes sense!

It may be a matter of motor skills training but at this point I find myself doing a lot of screen searching to accomplish folding/unfolding. I think your idea is a good one and it would improve the use of the folding feature, particularly in longer docs (with a lot of folded) which might include cascading folds.

1 Like

Perhaps a disclosure triangle instead of + and -, pointing right when collapsed and down when expanded?

Related folding UI suggestion: folding affordances for headings and list items are inconsistent. Tapping on a heading displays the folding button in the left margin but tapping on a list item does not, so the only way to fold list items (great to see list folding included, by the way) is via the other folding affordances (keyboard button, popup menu).

Any change as per original post above should be applied to headings and list items (and anything else that can fold)