CROSS-REFERENCE TO PARENT APPLICATIONThis patent application is a continuation of U.S. Ser. No. 11/388,014 filed on Mar. 23, 2006, which is incorporated herein by reference.
BACKGROUND OF THE INVENTION1. Technical Field
This invention generally relates to computer displays and graphical user interfaces and more specifically relates to highlighting related user interface controls on a graphical user interface.
2. Background Art
Computer systems use a variety of user interface methods to display information and to prompt input from a computer user. These interface methods are often referred to as a user interface. An important aspect of all computer systems is the ease of use and the intuitiveness of the user interface. Most popular computer systems today use a graphical user interface (GUI) on a computer display screen to interact with the computer's user. Many GUI's employ one or more windows that can be opened on the computer's display. A window is a division of a computer display screen, which can be opened, closed, and moved around on the screen by the computer user. A window often includes a menu bar that contains one or more selections available to the user and drop down menus that are activated when an item on the menu bar is selected.
In many GUI's for computer programs, there is a great deal of information, including menus, icons, buttons, and selection boxes displayed in the GUI window. In these complex computer programs, users are increasingly confronted with extremely sophisticated sequences of possible steps that can be selected. Thus, it becomes confusing for the user to readily understand what actions are appropriate at any given time. And even in less complex situations, it is advantageous for the new user to be shown what options are available to make using the software intuitive. Some GUI's change the appearance of tool bars and menu buttons depending on the state of the current operation, the location of the cursor, and the items selected. However, when a computer user selects an item in a computer window in prior art GUIs, it is not readily apparent to the user what actions or user interface options are related to the selected object or available to perform some action on the selected object. Further, when controls are highlighted in the prior art depending on the selected object, they have the same highlighting as other controls that are currently available.
It would be advantageous for a GUI to give more guidance to the user on what options are related to a selected object or will affect a selected object. Without a simpler and more intuitive way to assist computer users to navigate through a user interface, the computer industry will continue to unnecessarily burden the computer users with the complexity of choices available in computer software user interfaces.
BRIEF SUMMARY OF THE INVENTIONAccording to the preferred embodiments, an apparatus and method is described for highlighting related user interface controls to selected items in order to improve the ease of use and the intuitiveness of a graphical user interface. In preferred embodiments, user interface controls that are specifically related to a selected object in the display are uniquely highlighted when an object is selected to show the user what user interface options are related to or available to perform some action on the selected object. The preferred embodiments of related highlighted controls can be used in conjunction with prior art highlighted controls that show what actions are available to the user for the current environment or cursor location.
While the preferred embodiments described herein are directed to user interfaces on a windows computer operating system and computer applications, the claimed embodiments herein expressly include other computer user interface applications and operating systems that employ a user interface, including those user interfaces that are used on handheld computers, phones, audio players, and personal digital assistants.
The foregoing and other features and advantages of the invention will be apparent from the following more particular description of preferred embodiments of the invention, as illustrated in the accompanying drawings.
BRIEF DESCRIPTION OF THE SEVERAL VIEWS OF THE DRAWING(S)The preferred embodiments of the present invention will hereinafter be described in conjunction with the appended drawings, where like designations denote like elements, and:
FIG. 1 is a block diagram of a computer apparatus in accordance with a preferred embodiment of the present invention;
FIG. 2 represents a windows application with a graphical user interface to illustrate an example according to the prior art;
FIG. 3 represents a windows application with a graphical user interface to illustrate an example according to the prior art;
FIG. 4 represents a windows application with a graphical user interface to illustrate an example according to the prior art;
FIG. 5 represents a windows application with a graphical user interface illustrating highlighted menu items that contain drop down menu actions that can be activated for the selected item according to preferred embodiments;
FIG. 6 represents the windows application in the example shown inFIG. 5 with a drop down menu showing highlighted actions that can be activated for the selected item according to preferred embodiments;
FIG. 7 represents a drawing editor application with a graphical user interface illustrating an example according to preferred embodiments;
FIG. 8 represents the drawing editor application in the example shown inFIG. 7 with highlighted tool bar and tool box buttons that can be used with the selected item according to preferred embodiments.
FIG. 9 illustrates an example of a browser application with a graphical user interface according to the prior art;
FIG. 10 illustrates the browser application in the example shown inFIG. 9 with highlighted fields that are related to the selected item according to preferred embodiments;
FIG. 11 again illustrates the browser application in the example shown inFIG. 9 with a highlighted button to show the user how to continue with the selected item;
FIG. 12 illustrates another example of a browser application with a graphical user interface according to the prior art;
FIG. 13 illustrates the browser application in the example shown inFIG. 12 with highlighted fields that are related to the selected item according to preferred embodiments;
FIG. 14 illustrates a method for highlighting related user interface controls according to preferred embodiments; and
FIG. 15 illustrates represents a windows application with a graphical user interface to illustrate a subsetted tab feature according to preferred embodiments.
DETAILED DESCRIPTION OF THE INVENTIONThe present invention relates to an apparatus and method for highlighting related user interface controls to selected items. In preferred embodiments, user interface controls that are related to a selected object in the display are uniquely highlighted when an object is selected to show the user what user interface options are specifically related to or available to perform some action on the selected object. This brief description of window displays and prior art GUIs provides background information that will help the reader to understand the present invention.
1. Prior Art Example of a Windows Type Graphical User InterfaceFIG. 2 shows awindows screen200 for a generic application program such as a document manager as it would be observed by a computer user on a video display (display165 inFIG. 1). The window screen incorporates a graphical user interface (GUI) according to the prior art. The GUI in thewindow screen200 includestitle bar212 and amenu bar214, each with a standard set of commands. The GUI210 also includes atoolbar216. A tool bar may have various tools to control objects (e.g., text, charts and graphics) within the window or to control the window. Toolbars can be provided as rows or columns, and have several buttons comprising textual icons, non-textual (graphic) icons, or icons having both graphic and textual elements. The depictedtoolbar216 includes, for example, common buttons to move back to the previous display, the next display, move up one folder level, search, etc.FIG. 2 also includes awindows tool bar218. This tool bar has drop down menus for various window functions as indicated by thearrow circle220. Each of these menus and buttons can be selected using the graphical pointer orcursor222 controlled by a pointing device such as a mouse (not shown).
FIGS. 2-4 illustrate how a typical prior art GUI gives clues to the user about what tools or buttons can be used or are active as described in the background above.FIG. 2 shows thecursor220 placed over anobject224 on the GUI210. When the mouse button is pressed (represented by the “Click!”text226 inFIG. 2), thetext230 below theobject224 is highlighted as shown inFIG. 3. When the user then selects the “Edit”menu item228 as shown inFIG. 3, the window screen210 would then appear as shown inFIG. 4. Theedit menu item228 is now shown highlighted to indicate the state of the menu as shown inFIG. 4. In addition, the “Edit” drop downmenu232 is displayed in response to the selection of the “Edit”menu item228. The drop downmenu232 shows a number of menu choices that is typical in the prior art. Some of the menu items appear in dark type and other appear in a shadow or ghost type. The menu items that appear in a shadow type are those that are not currently available. In this way, the prior art GUI is able to show the user what features are available and what features are not available. Menu highlighting in the prior art shows the availability of all the features. The availability depends on the state of the window in general and on what object orobjects224 are currently selected. The menu highlighting does not indicate to the user what menu items are only usable with the selected object(s).
2. Detailed DescriptionAn apparatus and method is described herein for highlighting GUI controls and buttons to give the user clues how to proceed with input. In preferred embodiments, GUI controls are highlighted based specifically on the selected object as described further below. GUI controls that are highlighted in response to the selected object include menu items, tool bar and tool box buttons, browser page objects and browser page buttons,
Referring toFIG. 1, acomputer system100 is one suitable implementation of an apparatus in accordance with the preferred embodiments of the invention.Computer system100 is an IBM eServer iSeries computer system. However, those skilled in the art will appreciate that the mechanisms and apparatus of the present invention apply equally to any computer system, regardless of whether the computer system is a complicated multi-user computing apparatus, a single user workstation, or an embedded control system. As shown inFIG. 1,computer system100 comprises aprocessor110, amain memory120, amass storage interface130, adisplay interface140, and anetwork interface150. These system components are interconnected through the use of asystem bus160.Mass storage interface130 is used to connect mass storage devices, such as a directaccess storage device155, tocomputer system100. One specific type of directaccess storage device155 is a readable and writable CD-RW drive, which may store data to and read data from a CD-RW195.
Main memory120 in accordance with the preferred embodiments containsdata121, anoperating system122, anapplication program123, and agraphical user interface124.Data121 represents any data that serves as input to or output from any program incomputer system100.Operating system122 is a multitasking operating system known in the industry as i5/OS; however, those skilled in the art will appreciate that the spirit and scope of the present invention is not limited to any one operating system. Theapplication123 can be any software application. Thegraphical user interface124 can be part of theoperating system122 or part of theapplication program123. In preferred embodiments, the graphical user interface includes a related user interfacecontrol highlighting mechanism125 as described further below.
Computer system100 utilizes well known virtual addressing mechanisms that allow the programs ofcomputer system100 to behave as if they only have access to a large, single storage entity instead of access to multiple, smaller storage entities such asmain memory120 andDASD device155. Therefore, whiledata121,operating system122,application123, and thegraphical user interface124 are shown to reside inmain memory120, those skilled in the art will recognize that these items are not necessarily all completely contained inmain memory120 at the same time. It should also be noted that the term “memory” is used herein to generically refer to the entire virtual memory ofcomputer system100, and may include the virtual memory of other computer systems coupled tocomputer system100.
Processor110 may be constructed from one or more microprocessors and/or integrated circuits.Processor110 executes program instructions stored inmain memory120.Main memory120 stores programs and data thatprocessor110 may access. Whencomputer system100 starts up,processor110 initially executes the program instructions that make upoperating system122.Operating system122 is a sophisticated program that manages the resources ofcomputer system100. Some of these resources areprocessor110,main memory120,mass storage interface130,display interface140,network interface150, andsystem bus160.
Althoughcomputer system100 is shown to contain only a single processor and a single system bus, those skilled in the art will appreciate that the present invention may be practiced using a computer system that has multiple processors and/or multiple buses. In addition, the interfaces that are used in the preferred embodiment each include separate, fully programmed microprocessors that are used to off-load compute-intensive processing fromprocessor110. However, those skilled in the art will appreciate that the present invention applies equally to computer systems that simply use I/O adapters to perform similar functions.
Display interface140 is used to directly connect one ormore displays165 tocomputer system100. Thesedisplays165, which may be non-intelligent (i.e., dumb) terminals or fully programmable workstations, are used to allow system administrators and users to communicate withcomputer system100. Note, however, that whiledisplay interface140 is provided to support communication with one ormore displays165,computer system100 does not necessarily require adisplay165, because all needed interaction with users and other processes may occur vianetwork interface150.
Network interface150 is used to connect other computer systems and/or workstations (e.g.,175 inFIG. 1) tocomputer system100 across anetwork170. The present invention applies equally no matter howcomputer system100 may be connected to other computer systems and/or workstations, regardless of whether thenetwork connection170 is made using present-day analog and/or digital techniques or via some networking mechanism of the future. In addition, many different network protocols can be used to implement a network. These protocols are specialized computer programs that allow computers to communicate acrossnetwork170. TCP/IP (Transmission Control Protocol/Internet Protocol) is an example of a suitable network protocol.
At this point, it is important to note that while the present invention has been and will continue to be described in the context of a fully functional computer system, those skilled in the art will appreciate that the present invention is capable of being distributed as a program product in a variety of forms, and that the present invention applies equally regardless of the particular type of computer-readable media used to actually carry out the distribution. Examples of suitable computer-readable media include: recordable type media such as floppy disks and CD RW (e.g.,195 ofFIG. 1). Note that the preferred signal bearing media is tangible.
Embodiments of the present invention may also be delivered as part of a service engagement with a client corporation, nonprofit organization, government entity, internal organizational structure, or the like. Aspects of these embodiments may include configuring a computer system to perform, and deploying software, hardware, and web services that implement, some or all of the methods described herein. Aspects of these embodiments may also include analyzing the client's operations, creating recommendations responsive to the analysis, building systems that implement portions of the recommendations, integrating the systems into existing processes and infrastructure, metering use of the systems, allocating expenses to users of the systems, and billing for use of the systems.
It is also important to point out that the presence ofnetwork interface150 withincomputer system100 means thatcomputer system100 may engage in cooperative processing with one or more other computer systems or workstations onnetwork170. Of course, this in turn means that the programs and data shown inmain memory120 need not necessarily all reside oncomputer system100. For example, one or more portions shown inmain memory120 may reside on another system and engage in cooperative processing with one or more objects or programs that reside oncomputer system100. This cooperative processing could be accomplished through use of one of the well known client-server mechanisms such as remote procedure call (RPC).
FIG. 5 illustrates awindows screen500 of a document manager program according to a preferred embodiment. Thewindow screen500 includes a graphical user interface (GUI) that highlights related user interface controls based on the object that is currently selected by means of a related user interface control highlighting mechanism125 (FIG. 1). In the illustrated example ofFIG. 5, the object selected is apicture file522 stored in a computer resource such as a computer disk drive or network disk drive and represented on the screen by an icon. When the icon ofobject522 is selected the icon is highlighted to reflect that it is a selected object on the screen.Window screen500 illustrates how the window screen would appear after the picture file222 is selected as described above with reference toFIG. 2. Thus,window screen500 represents the state of window screen shown in the prior art ofFIG. 3, andwindow screen500 according to preferred embodiments can be compared to the prior art screen shown inFIG. 3. As can be seen inFIG. 5, themenu bar514 has highlightedcontrols530,532. The “file”button530, and the “edit”button532 are uniquely highlighted by bold text inFIG. 5 to indicate to the user that the underlying drop down menus contain related user interface controls to the selectedobject522 on the screen according to preferred embodiments herein. The user interface controls are uniquely highlighted, meaning they are highlighted in a manner that distinguishes interface controls that are specifically related to the selected object(s) from those interface controls that are available depending on the context.
Again referring toFIG. 5, another embodiment is also illustrated. In thewindow task bar518 the “Picture Tasks” button533 is highlighted to show that the picture tasks button533 has one or more menu items that are related to the selectedobject522. In this embodiment, the type of the object is important in the determination of the relationship between the object and the highlighted GUI control. As can be seen inFIG. 5, the selectedobject522 is a graphic file indicated by the .jpg file extension. Thus the related widows tasks are those that operate on graphic files, so thepicture tasks button518 is highlighted. In this embodiment a single aspect of the selected object, the file extension, is used to identify a specific class of user interface controls, those that are related to the file extension of the selected object.
FIG. 6 illustrates another view of windows screen500 of the document manager program shown inFIG. 5 according to another preferred embodiment. InFIG. 6,window screen500 illustrates how the window screen would appear after the “edit”button532 inFIG. 5 is selected to display the drop downmenu534. Thus,window screen500 inFIG. 6 according to preferred embodiments can be compared to theprior art screen200 shown inFIG. 4. In contrast to the prior art shown inFIG. 4, the drop downmenu534 inFIG. 6 has highlightedcontrols536,538. The “cut” and “copy”buttons536, and the “copy to folder” and “move to folder”buttons538 are highlighted to indicate to the user that these menu items are directly related user interface controls to the selectedobject522 on the screen. The other buttons on the drop downmenu534 may be displayed in bold or in shadow to show which menu items are available or not available respectively as is known in the prior art. In this embodiment, related user interface controls means that the highlighted controls will activate menu selections that perform a task using the selectedobject522 or act on the selectedobject522.
FIG. 7 shows awindows screen700 of a drawing editor program to illustrate an example of another preferred embodiment. Thewindow screen700 provides a graphical user interface (GUI) that highlights related user interface controls in atool box710 based on the object that is currently selected in a sub-window712 of the windows screen700. In the illustrated example ofFIG. 7, thesub-window screen712 includes two drawing objects, acircle714 and arectangle716.FIG. 8 illustrates another view of windows screen500 of the drawing editor program shown inFIG. 6 according to a preferred embodiment.FIG. 8 illustrates how thewindow screen700 would appear after therectangle716 inFIG. 7 is selected. InFIG. 8, thetool box710 has highlightedcontrols718 and720. The “fill”button718, and the “eraser”button720 are highlighted to indicate to the user that these menu items are related user interface controls to the selected object716 (rectangle) on thesub-menu screen712. The highlighted menu items indicated to the user that these user interface controls are related to the selected object to assist the user to quickly see what options are available in conjunction with the selected objects or that will act upon the selected objects.
FIG. 9 shows awindows screen900 of a browser program to illustrate an example of another preferred embodiment. Thewindow screen900 provides a graphical user interface (GUI) that highlights related user interface controls in abrowser window screen900 orbrowser web page910 based on the object that is currently selected in theweb page910. In the illustrated example ofFIG. 9, theweb page910 includes auser input box912 withseveral fields914,916,918,920 and922 to input user information, and a “Go”button924 to initiate a registration process using the user information in theuser input box912. The changes that occur toFIG. 9 according to a preferred embodiment are described with reference toFIG. 10.
FIG. 10 illustrates another view of windows screen900 of the browser program shown inFIG. 9 according to a preferred embodiment.FIG. 10 illustrates how thewindow screen900 would appear while the user is in the process of filling in requested information in theuser input box912. InFIG. 10, the user has already input “John Doe” in thename field914 and the address “1010 Anywhere” in theaddress field916. The cursor underline character after the text (1010 Anywhere_) in theaddress field916 indicates that the cursor is in the address field and the address field is “selected”, meaning it is the current active field in the display. According to a preferred embodiment, the related user interface controls in thebrowser window910 are highlighted based on the object that is currently selected in the browser window. In this example, the selected object is theaddress field916, and the highlighted user interface controls are thecity field918, thestate field920 and thezip code field922.
FIG. 11 illustrates another view of windows screen900 of the browser program shown inFIG. 9 according to another preferred embodiment.FIG. 11 illustrates how thewindow screen900 would appear when the user completes the process of filling in requested information in theuser input box912. InFIG. 11, the user has just completed input to each of the fields in theuser input box912. The cursor underline character after the text (64386_) in thezip code field922 indicates that the cursor is in thezip code field922. Since the zip code field is the last field in theuser input box912, the user can now be prompted what user interface controls are available or will act on the selected and completedinput box912. According to a preferred embodiment, the related user interface controls in thebrowser window900 are highlighted based on the currently selected object in the browser window being a completed input field. In this example, the selected object is thezip code922 of theuser input box912 and the highlighted interface control is the “Go”button924.
FIG. 12 shows another windows screen1200 of a browser program to illustrate an example of another preferred embodiment. In the illustrated example ofFIG. 12, theweb page1210 includes a “shopping cart” type web page that is in common use on the internet. The shopping cart allows a user to select items from a vendor's web pages for purchase. In the example ofFIG. 12, the user has selected two items forpurchase1212, and1214. Thecursor1216 with the “Click”text1216 indicates that the user is selecting theitem1214.FIG. 13 illustrates the changes that occur toFIG. 12 when the user selectsitem1214 according to a preferred embodiment. As shown inFIG. 13, selected status ofitem1214 is indicated by highlighting theitem1214 in a manner know in the prior art. According to a preferred embodiment, the related user interface controls in thebrowser window1212 are highlighted based on the object that is currently selected in the browser window. In this example, the selected object is theitem1214, and the highlighted user interface controls are theremove item button1216 and the item detailsbutton1218.
In the above described embodiments, the related control was “highlighted” by showing the control darkened on the screen. Other embodiments herein include how the highlighting could be visually represented on the screen. The highlighting could include any other appropriate representation such as using different colors, blinking, border treatment, reverse video etc. In addition, different highlighting could be used for different purposes. For example, a red color could be used for destructive actions such as delete or cut, and a green color could be used for less destructive actions such as copy and paste. In another embodiment, the color could be used to indicate what role a person must be enrolled to use the action, such as red for a security officer, and green for an administrator. In this way the different highlighting can emphasize different criteria for the related controls or different characteristics of the related controls. The different criteria of the related controls offers information to the user about the different types of controls available to use with the selected object or operate on the selected object.
Referring now toFIG. 14 amethod1400 is shown according to preferred embodiments herein.Method1400 illustrates the steps performed by the related user interfacecontrol highlighting mechanism125 shown inFIG. 1 that highlights related user interface controls based on a selected item according to preferred embodiments. The method first identifies a selected object and the type of selected object (step1410). Then the interface controls that are related to the selected object and/or the type of selected object are identified (step1430). The interface controls that are related to the selected object are then highlighted in some manner (step1430) and the method is done.
It is known in the prior art to navigate GUI controls such as a menu bar or browser page menu controls with the keyboard. This is sometimes referred to as tab setting, because it is common to use the tab key along with the arrow keys to move between menu commands. Using the tab key is particularly common when moving between user interface controls within a browser page. In many software applications, this feature is available after pressing a control key to move the cursor to the menu bar. The arrow keys can then be used to sequentially move the cursor through the menu bar options.
In contrast, in preferred embodiments, a subsetted tab order is used to navigate only the GUI menu elements that are uniquely highlighted as described above. In preferred embodiments, a subsetted tab order is activated with a special key stroke such that the keyboard can navigate the user interface controls as described above but the navigation is limited to the subset of uniquely highlighted controls. The special key stroke to activate the subsetted tab order could be the combination of “ctrl” and “Alt” and “tab.”FIG. 15 shows an example of subsetted tab order according to preferred embodiments with reference toFIG. 6.FIG. 6 represents the screen after the user activates the subsetted tab order with a special key stroke and moves the cursor to the “Edit” menu option. When the user then presses the down arrow key, the cursor will move to the “cut”menu option1520 and will skip the “undo”menu option1522 because the “undo”menu option1522 it is not uniquely highlighted. Similarly, using the arrow keys will navigate through the menu to only those items that are uniquely highlighted. For example, again pressing the down arrow would move the cursor (not shown) to the “copy to Folder”menu option1524 and then to the “move to folder”menu option1526.
An apparatus and method has been described for highlighting related user interface controls to objects that are currently selected on the display screen to show the user what actions or menu options are available to perform some action on the selected object or related to the selected object. The described embodiments improve the ease of use and the intuitiveness of a graphical user interface by reducing the complexity of choices available and assisting a computer user to efficiently navigate through the GUI.
One skilled in the art will appreciate that many variations are possible within the scope of the present invention. Thus, while the invention has been particularly shown and described with reference to preferred embodiments thereof, it will be understood by those skilled in the art that these and other changes in form and details may be made therein without departing from the spirit and scope of the invention.