nextcloud / server

ā˜ļø Nextcloud server, a safe home for all your data
https://nextcloud.com
GNU Affero General Public License v3.0
27.34k stars 4.06k forks source link

New file creation dropdown - problem of redundant labels impacting user experience #46979

Open Jerome-Herbinet opened 3 months ago

Jerome-Herbinet commented 3 months ago

We have to think of the section headings and each option underneath them as a single sentence, thus avoiding repetition and unnecessary length.

Currently, we have :

I suggest clearer and lighter formulations:

2024-08-02_09-19

How to use GitHub

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like A clear and concise description of what you want to happen.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

Jerome-Herbinet commented 3 months ago

@nextcloud/designers

solracsf commented 3 months ago

@Jerome-Herbinet noticing that icons are not aligned too; is this a screenshot problem or a real problem?

Jerome-Herbinet commented 3 months ago

@Jerome-Herbinet noticing that icons are not aligned too; is this a screenshot problem or a real problem?

@solracsf it's a bug in the specific context, notably when COOL and OO are both installed. I think that only OO icons are misaligned. I don't know if the bug occurs when only OO is installed.

jancborchardt commented 3 months ago

I wonder if UX-wise and accessibility-wise this might result in less quick interaction. If Iā€™m looking at a button called "Document" itā€™s definitely confusing for a second, as I donā€™t necessarily also look at the heading, while "New document" is self-contained.

Itā€™s a similar thing why "OK/Cancel" is not a good idea for modal button labels, but rather spell out what the button will do, like "Create conversation", even if it repeats the heading.

marcoambrosini commented 3 months ago

If Iā€™m looking at a button called "Document"

Note that you've just clicked a big "+ New" button

jancborchardt commented 2 months ago

Ok sure letā€™s go ahead. :) But I would keep the clarification for:

susnux commented 2 months ago

Before we can do this, I think we need to refactor the menu. Because otherwise it will make no sense for screen readers, as the "heading" you see is just a text leaf, it is not a submenu -> So it will be not "Create new presentation" but just "presentation" -> not good.

See accessibility tree:

Image


So this is possible, but needs refactoring into groups, which is currently not supported by our actions component. I would recommend that we postpone this, so we are able to properly do this also for accessibility.

marcoambrosini commented 2 months ago

@susnux wouldn't longer aria labels solve this issue for screen readers?

susnux commented 2 months ago

That would not make it semantically valid, also if there is a visual label (the button text) then the aria-label must be either the exact same of not provided (will fallback than to the visual label). This is also required for voice activation.

marcoambrosini commented 2 months ago

Got it, thanks for the clarification

but needs refactoring into groups, which is currently not supported by our actions component.

Do you think it makes sense to do this? Do we have other use-cases where this feature would help?

susnux commented 2 months ago

Do you think it makes sense to do this? Do we have other use-cases where this feature would help?

Yes, for example it would improve accessibility for checkboxes / radio buttons within the menu. Because currently we cannot group them logically (I mean buttons with radio semantics not necessary real radio buttons / checkboxes).

jancborchardt commented 1 month ago

Since this is more complex than thought: Here is a screenshot of the current actual "+ New" menu (without duplicate "New spreadsheet" etc entries like in the original post).

And to be honest, the main issue I see here is the sorting. It should be adjusted to this (headings of course included):

image