VISUALLY RICH TAB REPRESENTATION IN USER INTERFACE

• US 20110138313A1
• Filed: 12/03/2009
• Published: 06/09/2011
• Est. Priority Date: 12/03/2009
• Status: Abandoned Application

• Current Assignee: Apple Inc.
• Original Assignee: Apple Inc.
• Inventors: Jin, Jing, Thole, Michael, Sepulveda, Raymond, Sullivan, John William, Decker, Kevin
• Application Number:
  US12/630,759
• Publication Number:
  US 20110138313A1
• Time in Patent Office: Days
• US Class Current: 715/777
• CPC Class Codes: G06F 3/0481 based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance

Abstract

Methods and apparatuses that generate a thumbnail image for each tab in a window based on a snapshot of the window providing interface for a presentation corresponding to the tab are described. An expanded tab bar may be displayed to replace a tab bar inside the window. One or more thumbnail images may be displayed in the expanded tab bar. A user interface operation may be detected on a particular thumbnail image in the expanded tab bar to update the window for providing interface for a particular presentation corresponding to the particular thumbnail.

Claims

1. A computer implemented method for presenting tabs in a window to interface with a user, the method comprising:

generating a thumbnail image for each of the tabs, in a tab bar, based on a snapshot of the window providing an interface for a presentation corresponding to the tab;

displaying an expanded tab bar to replace the tab bar in the window, the expanded tab bar including at least one of the thumbnail images;

displaying, in response to a command received while the expanded tab bar is displayed, snapshot images arranged in a two dimensional grid over an area covering at least a center portion of the window, the snapshot images corresponding to the thumbnail images in the expanded tab bar; and

in response to detecting a user interface action on a particular one of the snapshot images in the two dimensional grid, the particular snapshot image corresponding to a particular one of the presentations, updating the window to provide an interface for the particular presentation.

2. The method of claim 1, wherein generating the thumbnail image comprises:

taking a snapshot of the window providing the interface for the presentation, wherein the thumbnail image includes the snapshot reduced in size.

3. The method of claim 2, wherein the window providing the interface for the presentation is rendered live at time of the snapshot.

4. The method of claim 1, wherein the tab and the thumbnail image for the tab are labeled with a text description of the corresponding presentation.

5. The method of claim 4, wherein the tabs correspond to separate presentations performed by a single application via the window, wherein each presentation corresponds to a separate document opened by the application and wherein the text description indicates a corresponding document opened by the application.

6. The method of claim 1, further comprising:

detecting a dragging operation to expand the tab bar, the dragging operation being associated with an edge of the tab bar.

7. The method of claim 1, wherein the user interface action is a selection operation to select the particular presentation corresponding to the particular thumbnail image.

8. The method of claim 1, wherein the snapshot images are resized from the thumbnail images.

9. The method of claim 1, wherein the displaying of the snapshot images comprises:

morphing the thumbnail images in the expanded tab bar; and

flowing at least one of the thumbnail images from the expanded tab bar into a corresponding snapshot image in the two dimensional grid.

10. The method of claim 9, wherein updating the window comprises:

removing the snapshot images, that are arranged in the two dimensional grid, by animating the snapshot images back to the thumbnail images in the expanded tab bar.

11. The method of claim 1, wherein the tabs are arranged in an order in the tab bar, wherein the snapshot images are arranged in a two dimensional order based on the order in the two dimensional grid, the method further comprises:

moving at least one of the snapshot images among the two dimensional grid to update the two dimensional order; and

reordering the tabs in the tab bar according to the updated two dimensional order.

12. A computer implemented method for presenting tabs in a window on a display screen to interface with a user, the method comprising:

generating snapshot images for the tabs corresponding to separate presentations which use the window, each snapshot image containing content of r a presentation corresponding to a tab on the window;

determining an area covering a center portion of the window on the display screen according to constraints including a minimal visible image size and an available area on the display screen surrounding the window; and

displaying the snapshot images arranged in a two dimensional grid for identifying the separate presentations over the area encompassed by the surrounding area of the window.

