Vύng layers to construct graphical user interfaces

CROSS-RMΈRDNCΈ TO RI;Ϊ ΛTI-D APPLIC \ ΠONS

I he above patent application claims priority from L ^' S provisional patent application 61/183,776, Redding, et al . (τnφhical user interface for (rawing u.sers through interaction u ifh application progiams. filed 6/3/2009 and from U S provisional patent application 61 230,683, Redding, Eώkw ami player for a graphical user interface for framing users through interaction » ι(h application programs, tiled 7/31/2009 Cach of these applications is hereby incorporated by reference into the present application for ail pctmissibie puipυses

STATEMENT RFG ADDING FEDFR W. LY SPONSORED RESEARCH OR DHVELOPMPNT Not applicable

REFERENCE TO Λ SEQUENCE LISTING Not applicable

BACKGROUND OF THE INVENTION

ϊ , Field of the invention

I he imention relates general!)- to graphical user interfaces and more specifically to graphical usei interfaces which are perceived by their users as

2. Description of retated art

Digital systems with which human beings directly interact general!) e graphical user interfaces (GUIs) by means of which the user control or configurer the digital s> rtem FlG S shows a typical graphical u&ei interface for a persona! computer S01 The hardware of persona! computer 501 includes a processor 503. a displa> deuce 504 upon which processor 503 produces a display 505, a keyboard 509 for inputting alphanumeric

i and control characters to processor 503, and a mouse 51 1 , which is one kind of pointing device. Mouse 51 1 provides pointing and selecting inputs to processor 503. Pointer 507 in display 505 moves in response to the motion of mouse 511. Graphical user interface 517 has two main components: input devices 5 S3, which receive inputs from the user, and display component 515, which produces a display that is responsive to the inputs from the user. Thus, when the user moves mouse 51 1, processor 503 responds by moving pointer N07 in display component 515. A graphical user interface may of coof se have many different kinds of input devices and there may be many different kinds of interactions between the input devices and the display. For example, many digital systems now employ a display with a touch-sensitive surface as an input device and have dispensed with the mouse, the keyboard, or both. In the latter case, the pointing device is the touch of the user on the touch-sensitive surface and the keyboard is an image of a keyboard in the display. To input characters or control information, the user touches the keys in the image. The basic manner in which the graphical user interface operates is however the same as that of the graphical user interface of FIG. 5: inputs from the user via the input device(s) affect the behavior of the program generating the display and the altered behavior of the program results in a change in the display.

Most modern graphical user interfaces employ windows. In windowing graphical user interfaces, an execution of a program in the digital system with which the user of the digital system is interacting is represented by a window in the display. The window is the display portion of the program's graphical user interface. There may be several windows in the display The user employs the graphical user interface ^' s pointing device to select a window as the active window, and when a window is active, it responds to inputs from the graphical user interface's input devices and thus functions as the display part of the graphical user interface for the program execution represented by the window.

1n windowing systems, the windows appear to the user as layers, i.e , the user of the windowing system may move lhe windows on the display so that one window is superimposed on another window. However, from the point of view of the graphical user interface, only one window is active at a given point in time. A consequence of this fact is that windows are typically opaque with regard to other windows. The combination of windowing graphical user interfaces with the constantly growing ability of digital data processing systems to handle images has been a major driver of the transition of digital systems from fools of a technological elite to objects which may be found in the pockets and purses and on the desks of most of the population. While digital data processing systems with modem graphical user interfaces are far easier to use than older systems, the modern graphical user interface cannot hide the underlying complexity of the program with which the user is interacting via the graphical user interface. To give a simple example; a modern word processing program gives a teenager writing a paper for his or her high-school English class possibilities for formatting text and including graphical elements in the paper which were formerly available only for writings edited by publishing houses and printed by commercial printers. The downside of the power of modern word processing is that the word processing program's graphical user interface is more complex than the combined interfaces of the typewriter, publisher's editing system, and printer's typesetting and printing systems which the word processor program has replaced. In fact, for a user who not grown up with word processing programs, the complexity of the word processing program ^' s GUI renders the word processing program at best intimidating and at worst impossible to use.

