US 2011 00557.60A1 (19) United States (12) Patent Application Publication (10) Pub. No.: US 2011/0055760 A1 DRAYTON et al. (43) Pub. Date: Mar. 3, 2011

(54) METHOD OF PROVIDING A GRAPHICAL Publication Classification USER INTERFACEUSINGA CONCENTRIC (51) Int. Cl G06F 3/048 (2006.01) (52) U.S. Cl...... 71.5/834 (76) Inventors: David Samuel DRAYTON, (57) ABSTRACT Mannheim (DE); Bernd Franz In a a display is animated by activa Lutz, Darmstadt (DE); Marco tion with an input device with a first concentric menu com Tillmann, Niddatal (DE) prising a first grouping of menu items having a Subset of one or more items from a set of menu items. Then, after selecting one menu item out of the first grouping of menu items, the (21) Appl. No.: 12/552,055 display is animated with at least one additional grouping of menu items that are each concentrically in a pie sliced shape. The graphical user interface can be activated by a user at any (22) Filed: Sep. 1, 2009 position on the display area via the input device.

Patent Application Publication Mar. 3, 2011 Sheet 1 of 4 US 2011/005576.0 A1

Fig. 1

Fig. 2 Patent Application Publication Mar. 3, 2011 Sheet 2 of 4 US 2011/005576.0 A1

Fig. 3 Fig. 4

Patent Application Publication Mar. 3, 2011 Sheet 3 of 4 US 2011/005576.0 A1

Fig. 7 Patent Application Publication Mar. 3, 2011 Sheet 4 of 4 US 2011/005576.0 A1

Fig. 8

US 2011/0055760 A1 Mar. 3, 2011

METHOD OF PROVIDING A GRAPHICAL grouping of frequently used menu items is arranged in a first USER INTERFACEUSINGA CONCENTRIC concentric menu, which can easily be accessed at a user MENU defined location on the working space. After selection of a menu item out of the first concentric menu, the display of at FIELD OF THE INVENTION least one additional grouping of menu items is animated, each 0001. The present invention generally relates to the field of of the additional groupings formed concentrically in a pie graphical user interfaces (GUIs), and more particularly, to a sliced shape. Another objective of the present invention is to method of providing a GUI using user-specific animated con provide a machine readable medium storing instructions for centric menus, which are organized in a pie sliced shape, realizing the method of providing a GUI. wherein the main menu is organized in the inlinermost parts of the concentric menu and the Sub-menus are located in the SUMMARY OF THE INVENTION outer parts of the same pie slice shaped menu part. 0005 According to the present invention, a method and system for providing a GUI is provided, wherein the central BACKGROUND OF THE INVENTION portion of the GUI is displayed, after activation via an input 0002 Since actual software programs implicate a continu device. Subsequently, the display of a first concentric menu ously increasing number of functions for the user, graphical comprising a first grouping of menu items and comprising a user interfaces (GUIs). Such as icons, cursors, pop-up win Subset of one or more items from a set of menu items is dows, and menus are of great importance to allow a comfort animated. This subset of menu items can be selected by the able interaction of the user with the software program. Cur user based on importance, including any of frequency of use, rent desktop GUIs typically provide one or more drop-down popularity, historical favorites and can be positioned based on or pop-up menus and a large number of icons to select specific a relationship between individual items. After selection of functions. Traditional menu systems are arranged in a top-to one menu item out of the first grouping of menu items, the bottom linear configuration, where the menu items are logi display of at least one additional grouping of menu items is cally arranged or similar functions are arranged groupwise. animated, each of the additional groupings of menu items Especially, when the list of menu items gets very long, it formed concentrically in a pie sliced shape. These additional becomes difficult for the user to quickly review the list and groupings of menu items can correspond to Sub-menus of the even more difficult to recall from prior selections the exact selected menu item of the first grouping of menu items, the position of specific menu items. The drop-down menus are subset of items being selectable by the user based on impor often nested several layers deep. Each nested layer of the tance, including any of frequency of use, popularity, histori menu structure is usually displayed as a separate drop-down cal favorites and positioned based on a relationship between menu in a rectangular shape that is visually connected to the individual items. This GUI can be activated by a user at any previous layer of the menu structure. When choosing an position on the display area via an input device, when it is option from Such a drop-down menu, the has to be needed. The pie menu can either have a hierarchical structure moved over a path Substantially corresponding to the hori where every menu level corresponds to sub-menus of the level Zontal or vertical lines along which the options are arranged. before or have a non-hierarchical structure, where the single In the case that a graphics tablet is used as an input device to menu items are independent from one another. The present manipulate the Software these precise movements for navi invention further provides a machine readable medium stor gating through a menu structure are very difficult to fulfill ing instructions for implementing the above-described even for an expert user. method and system for providing a GUI. 0003) To facilitate the navigation within GUIs, an alterna tive user-interface technique was developed, the so-called BRIEF DESCRIPTION OF THE DRAWINGS "pie' menus, which are two-dimensional and much easier to use and faster than conventional linear menus. Especially for 0006 FIG. 1 illustrates an illustrated embodiment of a first the usage with alternative pointing devices as data-tablets or concentric menu. touchscreens, this special menu structure allows a quick navi 0007 FIG. 2 illustrates exemplary frames for the anima gation through the different menu layers. The pie menus are tion of the first concentric menu. round menus, wherein the menu items are positioned around 0008 FIG. 3 illustrates an illustrated embodiment of a the center. The target regions are shaped like the slices of a hierarchical concentric menu with a pie slice shaped Sub pie, and the cursor starts in the center of the menu in an C. inactive region. The active regions are all adjacent to the 0009 FIG. 4 illustrates an illustrated embodiment of a cursor, but each in different directions (, Dr. non-hierarchical concentric menu with a pie slice shaped Dobb's Journal, December 1991). Most known pie menus Sub-menu. only contain one menu layer with selectable menu items. 0010 FIG. 5 illustrates another illustrated embodiment of Therefore, a limited number of menu functions can be the concentric menu, where the number of second level menu accessed using such a menu structure. Alternatively, after items is already implicated at the border of the first concentric selection of a menu item, a second menu, which can be either C. a linear menu or a further circular menu, appears (Kurtenbach 0011 FIG. 6 illustrates an illustrated embodiment of the & Buxton, Proceedings of InterCHI '93, 1993, 482-487). concentric menu with a pie slice shaped Sub-menu, wherein These structures are complicated, require wide movements of the active menu item is highlighted. the cursor and cannot be navigated intuitively. 0012 FIG. 7 illustrates an illustrated embodiment of the concentric menu with a pie slice shaped sub-menu and mixed OBJECT OF THE INVENTION levels of granularity. 0004. It is therefore an object of the present invention to 0013 FIG. 8 illustrates an illustrated embodiment of the provide a method and system for providing a GUI, wherein a concentric menu with a pie slice shaped Sub-menu, wherein US 2011/0055760 A1 Mar. 3, 2011