13. The method of claim 12, wherein the display of the snapshot images comprises darkening the window and the surrounding area of the window.

14. The method of claim 12, wherein the tabs are ordered in a tab bar according to an order, and wherein the display of the snapshot images comprises configuring the snapshot images in the area according to the order.

15. The method of claim 14, further comprising:

flowing the snapshot images from the tab bar to the area while morphing each tab into a corresponding snapshot image.

16. The method of claim 15, wherein the flowing comprises placing the snapshot images in the area sequentially in a left to right and top to bottom manner following the order of the corresponding tabs in the tab bar.

17. The method of claim 16, further comprising:

in response to detecting a selection operation on a particular snapshot image in the area, updating the window to provide an interface for a particular presentation corresponding to the particular snapshot image selected; and

clearing the snapshot images from the area.

18. The method of claim 16, wherein the clearing comprises:

morphing each snapshot image back to a corresponding tab in the tab bar while lightening up the window and the surrounding area.

19. The method of claim 18, wherein the morphing the snapshot images comprises:

shrinking the snapshot images; and

moving the snapshot image back in the tab bar in a sequence according to the order of the tabs in the tab bar.

20. The method of claim 12, wherein the screen display includes a display resolution and where the minimal visible image size is determined according to the display resolution.

21. The method of claim 12, wherein the constraints include a total number of the tabs in the tab bar.

22. The method of claim 21, wherein the constraints include a maximum snapshot image size and wherein each snapshot image is of the maximum snapshot image size if the window is of a size larger than the maximum snapshot image size times the total number of the tabs in the tab bar.

23. The method of claim 12, further comprising:

detecting a dragging operation to move one of the tabs from a tab bar of the window to a destination location;

determining if the destination location is outside of the tab bar; and

generating a preview window for the tab according to a corresponding presentation using the window, the preview window representing a snapshot of the window providing an interface for the corresponding presentation; and

displaying the preview window at the destination location to indicate a new window for the corresponding presentation.

24. The method of claim 23, further comprising:

displaying the new window at the location, the new window providing an interface for the corresponding presentation; and

updating the window to remove the tab from the tab bar.

25. A machine-readable storage medium having instructions, when executed by a machine, cause the machine to perform a method, the method comprising:

generating a thumbnail image for each of the tabs, in an expanded tab bar, based on a snapshot of the window providing an interface for a presentation corresponding to the tab;

morphing the thumbnail images from the expanded tab bar into snapshot images arranged in a two dimensional grid over an area covering at least a center portion of the window; and

in response to detecting a user interface action on a particular one of the snapshot images in the two dimensional grid, the particular snapshot image corresponding to a particular one of the presentations, updating the window to provide an interface for the particular presentation.

26. A machine-readable storage medium having instructions, when executed by a machine, cause the machine to perform a method, the method comprising:

generating snapshot images for the tabs corresponding to separate presentations which use the window, each snapshot image containing content of a presentation corresponding to a tab on the window;

determining an area covering a center portion of the window on the screen display according to constraints including a minimal visible image size and an available area on the display screen surrounding the window; and

displaying the snapshot images arranged in a two dimensional grid for identifying the separate presentations over the area encompassed by the surrounding area of the window.

27. An apparatus, comprising:

a memory storing executable instructions;

a user interface device having a display screen;

a processor coupled to user interface device and the memory to execute the executable instructions from the memory for switching among a plurality of presentations for a window on the display screen, the processor being configured to;

generate a thumbnail image for each of the tabs, in the tab bar, based on a snapshot of the window providing an interface for a presentation corresponding to the tab;

display an expanded tab bar to replace the tab bar in the window, the expanded tab bar including at least one of the thumbnail images;

morph the thumbnail images from the expanded tab bar into snapshot images arranged in a two dimensional grid over an area covering at least a center portion of the window; and

in response to detecting a user interface action on a particular one of the snapshot images in the two dimensional grid, the particular snapshot image corresponding to a particular one of the presentations, update the window to provide an interface for the particular presentation.