The response of the software industry to the ever-increasing complexity of their programs has been the "help" button in the program's GUI. The "help ^" button gives access to a steadily increasing range of documentation about the program as well as to facilities for finding things in the documentation. Finding the right piece of documentation is often a frustrating process. Even when the user has found it, applying it to the problem is difficult The documentation is of course displayed in a window which is separate from the window in which the program's GUI was displayed. This means at best that the user must view the documentation in one window and the program's GU! in another window; at worst, if the display is small, the documentation window will be on top of the program GUI's window and will cover it or vice-versa. In many cases, the only way to deal with the problem is print out the documentation. What is needed to deal with this problem is a GUI which permits the program ^' s GUI to in effect be augmented by information from the ''help ¹ documentation to form a GUI in which the "help ^" information is available at the points where ii is needed in the program ^' s GUI. Such a GUI would further be useful not only for "help", but for any situation in which a GUI can usefully be augmented with additional information or functionality. It is an object of the present invention to provide techniques for augmenting any Gl.' ) to which a layer may be added.

BRIEF SUMMARY OF THE INVENTION in one aspect, the object of the invention is attained by apparatus that provides a graphical user interface in a digital data processing system The digital data processing system produces a display in a display device. The display device is perceived by a viewer of the display device as having layers. The apparatus includes a target layer of the layers and an ov erlay layer of the layers. The target layer is specified as an attribute of the overlay layer. The apparatus further includes at least one widget which is relevant to the target layer but whose attributes are specified relative to the overlay layer,

In further aspects, the target layer may be visible through the overlay layer, while the widget may display information which is relative to the target layer. The widget may also indicate a specific location in the target layer

The apparatus may include an input device whereby the user provides inputs to locations in the display; in that case, an input to a location in the display which is overlaid by the overlay layer is responded to by the overlay layer rather than by the target layer, it may further be the widget which responds to the user input, and the response may include providing input to the target layer

The apparatus may further include a program which is associated with the overlay layer and which performs an action. The action may be the playing of an audio or video sequence or a timed sequence of actions that affect the widget. Other objects and advantages wii be apparent to those skilled in the aits to which the invention pertains upon perusal of the following Ik'tωkd IX'Hnpfton and drawing, wheiein

BRIEF DESCRIPTION OF THE SEVERAL VIEWS OF THE DRAWINGS FIG. 1 shows a graphical user interface made using the disclosed techniques, FIG. 2 is XML from which the graphical user interface of FlG. 1 may be generated, FlG. 3 is a state machine Ibϊ the graphical υ&cr interface of FlG 1 , FlG. 4 is an editing control biowser window which is used to cieate or edit the graphical user interface of FlG 1 , and

FIG. 5 shows a prior -art digital system uiih a graphical user interface Reference numbers in the drawing have three or more digits the two right-hand digits are reference numbers m the dialing indicated by the remaining digits Thus, an item with the reference number 203 first appears as item 203 in FIG 2

I)FFAILM) DSiSCRiPTiON OF THK INVI-NTIOK

Overview of a graphical user interface made using layers In a presently-preferred embodiment, the target layer is a browser window and the overlay layer is a borderless tiansluceiU window provided by the Microsoft Windows® operating s>siem FKJ 1 shows an example of how widgets in the overlay Saver may he used to point out features of the target layer The target lave* in FJG 1 is a Web page 0102 from the sage.com Web site, the overlay ia\ er is Windows window Ol lό whose attributes have been set to make n translucent, so that W eb page 0102 is \ isible through window 01 iό W idgets 0104, 010S 01 JO. 0108, 010< ⁾ , 01 18 and 01 19 are attached to the overlay f aver but relate to the target layer Control area 0117 is distinct from both the target layer and the overlay layei and controls the use of the overlay layer to pi ox ide a lesson in the use of the interface provided bv the target layer Over! as layer 0 ! 16 intercepts all inputs to the overlay area, flic effect of inputs to widgets in the overlay area depends on the kind of widget Arrow widget 0109, for example, exists solely to point to a feature of the target Saver and is unaffected by inputs to it, widget 0105, by contrast creates a lioic ' 0106 in overlay layer 01 16, a mouse dick in flic "hole" causes the "contacts ^'" button m the target GUI to respond to the mouse click Widget OUO, finally, indicates a source of audio information for the tutorial, when the user dicks on it, the audio information is, played

