gilles bailly eric lecolinet laurence nigay

40
Flower Menus: A New Type of Marking Menus with Large Menu Breadth, Within Groups and Efficient Expert Mode Memorization Gilles Bailly Eric Lecolinet Laurence Nigay Grenoble France Paris France 1

Upload: lovie

Post on 24-Feb-2016

52 views

Category:

Documents


0 download

DESCRIPTION

Grenoble France. Paris France. Flower Menus: A New Type of Marking Menus with Large Menu Breadth , Within Groups and Efficient Expert Mode Memorization. Gilles Bailly Eric Lecolinet Laurence Nigay. Introduction. Marking menus [Kurtenbach & al. 91]. Novice Mode. Expert Mode. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower Menus: A New Type of Marking Menus with Large Menu Breadth, Within Groups and Efficient Expert Mode Memorization

Gilles BaillyEric LecolinetLaurence Nigay

GrenobleFrance

ParisFrance

1

Page 2: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Introduction

• Marking menus [Kurtenbach & al. 91]

Novice Mode Expert Mode

2

Page 3: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Marking menus

• Advantages– Circular design– Fluid Transition– Eyes-free Selection

• Scale Independence

Novice Mode Expert Mode

3

Page 4: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Marking menus

• Limitations• Limited number of commands

–Menu depth: number of levels (hierarchical Marking menus)

–Menu breadth: number of commands at each level

4

Page 5: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Depth: multi-level Marking menus

• Limitation– Error rate in expert mode– Real estate requirement

Novice Mode Expert Mode5

Page 6: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Multi-Stroke menus [Zhao 04]

Novice Mode Expert Mode

• Several simple marks instead of one complex mark – Temporal instead of spatial composition

• Less error prone• Marks can be overlapped

– Less amount of screen space

6

Page 7: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Marking menus

• Limitations– Limited number of commands

–Menu depth: number of levels (hierarchical Marking menus)

–Menu breadth: number of commands at each level

7

Page 8: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Problem

Number of commands at each level (menu breadth)

8

Page 9: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Menu breadth

• Menu breadth

Context menu in PowerPoint16 commands

Limited to 8-12 commands

9

Page 10: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Polygon menus

Polygon Menus [Zhao & al. CHI’06]16 commands

10

Page 11: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Polygon menus

Polygon Menus [Zhao & al. 06]16 commands

11

Page 12: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Polygon menus

Polygon Menus [Zhao & al. 06]

• Tangential gestures Radial Gestures

• 3 actions– 1 clic– 1 shift– 1 stroke

• Specific layout

Impact on learning and memorization12

Page 13: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Outline

• Introduction

• Flower Menus

• Experiment• Conclusion

13

Page 14: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower menus

• Key features– Large number of commands

– Within groups (groupings)

– Memorization

14

Page 15: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower menus

15

Page 16: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Large number of commands

• Straight and curved gestures– 4 degrees of curvature

16

Page 17: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Degree of curvature

Save

Straight

Save as

Bent

File Search

Cusped

Speech

Pigtail

17

Page 18: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Pilot study• Users could draw gestures precisely

enough ?• Answer: YES

• Bias– Higher variability on diagonals

• specific gesture recognizer– Takes into account user characteristics– Recognition rate: 99% for common configurations

All Bent gestures for the counterclosewise

18

Page 19: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Large number of commands

• 8 orientations

• 4 degrees of curvature

• 2 rotating directions ( Clockwise, counterclockwise )

For each menu level: • Width potential: 56 commands• But of course do not need that many

19

Page 20: Gilles Bailly Eric  Lecolinet Laurence  Nigay

1-4 5-8 9-12 13-16 17-20 21-24 25-280

2

4

6

8

10

12

14

Marking menus

Polygon menus

Flower menus

6 common applications: Word, Excel, Adobe Reader, Firefox, Thunderbird, Photoshop

Distribution of the number of commands

20

Page 21: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower menus

• Large number of commands• Within groups (Groupings)• Memorization

21

Page 22: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Within Groups (groupings)

The « File » Menu in Microsoft Word5 within groups

• Semantic groups at the same level– Separated by a line– No title

• hierarchical groups• Improve visual search

22

Page 23: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Within Groups (groupings)

One within group by branch One within group between two separators

23

Page 24: Gilles Bailly Eric  Lecolinet Laurence  Nigay

1 2 3 4 5 6 7 8 9 10 11 12 130

10

20

30

40

50

60

70

80

Flower menus

6 common applications:Word, Excel, adobe reader, firefox, thunderbird, photoshop

Distribution of the number of commands in within groups

24

Most within groups contain1 or 2 commands

Page 25: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower menus

• Large number of commands• Within groups (groupings)• Memorization

25

Page 26: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Memorization

• Improve learning and memorization– Highlight semantic relationships

• Within groups– Visual organization

• Proximity• Closure (same branch)

26

Page 27: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Flower menus

• Large number of commands• Within groups (groupings)• Memorization

• Eyes-free selection• Hierarchical

27

Page 28: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Multi-level Flower Menus

• Flower menus work in the same way as Multi-Stroke menus– Several simple marks– Overlapped marks

• 2-level Flower menus– Potential: 56 * 56 > 3000

A 3 level Flower menus

28

Page 29: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Outline

• Introduction• Flower Menus

• Experiment

• Conclusion

29

Page 30: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Experiment

• Objective– Learning performance of the expert mode of:

• Flower menus• Polygon menus• Linear menus (Base line)

16 commands in 7 within groups 30

Page 31: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Experiment

• Intentional learning– Users asked to learn the expert mode of the 16 items

• Procedure– Familiarization

– Training phase: from novice to expert mode• Duration: 5mn• Approximatively 2-3 selections for each command

– Testing phase: expert mode selections• Stimulus : the name of the item 31

Page 32: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Summary

18 participants X3 menu techniques X16 commands (16 gestures in expert mode) X 2 repetitions

= 1728 selections

We measured how many items the users are able to select in expert mode.

- Number of items that are recalled32

Page 33: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Results

81%

40% 35%

Flower two times better than PolygonSurprisingly, performance of Linear close to Polygon

33

Page 34: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Possible explanations

• Radial vs « tangential » gestures

• In Polygon menus close itemscan have very different gestures

• User comments– « difficult to recall the gesture while I know the position of the item »

34

Page 35: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Possible explanations

• Marking menus efficiency– Learn the expert mode by repeating the same gesture in novice mode.

• Polygon v.s. Flower– Both based on command repetition– But quite different results

• A simple expert mode• A simple mapping between commands and gestures

35

Page 36: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Subjective Preferences

• 17/18 chose Flower menus as their favorite technique• Best score for criteria:

– Familiarization– Simplicity– Learning – Speed– Accuracy

• User comments– They prefer « gestures starting from the center » with Flower menus

rather than « having to perform two operations » with Polygon menus

36

Page 37: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Outline

• Introduction• Flower Menus• Experiment

• Conclusion

37

Page 38: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Conclusion

• Flower menus– Curved gestures added– Support a large number of commands (20)– Support within & hierarchical groups– Favor learning and memorisation of commands– Eyes-free selection, Scale Independence, Fluid Transition

• Learning experiment– Flower menus offer better performance than Polygon and

Linear menus– We gave some possible explanations

38

Page 39: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Future Work

• Improve gesture recognizer

• Study Implicit Learning

• Compare with classical marking menus– Breadth Organization vs Depth Organization– Impact on learning performance

39

Page 40: Gilles Bailly Eric  Lecolinet Laurence  Nigay

Thank you

Merci

Grazie

40Video: www.gillesbailly.fr