Web based user interface for selecting options

• US 7,614,018 B1
• Filed: 02/13/2006
• Issued: 11/03/2009
• Est. Priority Date: 02/13/2006
• Status: Active Grant

• Current Assignee: Google LLC (Alphabet Inc.)
• Original Assignee: Google Inc. (Alphabet Inc.)
• Inventors: Ohazama, Chikai J., Delaye, Darren
• Primary Examiner(s): Lo; Weilun
• Assistant Examiner(s): Salomon; Phenuel S
• Application Number:
  US11/353,316
• Time in Patent Office: 1,359 Days
• Field of Search: 715/862, 715/763, 715/764, 715/977, 715/860
• US Class Current: 715/862
• CPC Class Codes: G06F 3/04817 using icons graphical or visual programming using iconic symbols G06F8/34
• CPC Class Codes: G06F 3/0482 Interaction with lists of selectable items, e.g. menus

Abstract

Icons can be combined to form toolbars such as those appearing on computer desktops and within application windows such as web browsers. Small icons are desired because desktop real estate is expensive. Small icons can be difficult to select or open because it can be hard to confirm which icon is indicated. An icon is indicated when the desktop cursor hovers over it. Altering the indicated icon provides good user feedback. Icons inside browser windows can be changed varying their size. Non-indicated icons can revert to a minimum size while an indicated one grows to a maximum size. Different images can be displayed for different sized icons, producing a more pleasing appearance. Alternatively, icons can be presented as display images produced by morphing two images together using morphing functions and icon weights. Morphing includes growing and shrinking as well as color changes, animating, and so forth.

Claims

1. A method comprising:

downloading a web page into a web browser window wherein the web page comprises at least two icons wherein each of the at least two icons comprises an icon size and an image selection, wherein each of the at least two icons is associated with a software module, a small image, a large image, an opening event, and a morphing function, and wherein the opening event causes the software module to run and wherein the morphing function is a function that produces a display image from the small image and large image;

initializing the at least two icons wherein the image selection is set to the associated small image and wherein the icon size is set to the size of the associated small image;

displaying the at least two icons inside the web browser window wherein each icon is displayed by displaying the image selection with an area equaling the icon size; and

entering an iterative loop comprising;

waiting for a time interval and then determining if a pointing device is pointing at one of the at least two icons wherein the pointed at icon is called an indicated icon and every other icon is called a collateral icon;

setting the image selection of the indicated icon to the indicated icon'"'"'s associated large image and the indicated icon'"'"'s icon size to the size of the associated large image if the indicated icon'"'"'s icon size equals or exceeds the size of the associated large image;

setting the image selection of every collateral icon to each respective collateral icon'"'"'s associated small image and the respective collateral icon'"'"'s icon size to the size of the associated small image if the size of the associated small image equals or exceeds the respective collateral icon'"'"'s icon size;

growing the indicated icon unless it exceeds the size of the indicated icon'"'"'s associated large image;

shrinking every collateral icon if it exceeds the size of the respective collateral icon'"'"'s associated small image; and

displaying the at least two icons on a display device.

2. The method of claim 1 wherein growing the indicated icon comprises:

increasing the icon size by a constant amount in height and by a constant amount in length; and

setting the icon'"'"'s image selection to the icon'"'"'s associated small image.

3. The method of claim 2 wherein shrinking every collateral icon comprises:

decreasing the icon size by a constant amount in height and by a constant amount in length; and

setting the icon'"'"'s image selection to the icon'"'"'s associated small image.

4. The method of claim 1 wherein growing the indicated icon comprises:

increasing the icon size by a constant amount in height and by a constant amount in length; and

setting the icon'"'"'s image selection to the icon'"'"'s associated large image.

5. The method of claim 4 wherein shrinking every collateral icon comprises:

decreasing the icon size by a constant amount in height and by a constant amount in length; and

setting the icon'"'"'s image selection to the icon'"'"'s associated large image.

6. The method of claim 1 wherein shrinking every collateral icon comprises:

decreasing the icon size by a constant amount in height and by a constant amount in length; and

setting the icon'"'"'s image selection to the icon'"'"'s associated small image.