the content of the activated menu item is displayed in the menu, it is possible to work with the GUI directly on a central position of the graphical user interface. graphical object and still seeing the details of this object. 0014 FIG. 9 illustrates an illustrated embodiment of the 0018. After animation of the display of the first concentric concentric menu with a pie slice shaped sub-menu and radi menu, the user can select one menu item out of the first ally oriented labeling of the menu items. grouping of menu items. The individual menu item can be selected by activation via the input device or preferably by DETAILED DESCRIPTION OF THE PREFERRED positioning the cursor on the specific menu item. In this case, EMBODIMENTS the navigation through the GUI is achieved just by moving the cursor over the desired menu items. The selection of a specific 0015 The present invention will now be described with menu item occurs then by activation via the input device. In reference to the accompanying drawings which show specific contrast to conventional GUIs, every menu item is used for illustrated embodiments of the GUI by which the invention structuring the GUI and a specific function can be accessed by may be practiced. The present disclosure is considered as an activation via the input device. The selection of one menu exemplification of the principles of the invention and the item out of the first grouping of menu items results in the associated functional specifications and is not intended to animation of the display of at least one additional grouping of limit the scope of the invention to the embodiments illus menu items. Each of the additional groupings of menu items trated. Those skilled in the art will envision many other pos is formed concentrically and sequentially in a pie sliced sible variations of the concentric menu within the scope of the shape. The presentation of those additional groupings of present invention. menu items depends on the basic structure of the menu, which 0016 FIG. 1 illustrates an illustrated embodiment of the may be hierarchical or non-hierarchical. first concentric menu. A first grouping of menu items 1 is 0019 FIG. 3 illustrates an illustrated embodiment of a displayed in a circular arrangement, comprising a Subset of hierarchical concentric menu with a pie slice shaped Sub items 10, 20, 30 and 40 from a set of menu items. Throughout menu. In this example, the level 1 menu item 20 is selected the drawings, menu items are labeled as numerals; however and two additional groupings of menu items (level 2 and level these numerals are implemented as text, icons or other sym 3) are displayed. In this specific embodiment, the level 2 bols frequently used as menu items. In the FIG. 1 configura menu items 21 and 22 correspond to Sub-menus of the tion, the menu items of greater importance are placed in the selected level 1 menu item 20. The level 3 menu items 23, 24 first grouping of menu items 1. By default, it may be conve correspond to sub-menus or selectable functions of the level nient to place the most important menus within this first 2 menu item 21. After selection of the level 2 menu item 21 grouping of menu items 1, which allow direct access to the only the sub-menus of this menu item are displayed (23, 24), most frequently used menus in a software. Alternatively it the sub-menus of the menu item 22 are not shown. It can be may be feasible to arrange the menu items based on highest favorable that every menu level within this hierarchical menu popularity or highest frequency of use based on historical structure is displayed sequentially and the level 3 menu items analysis. In a specific embodiment, the user can chose, which are just displayed after selection of a menu item out of the menu items are to be displayed in this first grouping of menu level 2 menu items. This GUI has the advantage that only the items. It depends on, which operations a user wants to per sub-menus of the selected first menu item 20 are displayed. form when using the Software and which commands he or she Since the sub-menus 21, 22 and 23, 24 are located within one has to use frequently, so that every user can individually circular sector together with the level 1 menu item; the user adjust the GUI, perhaps only for a limited time, when per only has to move the cursor in one direction in one flow. It is forming specific operations, to meet his/her requirements. not required to move the cursor along a nested drop-down The GUI is designed in such way that it can be activated via an menu in horizontal and vertical directions, following the path input device at any location in the display area. When the user of the selected items and paying attention not to lose the path activates the GUI, it will appear directly below or in close by dropping with the cursor in a wrong line. proximity to the actual curser position. This has the advantage 0020. In FIG. 4, an alternative preferred embodiment is that for example the manipulation of a graphic object can be displayed, where the additional groupings of menu items performed directly on the object and it is not required to move (level 2 and level 3) do not correspond to sub-menus of the the cursor away from the manipulated graphic object to a selected level 1 menu item. In this case, each sector of menu taskbar and to navigate through a nested menu structure and items corresponds to one sub-grouping of menu items. When then to move the cursor back to the manipulated object. a level 1 menu item is selected, the complete sector with all 0017 FIG. 2 illustrates exemplary frames for the anima menu items is displayed. The most frequently used menu tion of the first concentric menu. After activating the GUI via items can be displayed in the inner part of the circular sector the input device, the animation of the menu starts in the and menu items, which are not used with a high frequency are central portion of the GUI at the desired place on the working located in the outer parts of the circular sector. In this illus space, which can be directly below or in close proximity to the trated embodiment, the menu does not have any hierarchical actual curser position. In a next step the display of the first structure; the level 2 menu items 51 and 52 can be indepen grouping of menu items 1 is animated, comprising a Subset of dent from the level 3 menu items 53, 54, 55, 56 and 57. The items 10, 20, 30 and 40 from a set of menu items. In this user can chose, which menu functions he/she frequently uses illustrated embodiment the first grouping of menu items and arrange those menu items within the circular GUI. To appears Surrounding the central portion and is then increasing have a raw structuring, it can be preferred to arrange similar in size until reaching its final state. In a further alternative menu items in one circular sector. This enables the user to embodiment of the present invention the user can manipulate quickly gain access to the desired menu items. Furthermore it the parameters of animations, such as the speed, the transpar may be favorably to create mixed menu structures, which ency of the concentric menu and the size of the final concen combine hierarchical elements with non-hierarchical struc tric menu. By varying the transparency of the concentric tures. US 2011/0055760 A1 Mar. 3, 2011

