Three of the thing: Hamburgers vs Ellipsis menus

A lot has been made of the hamburger menu as a recognized navigation item in Windows 10, especially for phone apps. The thing is, it’s a little bit like another collection of threes: The ellipsis menu button.

How are these similar, you ask? One is an infrequently accessed button containing more buttons, and the other is a tool for holding a bunch of navigation options in a disappearing panel. You tap it, the panel flies out, and you select your target. Easy peasy.

Now, re-read that last paragraph, but switch the controls in your mind. It still describes both. You could place the hamburger button at the bottom right corner of the screen (we’ll come back to this in a second) and it is the ellipsis button. The difference is purely about placement, as both should hold uncommonly used navigation buttons. Putting primary navigation into either control is a recipe for disaster.

Now, I’m a right-handed user, but I know plenty of lefties. Let me tell you, the ellipsis placement on the right of the screen is a problem. Just like putting the hamburger at the top of the screen, putting the ellipsis on the right of the screen limits access for some users.

So, how do we address this? How about using the control properly? Don’t put your primary navigation in the hamburger or ellipsis. Alternatively, don’t use it at all on a phone: If you don’t need the navigation very often, do you need it at all?

Something else to consider (for Windows 10) is all the control developers and designers are about to receive. In Windows 8.x, your control bar was locked to a specific place. That’s no longer the case. You can put it on the top, bottom, sides, even inside other controls. If you want you can have two (or more) controls bars on the same page! As a result, put each bar where it is contextually best, and move it as the user rotates the screen.

Landscape users are often using two hands to hold a device, or have it in laptop mode like a Surface. Take advantage of the extra thumb! Similarly, with portrait assume one handed usage. If they’re using two, it just makes it easier for them.

As a final point, Windows 10 gives the developer the ability to determine the type of device through the use of API Contracts and Device Families. This should inform your design decisions.

This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s