I held a 15 minute presentation in front of the IxDA (Sydney Chapter) in August 2012 about pie / radial menus. I spent a little bit of time talking about their history, and about various classifications of this menu type, and then went into detail about the academic research that has been done in that field. I summarized about 10 articles in this field, but the main body of the academic part is based on an excellent research thesis by Krystian Samp.
All references are on the second last slide, in case you are interested in the source material.
15. The NOVICE
They don’t know the system Needs to see (recognize)
stuff to select it Limited by cognitive load
Therefore...
Not about speed, but rather about findability
How does a novice use a menu?
Visual search Decision Navigation
17. The EXPERT
Knows where stuff is, only has to select it
Limited by motor skills
Therefore…
All about speed and effectiveness
How does an expert use a menu?
Decision Navigation
18.
19. Imagine we had two choices:
Traditional: New:
Cascading line menu Compact radial
(CS) layout menu (CRL)
20. Let’s look at “Visual search” and
“Navigation” separately.
How will our two menus
perform?
21. Visual search
Cascading line menu wins every time.
14% - 31 % faster.
The more items on each level, the clearer the lead.
22. Visual search results
• Cascading line menus are good for visual
search and therefore good for novices,
particularly when there are lots of options to
choose from.
Why is the Cascading line menu better?
• Users are used to lists
• A list has a beginning and an end
• Usually just one established direction of
reading
23. Navigation basics 1
Fitts’ Law
The further something is away,
and the smaller it is,
the harder it is to hit it.
27. Navigation basics 3
Index of
Difficulty +
ID Fitts’ Law ID Steering Law
Outcome:
Pie menu (CRL) – ID of 1.18 – 6.06
Line menu (unfold on hover) – ID of 1 – 21.5
Maths say: line menus are harder to navigate
than pie menus.
29. Navigation - results
Because pie menus are so good at “navigating”,
they are a great solution for expert users.
Why is the pie menu better?
• Generally shorter navigation paths
• No steering tunnels to worry about
30. Visual search + navigation
No clear winner.
Post-task questionnaire:
Users felt the pie menu was more efficient and less error
prone ease of navigation has strong influence on
perception.
31. Error rates
In terms of wrong clicks, both menu types perform quite well:
• Pie menus: 1.6% error rate
• Line menu: 3.7% error rate
But in terms of Navigation Time Variability:
Pie menu
Line menu
This is why in the navigation experiment, the vast majority of participants found line
menus more erroneous, frustrating, and harder to use. The errors they perceived
were not click errors but navigation errors they had to correct.
32. Quick re-cap
NOVICE EXPERT
Decision Decision
Navigation
Line menus or Pie menus
pie menus
33.
34. Pie menus and shortcuts
Imagine this…
<click and hold> <wait>
<pie menu pops up>
Marking /
mousing ahead
<click and hold> <immediate move, only needs
direction, not selection>
35. Pie menus and shortcuts
Advantages of marking:
• Learning by doing, at your own speed
• Muscle memory helps you remember the direction
• If you forget, easy to look it up again
• Self-revealing, in context you don’t have to go looking up a
shortcut
Kurtenbach
and Buxton
36.
37. Pie menus need the human touch
• Clustering items sensibly helps useless for
dynamic menu items
• The easy learning with pie menus only works if
the icons are in consistent positions, so don’t
swap them around without good reason
38. Pie menus need the human touch
• Humans need to sort the items sensibly:
– Level 1: most important item at 12 o’clock
– Level 2: most important item close to level 1 parent item
– Less important items: on both sides of most important item
39. Pie menus need the human touch
• Ideally no more than 8 items on first level: one
every 45 degrees.
40. The problem of SIZE and SHAPE
What to do if … … or if …
A LABEL
IS
REALLY
AND
AND LARGE?
HAS
DOESN LOTS OF
’T WORDS
?
REALLYMIGHT EVEN
FIT? HAVE TO
CHANGE THE
LABELS
41. The problem of SIZE and SHAPE
But at the same time, what if…
BAD!
GOOD!
42. Where does this leave us?
Pie menus are good if: Pie menus are bad if:
• You anticipate having expert • Your menus get filled
users dynamically
• You want to make the • You have lots and lots of
transition from novice to selectable items
expert easy • You need to work with
• The items in the menu are standard interface elements
curated by humans • You need to have very long
• You don’t have too many labels
selectable items per level
• You design for touch
43. References
• Wikipedia: http://en.wikipedia.org/wiki/Pie_menu
• Globalmoxie: http://globalmoxie.com/blog/radial-
menus-for-touch-ui.shtml
• Kurtenbach, G. & Buxton, W. (1994). User learning and
performance with marking menus. Proceedings of CHI
'94, 258-264.
• Hopkins, D (1991). The Design and Implementation of
Pie Menus. Dr Dobb’s Journal, Dec 1991.
• Callahan, J. et al (1988). An Empirical Comparison of
Pie vs. Linear Menu. ACM CHI’88, Washington.
• Samp, K. and Decker, S. (2011). Visual Search in Radial
Menus. : INTERACT 2011, Part IV, LNCS 6949, pp. 248–
255.
• Samp, K. (2011). The Design and Evaluation of Radial
Menus, National University of Ireland, Galway.
44. Thank you!
Matthias “Matty” Schreck
@sardionerak
Yes, this presentation will be on
Slideshare …
…once somebody told me
about digital rights of images I
stole via the Google Image
search.