UX: Using a cog wheel icon for the show/hide toggle for the sidebar is confusing, and the button should not be grouped with the form submit buttons

Created on 15 July 2024, about 2 months ago
Updated 26 August 2024, 12 days ago

Problem/Motivation

With a recent change (assuming with Move Action buttons to sticky header Fixed ) the toggle for hiding/showing the sidebar has been moved next to the sticky form submit buttons, and its icon changed from a "sidebar" icon to a "settings" icon (cog wheel). This does not make sense form a UX point of view, since most people are used to have buttons with such icons open a settings form or dialog - not perform any action.

Before:

After:

Also, all other buttons in the sticky header perform an action that's relevant to the form submission (preview/save/delete), whereas the show/hide button toggles a UI element. It just doesn't feel right grouping them together.

Proposed resolution

Restore the previously-used icon for the button, or find an alternative. The cog wheel button should be reserved for settings.
Attache the show/hide toggle to the sidebar itself. When the sidebar is hidden, the toggle should be the only visible element to the side of the screen.

Remaining tasks

Discuss, decide, action accordingly.

User interface changes

The cog wheel icon for the show/hide button for the sidebar is changed back to a "sidebar" icon (or an alternative).
The button is attached to the sidebar itself, rather than being grouped with the form submit buttons.

API changes

N/A?

Data model changes

N/A?

🐛 Bug report
Status

Fixed

Version

3.0

Component

User interface

Created by

🇦🇺Australia klonos 90% Melbourne, Australia - 10% Larissa, Greece

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @klonos
  • Status changed to Postponed about 2 months ago
  • 🇨🇭Switzerland saschaeggi Zurich

    I move this to postponed for now as we're working on other things.

    One can argue over which icon should be used for sure, the sidebar icon indicates worse than the cog wheel. As the default placement of content in the sidebar is somewhat configuration related, it does make sense (opinion might vary of course here).

    One thing I can already tell is that we don't plan in attaching the toggle functionality to the sidebar itself, as we do not have a collapsed state. It is intentionally placed in the sticky header and does perform well in our testing.

  • Status changed to Fixed 26 days ago
  • 🇨🇭Switzerland saschaeggi Zurich

    One can argue over which icon should be used for sure, the sidebar icon potentially indicates worse than the cog wheel. As the default placement of content in the sidebar is somewhat configuration related, it does make sense (opinion might vary of course here).

    We've created a new icon and pushed it today. Closing this as fixed.

  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024