# Feedback on new 🍔 and user menus

**URL:** https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519
**Category:** UX
**Created:** [25 augustus 2015 om 22:09 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519 "2015-08-25T22:09:49Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [25 augustus 2015 om 22:09 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/1 "2015-08-25T22:09:49Z")

</div>

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

 ![](https://global.discourse-cdn.com/meta/original/3X/3/0/30471807c7221472563e10d63e995d85b675276d.gif) 

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

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [25 augustus 2015 om 22:11 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/2 "2015-08-25T22:11:52Z")

</div>

- 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

 ![](https://global.discourse-cdn.com/meta/original/3X/9/e/9e84e99973bd207bc7a108871a1e1676f8ed35c3.png)

(two last bullets are inspired by Chrome hamburger menu)

---

<div class="post-metadata">

### Author: ![calmh](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/calmh/32/115466_2.png) [@calmh](https://meta.discourse.org/u/calmh)
#### Post date: [25 augustus 2015 om 22:14 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/3 "2015-08-25T22:14:13Z")

</div>

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:

 ![](https://global.discourse-cdn.com/meta/original/3X/9/7/9754a71c0f86ddc2a6cc9917e93f9e883656203e.png)

---

<div class="post-metadata">

### Author: ![Chili](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chili/32/40331_2.png) [@Chili](https://meta.discourse.org/u/Chili)
#### Post date: [25 augustus 2015 om 22:16 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/4 "2015-08-25T22:16:24Z")

</div>

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

 ![](https://global.discourse-cdn.com/meta/original/3X/7/c/7c8cfa08ba39c3955aac607809a639ff404d57b1.png)

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [25 augustus 2015 om 22:19 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/5 "2015-08-25T22:19:19Z")

</div>

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.

 ![](https://global.discourse-cdn.com/meta/original/3X/f/e/fedf89054a0073bda2e8d36e3e51178ca4627fa5.png)

---

<div class="post-metadata">

### Author: ![calmh](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/calmh/32/115466_2.png) [@calmh](https://meta.discourse.org/u/calmh)
#### Post date: [25 augustus 2015 om 22:23 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/6 "2015-08-25T22:23:11Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![Yuun](https://avatars.discourse-cdn.com/v4/letter/y/977dab/32.png) [@Yuun](https://meta.discourse.org/u/Yuun)
#### Post date: [25 augustus 2015 om 22:43 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/7 "2015-08-25T22:43:45Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [25 augustus 2015 om 23:10 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/8 "2015-08-25T23:10:30Z")

</div>

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

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [25 augustus 2015 om 23:37 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/9 "2015-08-25T23:37:40Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![barryparr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/barryparr/32/105155_2.png) [@barryparr](https://meta.discourse.org/u/barryparr)
#### Post date: [25 augustus 2015 om 23:45 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/10 "2015-08-25T23:45:58Z")

</div>

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:

 ![](https://global.discourse-cdn.com/meta/original/3X/9/a/9a3aa4aa7386c26829ec6ccdbe2957b61ed81fa0.png)

---

<div class="post-metadata">

### Author: ![Rick\_Leckrone](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rick_leckrone/32/116477_2.png) [@Rick\_Leckrone](https://meta.discourse.org/u/Rick_Leckrone)
#### Post date: [25 augustus 2015 om 23:53 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/11 "2015-08-25T23:53:09Z")

</div>

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

---

<div class="post-metadata">

### Author: ![downey](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/downey/32/166878_2.png) [@downey](https://meta.discourse.org/u/downey)
#### Post date: [25 augustus 2015 om 23:54 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/12 "2015-08-25T23:54:08Z")

</div>

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

---

<div class="post-metadata">

### Author: ![Rick\_Leckrone](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rick_leckrone/32/116477_2.png) [@Rick\_Leckrone](https://meta.discourse.org/u/Rick_Leckrone)
#### Post date: [25 augustus 2015 om 23:56 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/13 "2015-08-25T23:56:15Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![cpradio](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cpradio/32/4970_2.png) [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [26 augustus 2015 om 00:00 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/14 "2015-08-26T00:00:16Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [26 augustus 2015 om 00:02 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/15 "2015-08-26T00:02:25Z")

</div>

> [@downey](#):
>
> Why is the UX different here than for all the other top-right menus?

Perhaps we should look again at @rewphus’s [proposal to merge the user drop-down](https://meta.discourse.org/t/full-height-slide-out-hamburger-menu/29789/8) with it..

---

<div class="post-metadata">

### Author: ![downey](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/downey/32/166878_2.png) [@downey](https://meta.discourse.org/u/downey)
#### Post date: [26 augustus 2015 om 00:03 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/16 "2015-08-26T00:03:15Z")

</div>

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

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [26 augustus 2015 om 00:04 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/17 "2015-08-26T00:04:07Z")

</div>

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

 ![](https://global.discourse-cdn.com/meta/original/3X/d/8/d81525f44bc7406e55dcb2910ed39e6749a09b5a.png)

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

---

<div class="post-metadata">

### Author: ![Rick\_Leckrone](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rick_leckrone/32/116477_2.png) [@Rick\_Leckrone](https://meta.discourse.org/u/Rick_Leckrone)
#### Post date: [26 augustus 2015 om 00:04 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/18 "2015-08-26T00:04:42Z")

</div>

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

[](https://dl.dropboxusercontent.com/s/j3qhnulhbv2beko/Screenshot%202015-08-25%2017.01.45.png?dl=1)

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [26 augustus 2015 om 00:13 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/19 "2015-08-26T00:13:57Z")

</div>

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

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [26 augustus 2015 om 00:14 UTC](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519/20 "2015-08-26T00:14:22Z")

</div>

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

[Next page](https://meta.discourse.org/t/feedback-on-new-hamburger-and-user-menus/32519.md?page=2)
