Pie Menu. Screenshot of a ficticious menu taken from the interesting demos by Don Hopkins in his page Pie Menu Central   In this case we have clicked on a particular menu (NorthWest) which would trigger the emergence of a sub menu. By courtesy of the author

We, computer users, are very used to the notion of menu, which is strongly associated to menu bars, pop-up or drop-down menus and dialogues of the user interfaces we deal with every day.

Most of them are examples of linear menus, where the options are laid out in a linear fashion, vertically or horizontally, i.e. the options are one under the other or side by side. 

Unlike in linear menus, pie menus lay out the options circularly as if they were pie slices, which gives them their name. 

This is an infrequent type of menu although by no means a new one. Already in 1988 Callahan* and other researchers were comparing pie menus against linear menus on 33 people. They found the that former ones were an average of 15% faster regarding their ability to be located by the user. Nevertheless linear menus were only worse in 50% of the options that lied farthest from the initial point of cursor.

Why, then, haven’t we seen them except in some applications like video games or prototypes of advanced programs like DENIM? (see issue number 122) 

Two weeks ago, during a course held in Stockholm for young professionals of digital design, I asked the students if they thought that a linear menu could be more or less effective than a pie menu. The answer was unanimous and almost immediate. All of them were prone to think that the best by far was the linear one. My own reaction when I wrote the article on DENIM was the same. So used we are to the linear menu, to the “official paradigm”.

Examples of Pie Menus showing the different possibilities. Particularly you can combine circular pie menus along with traditional linear menus. Screenshots taken from Don Hopkins demos in his page Pie Menu Central. By courtesy of the author.

Jason Hong has a page on this type of menu, from which you can download Java programs, including its corresponding source code. According to him there are three main advantages:

• Unlike in linear menus, all the options are at the same distance from the centre. This means that practically all of them fall within our foveal vision avoiding losing them from view. 
  
  
• The target area for selection of a menu option is greater than in linear menus. In fact you can extend the cake portion to the end of the screen.
  
• Human beings tend to recall better the angle of a particular option than its position in a linear list. 

One of the problems of pie menus is that, when clicking on an option, if it has sub-options, they open up, partially occluding the former one, which doesn’t occur with linear menus. A solution to this problem is semi-transparent menus that eliminate the occlusion.

Jason Hong implementation of pie menus. Screenshots of the demos found in his page. Notice the occlusion problem of one menu on top of the other, solved by means of using transparency. Images by courtesy of the author. Click on the image to enlarge it.

Don Hopkins, one of the pioneers of this topic, maintains “Pie Menu Central” where you can find abundant information and links to other pages. Among his work, including pie menus, you can count, among other, SimCity,and The Sims a popular simulation game that uses these menus to control the life of the characters. From this website you can even download ActiveX plug-ins and JavaScript code to add pie menus to your website. You can also see multiple applications of said menus, making use of XML, DHTML, JavaScript and ActiveX. It’s really worth looking at the different demos you can find in this page.

So we come back to the question: if they are more efficient, like the “Fasteroids game lets you test, why don’t they dominate instead of linear menus?

I’ve asked this question to Don Hopkins. His answer deserves a complete issue of this newsletter. Next week we’ll have it.

Jack Callahan, Don Hopkins, Mark Weiser and Ben Shneiderman. “An empirical comparison of pie menus versus linear menus” Proc CHI’88 Human Factors in Computer Systems. Chapter of ACM (March 1982), 190-196

Links of this issue: