Feedback on new 🍔 and user menus

@eviltrout just deployed the new full height, slide-out-from-the-right hamburger menu.

Try it out and see what you think. We’ll collect feedback here.

10 Likes
  • the “X” should stay fixed no matter where we scroll

  • clicking on the body should dismiss the hamburger

  • Add a delimiting line between some of the items, particularly above Categories

  • A few of the menu items are strongly related and should be in columns on the same line, this will also save a fair bit of space

(two last bullets are inspired by Chrome hamburger menu)

1 Like

Currently, on Safari (after shift-reload) there’s an always present white thing on the right that covers the hamburger menu button and so on:

2 Likes

On a widescreen, clicking the menu results in the menu being very far to the right of where the user has clicked.

6 Likes

I don’t think that’s avoidable. Here’s me doing ultra-widescreen with three monitors and Ghost.

Also, that’s not a knoife. This is a knoife.

1 Like

Of course it’s avoidable; it could be full height and pop down from where the actual menu button is. Does being right-aligned with the window add any value by it’s own?

4 Likes

Mmm… is there something going to be added that makes this slide-out menu more worthwhile?

Right now:

  • It takes up a lot more screen space (I switched to height: auto, it looked rather silly full height with a small number of categories on display)
  • Is less responsive: you have to click the X instead of clicking anywhere else, like Chrome’s hamburger menu or the previous hamburger menu, and it slides out relatively slowly
  • It no longer works like the buttons around it, which makes for a kind of surprising UI element, not sure this is desirable

It’s not gonna kill me or anything, but I’m not feeling a lot of upsides to this switch at the moment.

8 Likes

Much better use of screen space is the main reason. We have a lot of stuff to show there, including the full category palette.

NB: Hamburger is actually missing a fair bunch of stuff. How pray tell do you get to /top from Hamburger? psst you can’t

It’s broken for right-to-left layouts. transform: translateX(330px); pushes the menu in the wrong direction. I just set a PR to fix it.

4 Likes

At a reasonable window width, the top right menu icons are visible in Chrome, but are covered up in Safari. Here’s this topic with Chrome on top and Safari below:

1 Like

Yes. Just updated to v1.4.0.beta10 +5, and now Safari is broken. Can’t see hamburger menu, or notifications, etc. Help!

Why is the UX different here than for all the other top-right menus?

2 Likes

It appears that the hamburger menu slide out is set to “slid out” state on Safari without the menu items and unable to slide it back in.

Another minor annoyance, and this is really nit-picky, is the menu covers the progress bar. So when you are reading a topic, should you open the menu and keep scrolling, you have no idea how far down the topic you really are.

1 Like

Perhaps we should look again at @rewphus’s proposal to merge the user drop-down with it…

5 Likes

Worth considering, but perhaps adopt the same behavior with notifications and search too?

I think it makes the most sense to combine hamburger with user since user has basically nothing on it and they are both “rightmost”

I also really like the idea of one less glyph on the screen a lot.

5 Likes

System won’t let me post screen shot. Replace xx’s to see Safari issue on our site.

You need to use -webkit-transform: translateX (0) and -webkit-transform: translateX (330px) to get it working on Safari

@sam says Safari fixes were already checked in, so you might want to check GitHub before reporting this any more?