US20160334947A1 - Indicating hierarchy in a computer system with a graphical user interface - Google Patents

Abstract

Some embodiments of the invention provide a method for indicating hierarchy of objects in a graphical user interface (GUI) of a computer system. The method uses a first color to display a first set of objects at a first level of the hierarchy. The method then uses a second color, different from the first color, to display a second set of objects at a second level of the hierarchy. The first and second colors are two different colors in the visible light spectrum in some embodiments, while they are two different shades of the same color in other embodiments.

Description

FIELD OF THE INVENTION The present invention relates to indicating hierarchy in a computer system with a graphical user interface.BACKGROUND OF THE INVENTION
• Today's operating systems and applications come packaged with numerous functions and features. Most operating systems and applications use a graphical user interface (“GUI”) in some shape or form, as a GUI simplifies a user's interaction with the computer.
• Organization and presentation are the key elements in designing a successful GUI because users depend on the visual presentation of the GUI to guide them through the process. This is especially true today because computer screens are cluttered with numerous windows and icons. Given that the computer screen can display many active windows, it may be hard for users to navigate through all the options that are presented to them.
• Therefore, there is a need for a method that organizes features that are embedded within other features. Specifically, there is a need for a method for creating hierarchical structures. Moreover, there is a need for a method that organizes embedded levels in such a way that users can easily see the embedded levels. More generally, there is a need for a method that visually illustrates different types of hierarchy between items (e.g., objects, windows, etc.) in a GUI.
SUMMARY OF THE INVENTION
• Some embodiments of the invention provide a method for indicating hierarchy of objects in a graphical user interface (GUI) of a computer system. The method uses a first color to display a first set of objects at a first level of the hierarchy. The method then uses a second color, different from the first color, to display a second set of objects at a second level of the hierarchy. The first and second colors are two different colors in the visible light spectrum in some embodiments, while they are two different shades of the same color in other embodiments.
BRIEF DESCRIPTION OF THE DRAWINGS
• FIG. 1 illustrates an example of a hierarchical structure.
• FIG. 2 illustrates a GUI tab panel with display tab group selected.
• FIG. 3 illustrates a GUI tab panel with arrangement tab group selected.
• FIG. 4 illustrates a GUI tab panel with color tab group selected.
• FIG. 5 illustrates a process diagram that a GUI may perform to create a hierarchical structure.
• FIG. 6 illustrates a GUI tab panel with system preferences selected.
• FIG. 7 illustrates a GUI tab panel with language tab group selected.
• FIG. 8 illustrates a GUI tab panel with formats tab group selected.
• FIG. 9 illustrates a list-view of five nested folders.
• FIG. 10 illustrates a block diagram of five windows open for five folders.
• FIG. 11 illustrates a list-view of six nested folders.
• FIG. 12 illustrates a block diagram of six windows open for six folders.
• FIG. 13 illustrates four windows that are layered on top of each other.
• FIG. 14 illustrates a removal of a window from four windows that are layered on top of each other.
• FIG. 15 illustrates three windows that are layered on top of each other and one window removed from the layered stack of windows.
• FIG. 16 illustrates a window being inserted into three windows that are layered on top of each other.
• FIG. 17 illustrates a block diagram of a computer system.
DETAILED DESCRIPTION OF THE INVENTION
• In the following detailed description of the invention, numerous details, examples and embodiments of the invention are set forth and described. However, it will be clear and apparent to one skilled in the art that the invention is not limited to the embodiments set forth and that the invention may be practiced without some of the specific details and examples discussed.
I. Definitions
• As used in this document, the term “color” includes all colors in the light spectrum. As used in this application, two colors are different colors when they are two different colors in the spectrum of visible light, or are two different shades of the same color.
• A graphical user interface (“GUI”) is an interface of a computer system that allows users to interact with the computer system through images and text. A GUI allows users of the computer system to interact with the computer system in an intuitive graphical manner. Instead of learning and writing complex command languages, users can perform many operations by simply interacting with the visual components of a GUI, which are often easy to understand. A GUI often includes a cursor pointer, icons, desktop, windows, etc. The desktop refers to the contents on a display screen below any windows. A window is an area on the display screen that displays its own file, message, application, etc. independently of other windows that are displayed on the display screen.
• The cursor pointer (the “cursor”) is a pointer that a user can move across the GUI through the operation of a cursor controller, such as a mouse, a trackpad, trackball, etc. A user can use the cursor to select objects in the GUI. For instance, the user can select an object by dragging the cursor to the object and perform a click operation (e.g., through a button of the cursor controller). Generally, an object is an item that can be selected or manipulated. This can include any shape or figure that appears on a display screen of a computer system. Icons are examples of selectable objects in a GUI. Icons are used to represent folders, files, commands, etc. in the GUI. An icon can be represented by a text component, an image component, or both text and image components.
• Sometimes objects are organized into object groups. An object group is a number of individual objects that have one or more unifying characteristics, attributes or relationships. Therefore, an object group is a number of objects that are associated with one another so as to exhibit one or more unifying attributes.
• A group of objects are often organized in a structure. For instance, one structure would arrange a set of objects according to a particular relationship between each object. This type of structure is a hierarchical structure. A hierarchy is a classification of objects that reflects the relative position of each object in the hierarchy. As such, in a hierarchical structure, objects are organized in a manner that classifies the objects by their standing or ranking within the structure and relative to each other. Their standing within the hierarchy structure can be based on any part of an object's attributes. For example, a hierarchical structure can be based on an object's ability, importance, dependence, or any combination thereof
• In some instances, a hierarchical structure may be in the form of a parent-child relationship structure.FIG. 1 illustrates an example of what a hierarchical structure might look like in a parent-child relationship.FIG. 1 illustrates ahierarchical structure100 with aparent level110, which includes aparent object115. Theparent object110 sits on top of thehierarchical structure100, which indicates that it has the highest standing or ranking within this structure. Below theparent object110 is achild level120. Thechild level120 includes N child objects122,124, and126. In this structure, all the objects within thechild level120 are subordinate to the objects in theparent level110. That is, they have standing or ranking that is lower to theparent level110, as well as to theparent object115. However, the child objects (e.g., objects122,124, and126) have the same standing within this structure. in general, a parent object is any object having a subordinate/child object. Similarly, a child object is any object that has a parent/super-ordinate object.
• Furthermore, all the objects in thechild level120 are subordinate toparent object115 because they are belowparent level110. This subordination can be manifested in the GUI in a variety of ways. For instance, one way to manifest this subordination in the GUI is to show the child objects (in this case, the objects at the child level120) each time a parent object (in this case, an object at the parent level110) is selected. As further described below, a “tab group” is one such manifestation. Specifically, the GUI might include one window that is designed to show one set of selectable parent objects and their respective child objects in a “tab group”. In such a group, the parent objects are illustrated as tab icons within the window. Each time one of the parent objects is selected, these embodiments display the child objects of the selected parent object in a display section of the window.
• Each selectable child object can have its own child objects. For instance,FIG. 1 illustrates agrandchild level130 below thechild level120. Thegrandchild level130 has M grandchild objects131,133,134,135,137, and139, which are child objects of the objects at thechild level120. In this structure,grandchild level130 is belowchild level120 and thus all the objects ingrandchild level130 are subordinate (lower standing or ranking) to the objects inchild level120. As mentioned above, one way to manifest this subordination in the GUI is to show the child objects (in this case, the objects at the grandchild level130) each time a parent object (in this case, an object at the child level120) is selected.
• InFIG. 1, each child object has two grandchild objects. In other structures, each child object may have more or less grandchild objects. Furthermore, inFIG. 1, thehierarchical structure100 has three hierarchical levels (i.e., parent, child, and grandchild). However, other hierarchical structures include many more levels.
II. Overview
• Some embodiments of the invention provide a method for indicating hierarchy of objects in a graphical user interface (GUI) of a computer system. The method uses a first color to display a first set of objects at a first level of the hierarchy. The method then uses a second color, different from the first color, to display a second set of objects at a second level of the hierarchy. The first and second colors are two different colors in the visible light spectrum in some embodiments, while they are two different shades of the same color in other embodiments.
• In some embodiments, the first set of objects includes a parent object, while the second set of objects include child objects of the parent object that are presented in the GUI when the parent object is selected. In some cases, the parent object and the child objects are presented in the same window. In some of these cases, the second color is used as a color of a first section in the window that is used to display the child objects, while the first color is used as a color to show a second section in the window that does not include the first section. The parent object can be displayed in the second section, or it can be displayed between the first and second sections. In some of these embodiments, the first set of objects includes several parent objects that are arranged in a tab group.
• In some embodiments, the parent object is displayed in a first window and the child objects are displayed in a second window. In these embodiments, the method uses the first color to display the first window and uses the second color to display the second window. Alternatively, in some embodiments, the GUI objects are windows organized in a stack, and the hierarchy between these objects is a stacking order of the windows in the stack. In some of these embodiments, the method uses the first color to display the location of a first window in the stack, and uses the second color to display the location of a second window in the stack.
III. Hierchical Structures Within the Same Window
• A. Examples
• There are many types of hierarchical structures that can be generated in a graphical user interface. A tab panel that includes several tabs is a possible way of organizing objects in a hierarchical structure. In a tab panel, objects are organized and identified by tabs, much like how they would be organized in a file cabinet. In the graphical user interface, each tab is a selectable parent object, and all the tabs in the tab group are presented in series so that they are easy to view. To make tab groups accessible, all the tabs are always shown, regardless of which tab a users has selected at any given time. When one of the tabs is selected, its child objects are presented in a display section of the window containing the tab group.
• FIG. 2 illustrates awindow200 in a GUI that implements the invention for a tab group.Window200 presents an illustration of aparent icon group210 comprised ofDisplays icon220. Furthermore,window200 presents achild icon group230 of theDisplays icon220. Thechild icon group230 includes aDisplay icon240, anArrangement icon245, and aColor icon255.
• Thewindow200 also includes abackground section250 and aviewing section260. Thebackground section250 is an area of thewindow200 for displaying objects that have a subordinate relationship toparent icon group210. Thedisplay section260 is an area within thebackground section250 for displaying objects that have a subordinate relationship to thechild icon group230.
• FIG. 2 illustrates thewindow200 after theDisplays icon220 has been selected. In this figure, theDisplays icon220 is highlighted in a color to indicate that theDisplays icon120 has been selected. The color of the background of theDisplays icon220 is identical or similar to the color of thebackground section250 in some embodiments, while it is a different color in other embodiments.
• Thebackground section250 is an area ofwindow200 for displaying objects that have a hierarchical relationship to theparent icon group210. In this instance,background section250 is displaying icons that have a hierarchical relationship toDisplays icon220. More specifically, thebackground section250 is displaying objects that are subordinate toDisplays icon220, such as thechild icon group230.
• As mentioned above,Display icon240 in thechild icon group230 is selected. As a result, thechild viewing section260 displays objects that have a subordinate relationship to theDisplay icon240. In this illustration, these objects include aviewing area270 that lists several different selectable screen resolutions. Other examples of child objects of theDisplay icon240 include a pull downmenu290 for selecting types of colors and a DetectDisplay icon280 for automatically detecting the computer's display. To indicate that the child objects of theDisplay icon240 are subordinate to theDisplay icon240, thechild viewing section260 has a darker shade of color than the color of thebackground section250.
• FIG. 3 illustrates thewindow200 after theArrangement icon245 in thechild icon group230 has been selected. In this figure, theArrangement icon245 is highlighted with a colored background to indicate that it is selected. Accordingly, thechild viewing section260 displays child objects of theArrangement icon245. Furthermore, the color of thechild viewing section260 is again a darker shade of the color than the color of thebackground250, to indicate once again the subordinate relationship between the objects illustrated in theviewing section260 and theArrangement icon245.
• Withinchild viewing section260, there are various objects that are subordinate toarrangement icon245. These objects include (1) aviewing area320 for displaying figures and diagrams associated withArrangement icon245, and (2) text to describe the objects within thechild viewing section260.
• FIG. 4 illustrates thewindow200 after theColor icon255 in thechild icon group230 has been selected. In this figure, theColor icon255 is highlighted with a colored background to indicate that it is selected. Accordingly, thechild viewing section260 displays child objects of theColor icon245. Furthermore, the color of thechild viewing section260 is again a darker shade of the color than the color of thebackground250, to indicate once again the subordinate relationship between the objects illustrated in theviewing section260 and theColor icon255. The objects within thechild viewing section260 that are subordinate toColor icon255 include (1) alist420 for presenting various display profiles, and (2) a calibrateicon430 for calibrating the display.
• B. ProcessFIG. 5 presents aprocess500 that conceptually illustrates a series of operations for designing a window that uses different coloring schemes for a nested tab group. This process is described below by reference to examples that are illustrated inFIGS. 6, 7, and8.
• FIG. 6 illustrates awindow600 that contains anInternational icon610. When thisicon610 is selected, thewindow600 presents atab group700 and adisplay section260, as illustrated inFIG. 7. Thetab group700 includes three tabs, which are the following three parent objects:Language710,Format720, and InputMenu730. Thedisplay section260 is for displaying the child objects of theparent tab group700, as further described below.
• According to the invention, thedisplay section260 has a different color shading than theregion250, which surroundssection260 in thewindow600. This different shading is to indicate that thedisplay section260 is displaying contents of the tab group. In other words, the different shading indicates that the display section is displaying objects at a lower level of a hierarchy than the objects associated with theregion250 of the window. In this case, the objects associated with theregion250 are thetab icons710,720, and730 in thetab group700, while the objects associated with thedisplay section260 are the child objects of thetab icons710,720, and730.
• As shown inFIG. 5, theprocess500 starts by identifying (at510) a window and a background color for the window. For instance, in the example illustrated inFIGS. 6-8, the process identifies thewindow600 and the background color of theregion250 at510. Next, the process identifies (at520) a set of selectable parent objects and organizes them as a tab group. For example, in the example illustrated inFIGS. 6-8, the process identifies the Language, Format, and InputMenu icons710,720, and730, and organizes them as atab group700.
• The process then defines (at530) a display section within thewindow600 identified at510. At530, the process also assigns a color to this display section. This color is different than the color identified for thewindow600 at510. For instance, at530, theprocess500 defines thedisplay section260 in the example illustrated inFIG. 7.
• As shown in this figure, the color of thedisplay section260 is different (i.e., in this case, has a different shade) than the color of thewindow600'sbackground region250 that surrounds thesection260. As described above, this difference in color indicates that the objects that are displayed in thesection260 are at a lower level of the hierarchy than the objects that are displayed in thesection250, which in this case are the tab group icons710-730. In the example presented inFIG. 7, the objects that are displayed in thesection250 are child objects of theLanguage icon710. These child objects include alist display section740, anEdit icon750, and asorting icon760, as shown inFIG. 7. Once the grandchild objects have been identified, the process moves to560.
• Next, theprocess500 chooses (at540) one of the parent objects in the tab group. At550, the process then defines all possible objects that are subordinate to the chosen parent object (i.e., this object's child objects, grandchild objects, etc.) and defines the layout display of these subordinate objects in the display section defined at530. As mentioned above,FIG. 7 illustrates the display layout of the child objects of theLanguage icon710 in thetab group700.
• When the selected parent object has multiple levels of child objects (i.e., has child objects, grandchild objects, etc.), theprocess500 might define (at550) smaller sub-sections of the display section for displaying some of the lower level child objects (e.g., the selected parent object's grandchild objects, great-grandchild objects, etc.).
• FIG. 8 illustrates an example of illustrating more than two levels of hierarchy in more than two levels of display sections. Specifically, indisplay section260 of thewindow600, this figure illustrates the child objects of theFormats icon720 of thetab group700. These child objects include aRegion icon810, Customizeicons815, Date, Time, Numbers fields820,830,840, andMeasurement Units icon825. These child icons are displayed indisplay section260 to indicate a subordinate relationship between them andFormat icon720. The values of the Dates, Times, andNumbers fields820,830, and840 are subordinate to the region specified by theRegion icon810. The values in these fields can also be changed through the operation of the Customizeicons815. As these values are sub-ordinate to these icons, thefields820,830, and840 are defined within thedisplay section260 and have a different shading than this display section to indicate that they are objects at a lower level of the hierarchy than the Region and Customizeicons810 and815. However, as theDate section820, Time thesection830 and theNumbers section840 are in the same hierarchical level, they have the same color.
• After550, theprocess500 determines (at560) whether it has examined the last parent object identified at520. If not, the process returns to540 to select another parent object, and then at550 defines the display layout for objects that are subordinate to this parent object in the object hierarchy. When theprocess500 determines (at560) that it has examined the last parent object, the process terminates.
III. Hierchical Structures Within the Same Window
• The above process describes some embodiments where the hierarchical structure is located within a single window of a GUI. However, in some embodiments, the hierarchical structure is in multiple windows.
• A. Hierarchical Objects that Open in Different Windows
• Some embodiments use different colors (e.g., different shades of colors) for windows of objects at different levels of a hierarchical structure, in order to visually convey the ranking of the objects in the hierarchy.FIGS. 9 and 10 illustrate one example of this approach.
• Specifically,FIG. 9 illustrates awindow900 that provides a list-view illustration of five nested folders. This figure illustrates that aparent folder910 contains (i.e., has) achild folder920, which, in turn, contains afolder930. It also illustrates aparent folder940 that contains achild folder950. Theparent folders910 and940 are at the same level of a hierarchy (i.e., they are both parent folders in window900). Similarly, thefolders920 and950 are at the same level of the hierarchy (i.e., they are child folders of twofolders910 and940 at the same level of the hierarchy).
• FIG. 10 illustrates aGUI1000 that has five windows open for the five folders910-950. According to some embodiments of the invention, this GUI uses colors to distinguish windows of folders that are at different levels of the hierarchy. For instance, it uses three different shades of grey to represent the threefolders910,920, and930 that have a parent, child, and/or grandchild relationships with each other. Also, according to some embodiments of the invention, theGUI1000 uses the same shade of grey to color windows at the same level of the hierarchy. Specifically, it uses the same color to representparent folders910 and940, and the same color to representchild folders920 and950.
• FIGS. 11 and 12 illustrate another example using different colors (e.g., different shades of colors) for windows of objects at different levels of a hierarchical structure. Specifically,FIG. 11 illustrates awindow1100 that provides a list-view illustration of six nested folders. This figure illustrates that aparent folder1110 contains achild folder1120, which, in turn, contains twochild folders1130 and1150 of its own. Thefolder1130 has achild folder1140, and thefolder1150 has achild folder1160. In this example, thefolders1130 and1150 are at the same level of the hierarchy within thewindow1100 and thefolders1140 and1160 are at the same level of the hierarchy within this window.
• FIG. 12 illustrates aGUI1200 that has six windows open for the six folders1110-1160. According to some embodiments of the invention, this GUI uses colors to distinguish windows of folders that are at different levels of the hierarchy. For instance, it uses four different shades of grey to represent the fourfolders1110,1120,1130, and1140 that have a parent, child, grandchild, and/or great-grandchild relationships with each other. Also, according some embodiments of the invention, theGUI1100 uses the same shade of grey to color windows at the same level of the hierarchy. Specifically, it uses the same color to representfolders1130 and1150, and the same color to representchild folders1150 and1160.
• B. Hierarchical Color Based on Positions of a Window
• In some embodiments, the hierarchical structure is not based on a parent-child hierarchal relationship between objects in the GUI. For instance, some embodiments dynamically define hierarchical structures in real-time based only on a real-time layering of windows. These embodiments then assign colors to the windows based on this hierarchical structure. For example, the GUI objects can be windows organized in a stack, and the hierarchy between these objects is a stacking order of the windows in the stack.
• FIGS. 13-16 illustrate one such embodiment. Specifically,FIG. 13 illustrates aGUI1300 that includes fourwindows1310,1320,1330, and1340 that are layered one on top of the other. Thewindow1320 is stacked on top of thewindow1310. Thewindow1330 is in turn stacked on top of thewindow1320, while thewindow1340 is stacked on top of thewindow1330.
• As shown inFIG. 13, the GUI uses different colors (e.g., different shades of color) for the windows that are stacked on top of each other. Specifically, in the example illustrated inFIG. 13, the windows progressively get darker as they stack on top of each other, with the bottom window1310 (i.e., the window that sits at the bottom of the stack) having the lightest color, and the top window1340 (i.e., the window that sits at the top of the stack) having the darkest color.
• FIGS. 14-16 illustrate that some embodiments change the windows colors when one of the windows is removed from the stack or is inserted into the stack. Specifically,FIGS. 14 and 15 illustrate that the removal of thewindow1320 from the stack, changes the color of thewindows1330 and1340 in some embodiments.FIG. 16 illustrates that the insertion of thewindow1320 on top of the stack then changes the color of this window. Before being placed on top of the stack, thewindow1320 does not have a color that shows its position in the hierarchy in some embodiments, while it retains its color before its removal from the stack in other embodiments. in yet other embodiments, this window might be assigned a color that indicates its removal from the stack or indicates another attribute of this window.
V. Computer System
• FIG. 17 presents a computer system with which one embodiment of the invention is implemented.Computer system1700 includes abus1705, aprocessor1710, asystem memory1715, a read-only memory1720, apermanent storage device1725,input devices1730, andoutput devices1735. Thebus1705 collectively represents all system, peripheral, and chipset buses that communicatively connect the numerous internal devices of thecomputer system1700. For instance, thebus1705 communicatively connects theprocessor1710 with the read-only memory1720, thesystem memory1715, and thepermanent storage device1725.
• From these various memory units, theprocessor1710 retrieves instructions to execute and data to process in order to execute the processes of the invention. The read-only-memory (ROM)1720 stores static data and instructions that are needed by theprocessor1710 and other modules of the computer system.
• Thepermanent storage device1725, on the other hand, is read-and-write memory device. This device is a non-volatile memory unit that stores instruction and data even when thecomputer system1700 is off. Some embodiments of the invention use a mass-storage device (such as a magnetic or optical disk and its corresponding disk drive) as thepermanent storage device1725.
• Other embodiments use a removable storage device (such as a floppy disk or zip® disk, and its corresponding disk drive) as the permanent storage device. Like thepermanent storage device1725, thesystem memory1715 is a read-and-write memory device. However, unlikestorage device1725, the system memory is a volatile read-and-write memory, such as a random access memory. The system memory stores some of the instructions and data that the processor needs at runtime. In some embodiments, the invention's processes are stored in thesystem memory1715, thepermanent storage device1725, and/or the read-only memory1720.
• Thebus1705 also connects to the input andoutput devices1730 and1735. The input devices enable the user to communicate information and select commands to the computer system. Theinput devices1730 include alphanumeric keyboards and cursor-controllers. Theoutput devices1735 display images generated by the computer system. For instance, these devices display IC design layouts. The output devices include printers and display devices, such as cathode ray tubes (CRT) or liquid crystal displays (LCD).
• Finally, as shown inFIG. 17,bus1705 also couplescomputer1700 to anetwork1765 through a network adapter (not shown). In this manner, the computer can be a part of a network of computers (such as a local area network (“LAN”), a wide area network (“WAN”), or an Intranet) or a network of networks (such as the Internet). Any or all of the components ofcomputer system1700 may be used in conjunction with the invention. However, one of ordinary skill in the art would appreciate that any other system configuration may also be used in conjunction with the present invention.
• The above-described embodiments have numerous advantages. For instances, by indicating hierarchy between objects in a GUI through the use of colors, these embodiments enable users of computers to be able to better see the hierarchical structure of objects in GUI. In the past, users had to rely on text description of the objects to determine the objects hierarchy level within the graphical user interface. Now, when an object has a different color (e.g., a darker color) than another object, users can immediately ascertain the hierarchical relationship between the objects.
• While the invention has been described with reference to numerous specific details, one of ordinary skill in the art will recognize that the invention can be embodied in other specific forms without departing from the spirit of the invention. For example, in some embodiments, progressively darker colors are used to indicate hierarchy. In some embodiments, progressively lighter colors e used to indicate hierarchy. Thus, one of ordinary skill in the art would understand that the invention is not to be limited by the foregoing illustrative details, but rather is to be defined by the appended claims.

Claims (16)

1. (canceled)

2. A non-transitory computer readable medium storing instructions, which when executed by at least one processor, configure the at least one processor to perform operations comprising:

providing a plurality of parent selectable items comprising a first parent selectable item and a second parent selectable item, wherein the first parent selectable item provides access to a first set of child selectable items, wherein the second parent selectable item provides access to a second set of child selectable items;

providing a first display area for displaying the plurality of parent selectable items, the first display area being provided by using a first color; and

providing a second display area for (i) displaying the first set of child selectable items when the first parent selectable item is selected and (ii) displaying the second set of child selectable items when the second parent selectable item is selected, wherein only one set of child selectable items may be displayed at a time in the second display area, the second display area being provided by using a second color that is different than the first color to color at least a portion of the second display area to highlight a parent-child relationship between the selected parent item and the set of child selectable items displayed in the second display area, the first and second display areas each having a fixed size that does not change regardless of which parent selectable item is selected and wherein the first and second display areas are both displayed within a window.

3. The non-transitory computer readable medium ofclaim 2, wherein the first set of child selectable items comprises more than one child selectable item and the second set of child selectable items comprises only one child selectable item.

4. The non-transitory computer readable medium ofclaim 2, wherein the fixed size of the second display area comprises a fixed shape.

5. The non-transitory computer readable medium ofclaim 2, wherein the first and second colors are different shades of the same color,

6. The non-transitory computer readable medium ofclaim 2, where a first child selectable item of the first set of child selectable items provides access to a first set of grandchild selectable items.

7. The non-transitory computer readable medium ofclaim 6, wherein the instructions, which when executed by the least one processor, configure the at least one processor to further perform operations comprising:

providing a third display area for displaying the first set of grandchild selectable items when the first child selectable item is selected, wherein the third display area is provided by using a third color that is different than the first and second color to color at least a portion of the third display area.

8. A system for providing a graphical user interface (“GUI”), the system comprising:

at least one processor;

a storage device comprising instructions, which when executed by the at least one processor, configure the at least one processor to perform operations comprising:

displaying a plurality of parent selectable items comprising a first parent selectable item and a second parent selectable item, wherein the first parent selectable item provides access to a first set of child selectable items, wherein the second parent selectable item provides access to a second set of child selectable items;

displaying a first display area for displaying the plurality of parent selectable items, the first display area displayed by using a first color;

displaying the first set of child selectable items in a second display area when the first parent selectable item is selected; and

displaying the second set of child selectable items in the second display area when the second parent selectable item is selected, the second display area having a fixed display that remains unchanged regardless of which parent selectable item is selected,

wherein only one of the first and second sets of child selectable items may be displayed at a time in the second display area, the second display area displayed by using a second color that is different than the first color to color at least a portion of the second display area to convey a hierarchical relationship between the selected parent selectable item and the set of child selectable items displayed in the second display area.

9. The system ofclaim 8, wherein the first and second parent selectable items are tabs associated with a particular icon from an icon group, the particular icon being a parent of the first and second parent selectable items.

10. The system ofclaim 9, wherein the first and second parent selectable items are linearly arranged in the first display area and the particular icon is linearly arranged with other icons in the icon group in a third display area that is displayed by using a third color different from the first and second colors.

11. The system ofclaim 8, wherein the first and second display areas are both displayed within a window.

12. The system ofclaim 8, wherein the first set of child selectable items comprises more than one child selectable item and the second set of child selectable items comprises only one child selectable item.

13. The system ofclaim 8, wherein the fixed display of the second display area comprises a fixed size and shape.

14. The system ofclaim 8, wherein the first and second colors are different shades of the same color.

15. The system ofclaim 8, where a first child selectable item of the first set of child selectable items provides access to a first set of grandchild selectable items.

16. The system ofclaim 15, wherein the instructions, which when executed by the least one processor, configure the at least one processor to further perform operations comprising:

providing a third display area for displaying the first set of grandchild selectable items when the first child selectable item is selected, wherein the third display area is provided by using a third color that is different than the first and second color to color at least a portion of the third display area.

Images