Welcome to Design Decoded, our new video series. In each video, we’ll trace the history of some popular UX design element and attempt to explain its ubiquity. First up, we took a look at the caret. This time, we’re examining the hamburger menu.
Wanna grab a burger?
No, not one of those. One of these! You’ve seen these before. You know, those three straight lines in the top corner of your screen. That’s called a hamburger. It’s an icon that hides a collapsible menu of possible destinations. Amazon uses it in its mobile app. So does ASOS and the New York Times Cooking app.
While nearly everyone loves actual burgers, not everyone loves the burger icon. In fact, they hate it. We’ll check in with the haters in a minute.
The hamburger icon was designed by Norm Cox for the Xerox Star Personal Work Station in 1981. When you clicked on it, a menu would appear. Working with very few pixels, Cox said he designed the icon to be “road sign simple.” The icon itself looked a lot like the menu that appeared when you clicked on it.
But, it was phased out almost as quickly as it appeared. By the mid-80s, interface designers mostly stopped using it.
So, why am I seeing it everywhere? Because, phones.
Suddenly, designers had to fit everything on a 3.5-inch display, and the burger icon was an easy way to save space. But it wasn’t until Facebook replaced its grid icon with a hamburger in 2010 that it really caught on.
That’s why you see it everywhere, but still, not everyone’s a fan. Remember those haters? UX big shot Mike Stern from Apple famously called it “terrible.” Why? Stern’s beef was that the burger failed to do what any intuitive nav system should: tell you where you are and where else you can go. And they don’t play well with back buttons. Another problem is that users can’t go anywhere or see anything without clicking. It demands a commitment first.
So why do people still use it? Because apps have more information to share, and less space to share it, and designers have to put it somewhere. Whether you’re a burger fan or not, keep your eyes peeled for the meatball, the kebab, and other food-related menu icons. We hope you’re hungry, because you’ll be seeing them everywhere.