Techno Rant #1

Hey all, so I have been meaning to write a few short rants about particular areas of technology. These are not meant to be comprehensive, but give me an outlet, and you a window into my inner issues!

The Hamburger Button.

According to Wikipedia the Hamburger Button was designed sometime in the late 70’s to be used on the Xerox Star. Incidentally the Xerox Star started a whole slew of computing concepts that we now all take for granted. The most notable of these was the user interface which in turn gave birth to iconography, like the hamburger. Now don’t get me wrong, good iconography is a really positive thing in computing but I have always found myself feeling uneasy when clicking the hamburger. You see the ‘burger’ is basically a dumping ground for other stuff that doesn’t fit the main UI. In my previous team we used to refer to our equivalent burger icon as the ‘button bin’. It is always featured in a corner, it always spans some sort of submenu and it is wonderfully useful.

Originally this rant was going to completely slate the burger, tell you to stop being so lazy and start making your UI’s work, and maybe if you have too many buttons you have too many features. But then I found myself yet again resorting to implementing them, specifically on areas where action buttons were becoming too cluttered, and I had an epiphany. My problem isn’t with burgers where there is need behind them, my problem is when they are used for the sake of minimalism at the expense of functionality. There are two sites that I have seen that represent the two corners of this problem, firstly the right way — The BBC website. They have a ‘More’ button, which launches into a drop down that pushes the rest of the content out of the way (again providing further clarity to the content within). In itself this isn’t remarkable, but what is is the way that the ‘More’ button repositions itself when responding to the viewport size.

See the way it moves into the free area, only being used when absolutely necessary for space — we like these ones. On the other hand we have the Google Material documentation website (YES someone telling us how to design stuff!) which has a much lazier approach.

Which shows a burger icon (which hides everything apart from search) all the way from standard smart phone dimensions up to a whopping 1480px when it does this

There isn’t even any attempt to try and make the interface work differently, just a bin, full of crap.

It really boils down to whether the burger is being employed as a catch-all. A way to just ‘make it responsive’ when actually there are so many nicer ways of doing it.