I he disρia> shown in VlG 1 is a -window winch is part of a tutorial m using the gjaphicai user interface presented by the Web pages of the target layer The s\ stem which presents the tutorial is termed in the following "TrainiπgWheels' ^Λ The tutorial is made up of a sequence of target iayer Web pages with erl ays pointing out features of the target pages and containing infos matiort about how to use them Ylox cnient through the tutorial begins when the user clicks on play button Oϊ 13 and continues under control of the I raining Wheel-* state machine flic state machine responds to clock ticks and to ti&cr inputs The tutorial may be accompanied bv audio or \ ideo explanations. Within a particular overlay layer-target combination, widgets ma> appear and/or disappear fioni the overlap la> er imdc-i conliol of the state machine

The use: initiates a TramiπgWfieels lesson by using the File menu ON l in control ON 7 to select a lesson ( Isn) file to open The loaded lesson causes information to disp!a\ on the CiJay portion of the screen 01 16 and Ϊ11K in the Lesson Contents 01 12 on the Control poπion of the screen ON? The lesson is started by clicking the Way menu entry 01 H or the Play button 01 13 The Play menu entry and button will change to Pause when the lesson is playing The lesson is, currently paused The sample lesson is using http / wwvv thesageexchange com 0102 as the source of the target web pages I he tutorial is organized into one or more Chapters, containing one or more Topics Each topic has associated with it an ma> zero or more widgets The Chapters arc the points - this lesson contains only one chapter as shown m Lesson Contents 0112 in control area 01 17 0101 is the title bar of TrainingWheels It contains TrainingWheels concatenated with the current playing I essυn, Chaptet and ϊopic Titles fhe pi ogress thtough the cυtient topic ib recoided in the time box 0115 in control area OU 7 indicating 2 seconds of the 4 second narratixe have completed. The topic audio may also be played at a faster rate by clicking the Fast Forward checkbox 01 14.

Widgets in overlay 0116 A widget is an object which is associated with the overlay area and contributes to the overlay layer ^' s augmentation of the target iayer Most widgets appear as icons on the overlay layer, but some are invisible The overlay layer of FIG. 1 contains the following visible widgets' s.

The green frame 0104 highlights the Home button on the target layer, it is a translucent widget. The center of the green frame 0103 does not contain a hole (explained later) but is an active aiea that can intercept user mouse clicks to be processed by TrainiπgW heels User inputs to the frame cause a state variable to be set that is monitored by the TrainingWheels state machine.

The red frame 0105 is an opaque widget that is being used to highlight the Contacts button on the target la\ er The center of the r$d frame 0 ! 06 i s a hole A hole means that any mouse clicks inside the hole are passed directly to the target layer. Holes and opaque/translucent are fully perm u table and the frames can have different sizes, positions, colors and frame thicknesses.

The musical note shaped icon 01 10 is a translucent icon that is used to allow the user to select an additional audio clip to listen to should they click on the icon. There are more details about the audio clip available in a Tooltip pop-up similar to 0108 This icon can be either translucent or opaque. There is also a similar video clip icon that is not shown in this image

The arrow icon 0109 is an opaque arrow used to point to items of interest The creator of the tutorial can make the arrow opaque or translucent, can orient it in any direction, and can resize it. The text block or note widget 01 19, that is currently opaque, adds text to the overlay layer. The creator of die tutorial can specify text size, foreground color and background color. It can be used to »ive the user suidance is to what to do next and it can be used for subtitling of the audio text if desired.

The definition highlight 0107 is used to provide Tooltips to expand on identified words or phrases, it is only available in yellow and translucent.

An image 01 18 is displayed on the opaque layer. It can be resized and repositioned to provide logos and additional images beyond the contents of the target layer.

Once the user of TrainingWheels presses play button 01 13, the tutorial continues executing chapter by chapter, and within a chapter, topic by topic, under control of the state machine until the tutorial is co.niplet.ed or the user pauses the execution The manner in which the topics are executed may of course depend on user input received in the overlay layer, and in some cases, the overlay will pass the user input through to the target layer, where it will affect the behavior of tlie target layer's program and GUI

