Mobile hamburger menu

Patterns
1

Hi everyone,

Does anyone have any testing results which support or refute the following hamburger menu design?

Screenshot_20200221-144714_Chrome
Screenshot_20200221-144714_Chrome1080×2220 129 KB

In the current design, clicking the ‘Living in NSW’ text takes the user to the main ‘Living in NSW’ page and clicking the chevron takes the user to the following list of the ‘Living in NSW’ children pages.

Screenshot_20200221-144721_Chrome
Screenshot_20200221-144721_Chrome1080×2220 243 KB

Thanks in advance.
Mike

1 Like
2

Hey Mike - We have not tested this particular version of a hamburger. So far we have tested the dropdown submenu which was missed by most participants. Everyone wanted to use the hamburger to find things on mobile, but we didn’t have it fully built out.

My initial thought is why this version like a sliding menu that changes the display over using an accoridon style that keeps the user in one view but opens up content? (Hopefully that makes sense, waiting for the morning coffee to kick in…)

1 Like
3

Thanks for your reply @brian_helium - Out of my depth here but I guess the accordion could potentially result in a lot of vertical scrolling, esp if there are multiple levels. @mike.hall ?

4

Thanks Mason and Brian

We have undertaken 4 rounds of testing of the mobile navigation, including an accordion style expanding menu. In one test, the participants had both the existing and accordion style menus, for different tasks. Both performed equally well, with user unaware of any difference.

The only real issue surrounded confusion between clicking on ‘Living in NSW’ and going to the main ‘Living in NSW’ page. This was addressed with the latest design and tested well.

1 Like
5

I understand @mike.hall that adding a label to an icon makes a huge difference too, particularly for the magnifying glass (search) and hamburger (menu). Did that come up in your testing?

6

Hi Jeninifer,

All the relevant testing I’ve undertaken has been on mobile devices which show the labels.

Does anyone else have any research surrounding the lack of labels on desktop?

@rika.johnander did this come up in your testing of the Web Consolidation stuff?

@brian_helium did this come up in your testing of the RMS stuff?

Thanks in advance
Mike

1 Like
7

I love the UXMyths site and they have a post on icons and usability.

Nielsen Norman have also published research on the topic (of course).

And I found this to be a useful article from UX Planet that looks at how text and icons can support one another rather than taking an either/or position.

8

Thanks Jennifer, I’ll check them out now

1 Like
9

Hey Mike, as far as I can tell, we did not test excluding the label from the icon. We have always included it in our wireframes for mobile. On desktop, we do not have a hamburger menu since we show the entire nav, and the search field has the search hint text in it.

Personally, I always include the labels for the same reasons in the articles that Jennifer posted. If a user doesn’t have experience with that icon, they might not know what it does. So I always include the label whenever possible.

1 Like
10

Thanks @brian_helium