7. The method of claim 1 wherein the iterative loop further comprises normalizing the icon size of the at least two icons.

8. A method comprising:

downloading a web page into a web browser window wherein the web page comprises at least two icons wherein each of the at least two icons comprises a weight, wherein each of the at least two icons is associated with a software module, a first image, a final image, an opening event, and a morphing function, wherein the opening event causes the software module to run, wherein the morphing function is a function that produces a display image from the first image, the final image and the weight, and wherein the weight is a parameter used to produce the display image and the weight has an adjustable minimum value and an adjustable maximum value;

initializing the at least two icons wherein the icons'"'"' weights are set to their minimum value and their morphing functions are used to produce their display images;

displaying the at least two icons inside the web browser window wherein each icon is displayed by displaying the icon'"'"'s display image; and

entering an iterative loop comprising;

waiting for a time interval and then determining if a pointing device is pointing at one of the at least two icons wherein the pointed at icon is called an indicated icon and every other icon is called a collateral icon;

if the indicated icon'"'"'s weight exceeds the maximum value then setting the indicated icon'"'"'s weight to the maximum value and updating the indicated icon'"'"'s display image;

if the indicated icon'"'"'s weight is less than the maximum value then increasing the indicated icon'"'"'s weight and updating the display image;

for every collateral icon having a weight less than the minimum value, setting the collateral icon'"'"'s weight to the minimum value and updating the display image;

for every collateral icon having a weight exceeding the minimum value, reducing the collateral icon'"'"'s weight and updating the display image; and

updating the web browser window to display the most recent display image for each of the at least two icons.

9. The method of claim 8 wherein increasing the weight comprises adding a constant value to the weight.

10. The method of claim 8 wherein reducing the weight comprises subtracting a constant value from the weight.

11. The method of claim 8 wherein increasing the weight comprises multiplying the weight by a value greater than 1.

12. The method of claim 8 wherein decreasing the weight comprises multiplying the weight by a value less than 1.

13. The method of claim 8 wherein, for every icon, the morphing function calculates pixels of the display image as a weighted sum of first image pixel values and final image pixel values and wherein the icon'"'"'s weight is used to calculate the weighted sum.

14. The method of claim 8 wherein, for every icon, the morphing function calculates height and width of the display image as a weighted sum of height and width of the first image and height and width of the final image and wherein the icon'"'"'s weight is used to calculate the weighted sum.

15. The method of claim 14 wherein the morphing function produces a scaled first image and a scaled final image having the height and width of the display image and wherein the morphing function calculates pixel values of the display image as a weighted sum of scaled first image pixel values and scaled final image pixel values and wherein the icon'"'"'s weight is used to calculate the weighted sum of the scaled first image pixel values and the scaled final image pixel values.

16. The method of claim 15 wherein increasing the weight comprises multiplying the weight by a value greater than 1.

17. The method of claim 16 wherein decreasing the weight comprises multiplying the weight by a value less than 1.

18. The method of claim 15 wherein increasing the weight comprises adding a constant value to the weight.

19. The method of claim 8 wherein the iterative loop further comprises normalizing the weight of the at least two icons.

20. A system comprising:

a means for choosing at least one small image and at least one large image;

a means for creating at least two icons wherein each one of the at least two icons is associated with one of the at least one small image, is associated with one of the at least one large image, and comprises an icon size, and an image selection, wherein the image selection is set to the associated small image, and wherein the icon size is set to the size of the associated small image,

a means for morphing each of the at least two icons from the at least one small image and the at least one large image associated with each icon;

a display means for displaying in a window the at least two icons wherein the image selection is displayed with an area equaling the icon size;

a means for selecting one of the at least two icons wherein selecting the icon causes a software module to run;

a means for indicating one of the at least two icons such that the indicated icon is called an indicated icon and every other icon is called a collateral icon;

a means for repeatedly identifying the indicated icon;

a means for repeatedly increasing the indicated icon'"'"'s icon size without exceeding the size of the icon'"'"'s associated large image;

a means for repeatedly decreasing every collateral icon'"'"'s icon size without reducing it below the size of the icon'"'"'s associated small image; and

a display means for repeatedly displaying the at least two icons in the window.