The XML for overlay layer 0116: FKi. 2 ϊn a preferred embodiment, the target layer GUI is produced by a Web browser and the overlay layer is a standard Windows window, XMl. is used to define the GlH for the overlay layer. The XML for overlay layer Oi 16 is shown in FlG. 2. The XML representation of Figure 1 is a lesson containing one Chapter and one Topic. Each of the elements contains various attributes used in the lesson. The Lesson, Chapter and Topic all contain title attributes 020! used to generate the Title Bar 0101. The Lesson contains a size attribute 0202 to set the dimensions of the browser window for target layer 0116. The window for overlay layer 0116 is set to the same dimensions and its upper left-hand corner is set to coincide with the upper left-hand comer of the browser window for target layer O i 16 The Lesson aiso includes a raediadi rectory attribute 0203 Io identify a lesson relative directory containing all narration, image and video files used in the lesson. The Topic element 0205 defines an overlay 01 16 for a topic and specifies the attributes for the topic. Included in these attributes are the LiRI for the Web page displayed by the target layer for overlay layer, the translucency and tint of the overlay layer, and XML elements nested in the Topic element that define the overlay layer's widgets. Within Topic element 205 itself, "opacity" attribute specifies the degree of translucency of the overlay layer, ranging from opaque through transparent. The ^' "haekeolor ^*1 attribute specifies the overlay layer's tint. The "link" attribute specifies the target layer Web page. The "checklink" attribute is used in some situations to determine if the topic is starting at the correct target layer Web page. The attribute "continues ¹ ' determines if the tutorial will automatically continue to the next topic or wait for some user input before continuing. In this case the attribute is false and since the XMl, element 0206 which represents widget Ol 03 has a "click" action attribute, the tutorial will wait for a user input OTΪ widget 0103 to continue. The Topic element also includes a "file ^" attribute that names the audio file to be used for the narration that accompanies the topic's target layer and overlay.

Most of the XML elements contained in the Topic element define widgets, in the preferred embodiment, the visible widgets are defined as layers on the overlay layer. The elements that define a visible widget include a "layer" 0210 attribute which determines whether the widget is transparent or opaque with regard to the overlay layer, Most also include ^" location ^" 0206 and "size ^" 0206 attribute that positions and sizes the widget defined by the element on the overlay layer.

Most elements include a "starttime" 0208 and sometimes and "endtime ^"1 0209 attribute. These are used by the Training Wheels state machine to cause the widgets defined by the elements to appear and disappear in synchronization with the progress of the narration playback. A starttime of "0" means the widget will appear at the start of the narration. A starttimε of "end" means the widget will appear after the narration lias completed. This is used when a topic has "continues" set to false so that the widget appears after the narration and stays until the user input is detected and the topic continues. The "endtirae" attribute is > ™ "P and ma\ contain "end" or "never" An " ^■ eiidtime ^"1 of "end ^1" means that the widget disappears at the end of the narration playback for the topic An "endtimcf of "never ^" means that the w idget stays visible unit! a user input has been received and the topic continues

frame widgets such as widget 104 and widget 106 have "holes" which ma\ or may not pass user inputs through to the target layer The XMΪ elements that define frame xύdgets the "hole" 0212 attribute that determines if the widget's inner rectangle allows mouse clicks to pass through directly to the target layer If the "hole ^" attribute is "false", then TrainingW heeis any user mouse clicks on the inner rectangle and wiit use the "action ^" 0213 attribute along with the optional ""parare P and "paraml ^"1 attributes to cause some action to occur in the target layer or in TrainingWheeis Examples include be senώng a mouse dick to IrairώigW heels, clicking a button in the target I aver, submitting a foπn in the target I ^' RL in the target layer oτ executing a target layer script

Some of the widgets defined by the c elements nested in the ϊopic element are not visible to the user \ sample of one of these is the "scroll' ^* 0211 element that defines a widget that will at "staritime ^" of 3 seconds cause the target layei ^' s web page to seioll to position ^kv 100G" which is the bottom of the page in this case There aie similar invisible widgets to fill in text boxes, checkboxes and radio buttons in the target layer and trigger oilier events in the target layer Ihese are referred to in the context of the Training Wheels state machine as e\ ent widget* _*

Operation of the Training Wheels player: FIG, 3

Once the user has selected a lesson, TrainingWheeis loads and parses the XML for the lesson parsed into an internal tree representation of the XML Each XML element is a node of the tree The node contains attributes of the element and the node for the lesson element is the tree's root The attributes in the lesson element ^' s node are used to configuie the dimensions of the lesson ^' s target and overlay layers The chapter tnle ^" attributes are used to populate the lesson contents for navigation in control section 01 17.

