A Brief History of the Hamburger Icon
Written by Karla Urbina / Courtesy of Placeit.net
We have all seen the hamburger icon. As a matter of fact most of us probably use it on a daily basis. It has become a staple in website and app design. I’m even looking at it now on the top right corner of Google Chrome.
Lately, there has been much debate about whether the use of the Hamburger Icon and side menus in general are really a good idea. But more people have been wondering where it came from and how it got to be so widely used.
It was designed by Norm Cox for the Xerox Star, the world’s first graphical user interface. Norm Cox is co-founder of Cox&Hall and has been an interaction/experience design consultant since 1982. He also happened to design the document icon for the same interface. Geoff Alday is the amazing software designer who went searching for creator of the hamburger icon and managed to find this video.
From there he e-mailed mister Norm Cox, who was delighted to share the origin story for the hamburger icon. Here’s what he said:
“Its graphic design was meant to be very “road sign” simple, functionally memorable, and mimic the look of the resulting displayed menu list. With so few pixels to work with, it had to be very distinct, yet simple. I think we only had 16×16 pixels to render the image. (or possibly 13×13… can’t remember exactly).”
After the Xerox Star however, the hamburger icon disappeared for some time.
The Resurrection
With the new, much smaller, interface that smart phones had, designers had to look for a way to make everything fit onto a 4 inch screen. It is unclear what app used it first but some of the first apps that people remember using the hamburger icon are:
Voice Memos from iOS
This seems like it is the oldest occurrence (excluding Xerox) of the hamburger icon as a menu button. It came out June 17, 2009 and was available for the iPhone 3Gs. Clicking on it would bring up the list of recordings and options. Apple had already borrowed the mouse and the desktop from Xerox when it created the Macintosh, a small icon would not matter much.
Tweetie for iPad
Tweetie was the first app available for Twitter, created by Loren Brichter, who happened to be working at Apple at the time. This came out in 2008 and used the hamburger icon for lists. It seems like it is no coincidence that an Apple designer used this icon.
Facebook makes it a trend
Facebook seems to have also been a huge contributor in spreading the use of the hamburger icon for menus. It started out with this grid icon in 2008.
It later added a row to the grid in 2009.
And lastly in 2010 that grid became bars.
Facebook was already using the side menu and all they did was connect that grid. This seems to be one of the most remembered first sightings of the hamburger icon.
It looks like Apple was the biggest reason for the resurgence of the hamburger icon. They brought up the smart phone and the need for a compact display. They were already fans of Xerox’s ideas and they began using it on their interface. From there, huge social media apps took it over and everyone else followed along.
Read the entire article over at placeit.net.
