Repository navigation
Unstable - The Options menu has become too long and confusing #4652
Description
Observed behavior
After interacting for some time with the new Options menu I have noticed that I am spending considerable amount of time scrolling up and down and getting confused by the position of the menu items.
I am also observing a double scroll-bar in a normal 15.6 inch laptop.
Expected behavior
- Consider removing some options
- Consider reducing the space between the menu items
- Consider reorganizing the menu items in logical groups and adding an icon in front of each menu item to help visually identifying the desired item
Steps to reproduce the issue
- Go to https://unstable.studio.learningequality.org/en/accounts/#/ and sign in
- Open a channel with folders and all of the supported resources
- Click the Options menu for an item
Additional information
long.menu.mp4
Console logs
no errors observed in the console
Usage Details
- OS: Windows 10, Ubuntu
- Browser: Chrome, Firefox
- URL: https://unstable.studio.learningequality.org/
- Caused by: Bulk Edit Release #4635
Activity
pcenov commentedon Aug 16, 2024
@radinamatic
akolson commentedon Aug 19, 2024
Tagging @jtamiace for thoughts on this. cc @marcellamaki
AlexVelezLl commentedon Aug 19, 2024
Just fyi. The menu items are a little less high using KDropdownMenu #4485 (see the screencast), although I don't think that would be enough.
jtamiace commentedon Aug 20, 2024
The menu is indeed quite long. I explored a few different directions and with help from @tomiwaoLE landed on the following recommendation - a nested menu with icons for all edit actions. If this is still too long, we can experiment with reducing space in between the actions.
Following is just notes for the future, and not relevant for immediate fixes:
This is something that we can track in the Google Tag Manager / Google Analytics, to see over time how and whether people are using these features, which can be a data-driven way to help us decide which options we should or shouldn't include - something I don't have insight on currently.
A later improvement for mobile responsiveness can be to use of a bottom-fixed menu to handle this long menu better. It's proving to be useful across many different use cases lately (which is making me wonder if this would be worth considering as a KDS component?). An example from a different feature, which can easily have a back arrow navigation:
radinamatic commentedon Aug 20, 2024
I'm loving the suggestions here but have a couple of comments:
Edit > (option)route, that will mean changes in the user strings for the shortened labels. Not a problem as we have them all (a part fromTitle and descriptionandAll details), but still a change from what we discussed during the UX writing review. cc @marcellamakiTagsis out of place, we do not support editing tags from the new menu at this time.