IO At the start of each topic, TrainingWheeis loads the topic from the topic element's node and subnodes Loading a topic consists of the following steps a) Set the opacity and tint foi the topic ^' s overlap layer b) Create data structures for all visible widgets from the clement* defining the widget, howeser, the \ isib!e widget remains hidden until it is to appear in the overlay !a\ er c) Queue starttime and endtime callbacks for all widgets to show hide visible widgets or activate invisible widgets ά) Callback all "starttime - O" widgets immediately This causes these visible widgets to appear in the overlay e) Compare the "checklink ^" topic attribute to the current URL If it matches, skip the topic f) Navigate to tlic "link" topic attribute if it is set g) Load the naπation file from the mediadi rectory into the audio playe? if the play state is active

The main proguirn in TrainingWheeis evecutes the slate machine 301 shown in FIG i I here are 5 states-

• idling 303, in which the TrainingW heels program is w aitiπg for the user to start a lesson or a chapter in a lesson • waiting 305, in which Training Wheels is wailing foi user input aftei a lesson has started The user input may be pressing the "pia> ^" button or input to a widget

• load topic 307, in which the lesson is continuing but the data structures for a new topic need to be loaded

• playing, in which the user has pressed the "play ^" button and TrainingWheeis is not w ai ting for user input to a w idget

• paused, in which the usci has pressed the ""pause" button. In this, state. 'irainingW heels waits for the user to press "play ^" and/or select a new chapter and press "play ^" '

State machine 301 of FIG uses a timer interrupt to determine whether a state change should occur It does this h> checking the state of the pause/play button, checking whcthei TrainingWheeis is wailing for user input to a widget, and whether the time has come for an event such as the appearance or disappearance of a widget or the beginning of a narration has occurred The timer interrupt frequency is 3Hz. The loop executed by the state machine with regard to the tinier is shown at 311, the timer is shown at 315. animate is the code which performs the state transitions shown in FIG.3, Jf the state machine is in "'playing ^" state 309, when the timer interrupt occurs. Tfaining.Wh.eels executes branch 325 of the state machine' it checks if any of the starttimes or endtimes for the widgets have been reached and if they have, calls the callback function for the widget. Once it detects the end of the audio narration, it processes all starttimes and endtiraes with the "end" value. Completion of the topic finishing the narration (if "continues ^1' is true) or receiving user input (if "'continues ^" is false) causes the data for the widgets to be abandoned for garbage collection by the system If the topic continues, the stale machine enters "waiting" state 305. If there is another topic, and the user has pressed "play ^'! or the required user input for the topic has occurred, the state machine enters 'load topic" state 307 if there are no more topics, the Play button, menu item are disabled, the lesson contents shows "<End of Lesson> ^; \ and the state machine enters -'idling ^* state 303, as shown at 323 Selecting a Chapter or loading a new lesson causes state machine 301 to return to the paused state 311 with the button showing "Play ^" . As shown at branch 327, if a new chapter is selected, the state machine enters waiting state 305; if "play ^" is pressed, the state machine enters "Playing ^" state 309.

Details of a preferred embodiment of TrainingWheels

The logic for the code which is executed to process the queue of starttirøe/endtirne actions when a lick 315 occurs in the timer

// Called with either the current narration elapsed time or with DEL AY. END // to process all the "end' ¹ action times Times set to "end" are actually queued as DBLAY. BN D

DELAY. PROCESSED - KKiU(H;; DKLAY. END == ^■ Yf???;

Void ProcessQueue (mt elaps≤ci: i

For i'i ~ 0; T < An i πvi ϊ:s\F..i st. Length; i-t-r'. {

Ji !.Aϊ!irajκ-5Li.st' ; i "> . De Lay <- lapsed; 5 AriiiaatcLisUi > .Callback;!

' Move to U)fj 'uturβ ^•■ wetv out Λ) i s\ <r . IV ^ y P"L<Vϊ , PP0C

I he media p!a\ ei play back for additional audio and video from their f idgets is implemented with a stack to alkw, indefinite nesting of audio and video pϊa>bacU to inteπupt the cuπent plav back and then iestoie the piev tons pla> back to it ^' s last stale

I he visible and im isible widgets aϊe implemented as instances of objects of each tvpe complete wth a set of fields to contain the attnbutes

The management widgets and attnbutc-. include a) Lesson ~ title size, mediadircctorv, vcisiun, copvright h) Chapter title c) Topic ~ title. backeolof, link chccklmk, contmuse, tile, isvideo, videolocation, \ ideowze