0021. In a further preferred embodiment, the first concen menu item of the first grouping of menu items. Subsequently, tric menu comprises four level 1 menu items 10, 20, 30 and the display of the second grouping of menu items is animated 40, so that the selected menu item together with the corre concentrically in a pie sliced shape. The user only has to sponding Sub-menus of the selected menu item form a quad activate the concentric menu with the input device and can rant, as depicted in the figures. The division into four quad then navigate through the several menu items just by moving rants is intuitive, since various objects are arranged in a four the cursor over the path of the selected menu items. This foldsymmetry, e.g. the four cardinal points, or the division of allows a much faster navigation through the concentric menu. the Surrounding of an object in front, back, left and right. In this illustrated embodiment the user can activate the When the first concentric menu does not consist of too many desired menu item directly via the input device. items, it is easier for the user to remember the position of the 0026 FIG. 7 illustrates an illustrated embodiment of the single menu items. The menu items are relatively large, so concentric menu with a pie slice shaped sub-menu and mixed that it is easy for the user to select one menu item. Especially levels of granularity. The level 1 menu item 50 forms a hier fortablet users it is important that the functions of the GUI are archical relationship with the level 2 menu items 51 and 52. easy to reach and the menu items are large enough so that they The series of nested level 3 menu items 53, 54, 55 and 56 are are selectable quickly. In this embodiment, the Sub-menus of formed in a hierarchical relationship with the menu item 51. the selected first menu item are arranged in one quadrant, and These mixed levels of granularity allow a greater variation the position of the single menu items can easily be remem within the concentric menu, since various combinations of bered. different menu items are possible. Nevertheless it is important 0022. In an alternative variation, the non-selected level 1 that Sub-menus do not extend over the activated circular sec menu items from the first concentric menu are animated to tor, to allow intuitive navigation through the concentric menu fade away as illustrated in FIG. 4, or to fade until a certain without having to move the cursor backwards out of the transparency is reached. The faded menu items can be reani circular sector. FIG. 7 further demonstrates the display of the mated by moving the cursor over the desired menu item. path, as navigated through the concentric menu. It illustrates When the user has for example chosen a wrong level 1 menu that after activation of the level 1 menu item 50, the level 2 item, this allows him/her to quickly select another level 1 menu item 51 and finally, the level 3 menu item 54 was menu item. This variation reduces the GUI drastically, since selected by a user. only the menu items are depicted, which are currently impor 0027. In a further illustrated embodiment of the present tant and can be selected by the user. Therefore, the user knows invention, the description of the active menu item is displayed exactly, which level 2 menu items can be chosen 51 or 52 in a central position of the GUI, as depicted in FIG.8. When without being distracted by further menu items 10, 30 and 40. the concentric menu shows increased levels of granularity in 0023 FIG. 5 shows another alternative embodiment of the the Sub-menus, the labeling of the menu item is decreasing in concentric menu, where the number of level 2 menu items is size. Therefore, a larger display of the selected menu item in already implicated at the border of the first concentric menu. the central position of the GUI enables the user to verify, if the In this embodiment, thick lines at the border of the level 1 desired menu item was selected correctly. In this embodi menu items implicate the number of level 2 menu items ment, the level 1 menu item 50 is selected and displayed in the before having selected a specific level 1 menu item. This is central position of the GUI. After this, the level 2 menu item indicated by thick broken lines at the outer border of each 51 is selected and displayed in the same position on the GUI. level 1 menu item. As depicted in FIG. 5, the user knows This display in the central position of the GUI can also be before selecting a level 1 menu item that two level 2 menu animated to appear slowly and to fade away. In addition, this items correspond to each of the menu items 10 and 20, and central item can change its color, depending on, which level four and three level 2 menu items correspond to the menu of the concentric menu is currently selected. items 30 and 40, respectively. If the user remembers for 0028. In an alternative embodiment of the present method example that the menu he wants to activate has four level 2 of providing a GUI, the concentric menu disappears, when the menu items, he knows that the menu items 10 and 20 cannot cursor moves farther than a certain distance from the concen be the right ones, since they both only have two level 2 menu tric menu. Alternatively, the GUI can be deactivated after a items. The display of the next level menu items is not limited certain time, when it has not been used. This enables the user to thick broken lines at the border of the menu items. Alter to use the whole display area without being distracted by the natively, the number of menu items in the next menu level can concentric menu, when it is not needed. The disabled menu be visualized by different colors, labeling or animations can be reactivated using the input device. Alternatively, the within the menu items. distance of the cursor to the concentric menu is detected; and 0024 FIG. 6 illustrates an illustrated embodiment of the the display of the concentric menu is animated when the concentric menu with a pie slice shaped Sub-menu, wherein cursor approaches the concentric menu. This allows for a the active menu item 20 is highlighted. In this embodiment quick activation and deactivation of the concentric menu the user can directly see, which menu item is currently when it is needed. selected and which options he/she has. The activated level 1 0029. The concentric menu can be navigated with various menu item 20 can in addition be colored differently, the input devices, such as a mouse, a trackball, or a data tablet or borders can be darkened or the selected menu item 20 can be a touchscreen. The data represented by the menu items are animated to increase in size for example. In an alternative selected from the group consisting of letters, numerals, alpha embodiment the path within the concentric menu is high numerics, visual images, colors and audio Sounds. The data lighted (FIG. 7) whereas the active menu item is highlighted represented by the menu items can be arranged in any orien differently. tation. The text or icons can be horizontally arranged as 0025 To further facilitate the navigation in the concentric depicted in FIG. 1 to FIG. 8, or alternatively radially oriented menu, another illustrated embodiment of the present inven as depicted in FIG. 9. The lettering can moreover be curved tion further comprises the detection of the cursor over one according to the curved menu structure. The concentric menu US 2011/0055760 A1 Mar. 3, 2011

