dear community members!
I'm currently working on the solution and have a need to make a blue menu expandable and collapsible. Probably someone has good examples on this pattern? Here is how this is implemented now.
3 Answers
Standard hamburger icon for menu should do. And for closing it, "X" icon seems more appropriate than this chevron up icon you have now.
Otherwise this you have seems good
-
Thank you so much for the answer, also landed on the hamburger Nov 18, 2019 at 9:19
-
Also clickable area of "closing" icon for the menu, in the upper right corner, should have same clickable width as icons to the left, user, question, and chat... Now seems much narrower– xulNov 18, 2019 at 9:29
Your solution is not a common pattern. My take on this would be to have a label with the down arrow.
[LABEL ▼]
Name it depending on whats are the links under the menu. this way it'll be more visible and users will know what to expect when they hover/click it.
Both choices are great! hamburger vs Text with arrow the decision should be based on how much do you want user to see them
the better option in my opinion is to go with text with arrow and use hamburger on Mobile