I he implemented visible widgets and attributes include a) ΛΠΌW faver, location size, starttime endtmie. dπection b) Definition - location, size, btaittimc, endtimc, text c) hrarae - layer, location size, starttime, endtime coloi, fiamewsdth, hole fill action param 1 , param2 ό) ( Audio) - ei, location, staittune, endtime file, text isvideo, vidoolocation, udeoM/o e) Medmin (Video) - !a>er lυcaϋon, staitπme, endtime file, text, isudeo, videolocation, videosize

0 Note - location si/e staitume endljmt: text, fontsi/e fonlcoloi , backcolυr g) Picture - lax ei , location, size, t.tarttιme, endtime, file, layout

The implemented invisible oi ev ent widgets and attributes include a) Checkbox ~ starttime, box, choice b) Click starttime. action, pai ami, paiam2 c\ Input starttime, field, text ά) Option - starttime, selector, index e) ScioH starttnrse, position

Creating TrainhigWheels overlays

To create a Training Wheels overlay, the writer of the lesson employs an editing system which has tv\ o windows one showing the target layer and ose$la\ being woiked on and another which the wnter uses to control the creating/ editing process I he window showing the target layer and overtax being worked on has a display which is substantially iike that of 1- IG 1 minus player contra! area 01 17 Contra! w indow 401 is shown in FIG 4 The window has components as follow

• Lesson sUucture component 403 shows the structure of the lesson as it presently stands and permits the writer to add new XML topics, elements in the topics, and chapters The structure is a tree which reflects the relationships between the XML elements The writer may use component 403 to select an existing element from the lesson structure or request a new element for addition to the structure

• Element attiibutes component 405 shows the atfiibutes of the selected existing or new element and the attributes' current and permits the writer to modify' those x alues As shown, component 40*! shows the attributes of the

"Demonstration fopic ^" component of the lesson

♦ Lesson contents 407 shows the current contents, of the lesson as the\ will appear to the user in control portion 01 17 of FiG 1

♦ Play button 41 ^c > permits the writer to play/pause the lesson as it currently stands • Component 409 enables editing generalb at 4 ! 1 enables specification of whether a widget is transparent oi opaque, and provides an area from which the writer can obtain a URL for pasting into the attributes of an element

Control window 40! interacts with the window that contains the display of the overlay layer and target layer as follows When the writer selects an existing or new wύhte widget in the control la\eι tree of 402, then the \ isible widget appears on the oveilay layer in the display browser with a repositioning handle that allows the writer to drag the visible widget around with die mouse and stretch/shrink it as well. The browser window for the target layer can also be resized and the result of the resizing is to set the lesson size attribute used in the player.

An additional feature of the editor is a verify function that checks for nodes with parameters that are left in the default slate and checks some other parameter combinations. Any warnings or errors are reported to the user.

Conclusion The foregoing Detailed Description has disclosed to those skilled in the relevant technologies the inventors' techniques for building a graphical user interface using a target layer and an overlay layer, for including widgets in the overlay layer, and for using the overlay layer and the widgets to augment tlie graphical user interface provided by the target layer. In the preferred embodiment, the target layer is a Web browser, the overlay layer is a window provided by an operating system, and the widgets are made using translucent and/or transparent layers provided by the operating system. However, as will be apparent Io those skilled in the relevant technologies, any technique for providing layers in a graphical user interface can be used to make the target layer and the overlay layer. Further, in some embodiments, there may be more than one overlay layer and the overlay layers may be independently controlled. Further, a layer which is an overlay to a target layer may be a target layer for another overlay. Further, any technique which has the effect of associating a widget with an overlay layer may be used to make the widgets.

The augmentations of the target layer provided by the overlay layer are used in the preferred embodiment to make a tutorial for new users of the graphical user interface provided by the target layer One consequence of that application is the temporal behavior of Training Wheels. However, other embodiments with different temporal behaviors or no temporal behavior at all may be made according to the principles disclosed herein and the OUI produced by the target layer and the overlay layer may be used for any purpose for which GUIs generally are used. For all of the foregoing reasons, the Detailed Description is to be regarded as being in all respects exemplary and not restrictive, and the breadth of the invention disclosed herein is to be determined not from the Detailed Description, but rather from the claims as interpreted with the full breadth permitted by the patent laws,