can be implemented on any computer display and is not sector of the concentric menu and less frequently used menu limited by size, shape, position on the display area, number of items are placed in outermost groups within the circular sec levels, number of menu items, number of sectors, colors, tor of the concentric menu. textures and animation techniques. 11. The method of claim 1 wherein each grouping of menu 1. A method of providing a graphical user interface, com items may further comprise mixed levels of granularity. prising: 12. The method of claim 1 wherein the content of the animating the display of a first concentric menu compris activated menu item is displayed in the central position of the ing a first grouping of menu items comprising a Subset of graphical user interface. one or more items from a set of menu items, after acti 13. The method of claim 1 wherein the concentric menu is Vation via an input device; and invisible, transparent or inactivated, when the cursor moves after selecting one menu item out of the first grouping of farther than a certain distance from the concentric menu. menu items, animating the display of at least one addi 14. The method of claim 13, further comprising: detecting tional grouping of menu items, each of the additional the distance of the cursor to the concentric menu; and animat groupings formed concentrically in a pie sliced shape; ing a full view of the concentric menu when the cursor wherein the graphical user interface can be activated by a approaches the concentric menu. user at any position on the display area via the input 15. A machine readable medium storing instructions that device. cause a processor to perform the operations of claim 1. 2. The method of claim 1 wherein theat least one additional 16. A system for providing a graphical user interface, com grouping of menu items correspond to Sub-menus of the prising: selected menu item of the first grouping of menu items and a processor; each of the additional groupings of menu items is formed a display in communication with the processor; concentrically and sequentially in a pie sliced shape. an input device in communication with the processor and 3. The method of claim 1 wherein the first concentric menu enabling a user to control a cursor and select menu items comprising the first grouping of menu items is animated to displayed in the display; and increase in size before reaching its final State. a memory in communication with the processor and stor 4. The method of claim 1, further comprising: detecting a ing machine instructions that cause the processor to cursor over one menu item of the first grouping of menu perform the operation of: items; and animating the display of the second grouping of animating the display of a first concentric menu compris menu items formed concentrically in a pie sliced shape. ing a first grouping of menu items comprising a Subset of 5. The method of claim 1 wherein the movement of the one or more items from a set of menu items, after acti cursor to the outer parts of the concentric menu activates the Vation via the input device; and display of at least one additional level of menu items formed after selecting one menu item out of the first grouping of concentrically in a pie sliced shape, and every menu item can menu items, animating the display of at least one addi be activated via the input device. tional grouping of menu items, each of the additional 6. The method of claim 1 wherein the selected menu item groupings formed concentrically in a pie sliced shape; from the first concentric menu and the at least one additional wherein the graphical user interface can be activated by a grouping of menu items from the first concentric menu are user at any position on the display area via the input animated to form a circular sector together. device. 7. The method of claim 1 wherein the first concentric menu 17. The system of claim 16 wherein the input device comprises four menu items and the selected menu item and includes a mouse, a trackball, a data-tablet or a touchscreen. the at least one additional grouping of menu items are ani 18. The system of claim 16 wherein the data represented by mated to form a quadrant together. the menu items are selected from the group consisting of 8. The method of claim 2 wherein after activation of one letters, numerals, alphanumerics, visual images, colors and menu item, the non-activated menu items are animated to fade audio Sounds. away or to fade until a certain transparency is reached. 19. The system of claim 16 wherein selectively displaying 9. The method of claim 1 wherein the number of menu the activated menu item includes at least one of highlighting, items of the next menu level is visualized in the current level coloring, darkening borders and animation of the selected menu items. menu item. 10. The method of claim 1 wherein most frequently used menu items are placed in innermost groups within the circular