View Issue Details
ID | Project | Category | View Status | Date Submitted | Last Update |
---|---|---|---|---|---|
0017066 | MMW 5 | Skinning framework | public | 2020-11-10 01:54 | 2021-02-10 20:18 |
Reporter | peke | Assigned To | |||
Priority | immediate | Severity | major | Reproducibility | always |
Status | resolved | Resolution | no change required | ||
Summary | 0017066: Material design: Guidelines to Icons representing menus and/or more options in Material design | ||||
Description | To make things much clear which and what specific Menu icons represent I've found that for material design needs three types of Icons are mostly used and are commonly accepted all over the multi platforms (eg. iOS, MacOS, Android, Windows, Linux) and various apps based on material design: '≡' - "Hamburger Menu" (Three horizontal lines) / U+2261; https://www.compart.com/en/unicode/U+2261 Google Chrome uses an image similar to Identical To and calls it the Chrome menu. It has also been called the "hamburger" icon, "hotdog" icon, Options menu, Menu button, Overflow menu, Side menu, Menu drawer... According to https://design.google.com/icons/ the icon is called "menu". https://material.io/resources/icons/?icon=menu&style=baseline '⋮' - "3 vertical dots" / Vertical Ellipsis U+22EE; https://www.compart.com/en/unicode/U+22EE Google+ for desktop seems to use this as a menu for communities. The Google+ app uses this icon as a standard menu icon. According to https://design.google.com/icons/ the icon is called "more vert". https://material.io/resources/icons/?icon=more_vert&style=baseline '⋯' - "3 horizontal dots" Horizontal Ellipsis U+22EF; https://www.compart.com/en/unicode/U+22EF Apple uses the horizontal ellipsis and calls it the More Options icon. According to https://design.google.com/icons/ the icon is called "more horiz". Same icon is Used in Microsoft Edge For More options top right https://material.io/resources/icons/?icon=more_horiz&style=baseline | ||||
Tags | No tags attached. | ||||
Fixed in build | |||||
|
|
|
Based on that assumption Now Playing Menu Icon is wrong and should Use Hamburger Menu Icon to be clear what it represents. |
|
Re: Now Playing menus being hamburger: I don't believe so. The hamburger icon is typically used for mobile-first applications to expand a large menu, typically for navigation (see https://mmenujs.com, https://www.google.com/maps). And critically, they are used as a main menu. You don't see multiple hamburger menus on one screen. The three dots icon is typically used for in-context menus. In the name, it implies "more [information, options, etc]". I believe that the currently used icons in the now playing screen are the most appropriate icons in this situation. As for the more options menu on the collections and nodes screen, *maybe* you could switch to horizontal dots if you want to, but I think vertical dots also work. |
|
I would disagree on that. Now playing menu is "Main Menu" for Now Playing controls and not just additional more menu, but if we treat it as is more menu or additional options then it is position wrongly and It should be on Right side of Now playing Title not left. No one expects Main menu/options of now playing to be on left side but on right side like for tree or Albums/Playlist/artist/... I have not seen any application that uses 3 vertical dots on left side of area that needs to control I have only seen Hamburger menu on that position and thus my initial suggestions. You are both right Hamburger menu is Main primary menu and is correctly used when you disable menu bar in View, so to make UI consistent We should align 3 vertical dots menu to right instead Left like in Tree. Even as pointed Gmail it uses as last icon on right. |
|
This discussion is academic wrt 5.0 since we're not going to make drastic changes at this stage of development. As to the future, I don't think that your proposal adds to MMW5 or in any way improves the UI--it's different, but not necessarily better. Closing, but feel free to re-open if you come up with some dramatically improved proposal over the current UI. |