Pinning a callout animation

• US 9,489,761 B2
• Filed: 04/23/2015
• Issued: 11/08/2016
• Est. Priority Date: 10/17/2011
• Status: Active Grant

• Current Assignee: Microsoft Technology Licensing LLC (Microsoft Corporation)
• Original Assignee: Microsoft Technology Licensing LLC (Microsoft Corporation)
• Inventors: Edwards, Christopher D., Konzelmann, Jaclyn E., Elias, Galen M., Mahaffey, Terry J.
• Primary Examiner(s): HAJNIK, DANIEL F
• Application Number:
  US14/694,661
• Publication Number:
  US 20150228104A1
• Time in Patent Office: 565 Days
• Field of Search: None
• US Class Current: 1/1
• 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
• CPC Class Codes: G06F 3/04842 Selection of displayed objects or displayed text elements G06F3/0482 takes precedence
• CPC Class Codes: G06F 3/04845 for image manipulation, e.g. dragging, rotation, expansion or change of colour
• CPC Class Codes: G06F 3/04847 Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
• CPC Class Codes: G06F 40/166 Editing, e.g. inserting or deleting
• CPC Class Codes: G06T 13/00 Animation
• CPC Class Codes: G06T 13/80 2D [Two Dimensional] animation, e.g. using sprites
• CPC Class Codes: G06T 2200/24 involving graphical user interfaces [GUIs]

Abstract

Animation for the attachment of content items to a location on a content surface in a user interface is provided. A user interface showing a content surface may be displayed on a computer. The content surface may include a content item at an initial position above the content surface. The content surface may display content formatted for display over an area comprising a totality of the content surface. The computer may then receive in the user interface a request to attach the content item to a final position on the content surface. The computer may then display an animation of the content item moving, from the initial position, across the content surface until the final position has been reached. The computer may then attach the content item to the content surface at the final position.

Claims

1. A computer system for animating pinning of callouts to a content surface in an application, comprising:

a memory for storing executable program code; and

a processor, functionally coupled to the memory, the processor being responsive to computer-executable instructions contained in the program code and operative to;

display content on the content surface in a first user interface window of the application;

receive a first callout selection in the application;

in response to the first callout selection, display a first callout in a second user interface window that is separate from and floats above the first user interface window;

receive a first pin selection of the first callout in the application;

in response to the first pin selection, pin the first callout to the content surface in the first user interface window of the application, wherein pinning the first callout comprises;

animating movement of the second user interface window across the first user interface window from a first location above the content surface of the first user interface window to a first pin location within the content surface of the first user interface window;

animating a size adjustment of the content on the content surface in the first user interface window as the second user interface window moves across and above the content surface of the first user interface window to adjust for a size of the first callout as pinned in the content surface to form a size adjusted content; and

removing the second user interface window and a frame of the second user interface window to integrate all of the first callout into the content surface of the first user interface window; and

displaying a pinned first callout and the size adjusted content on the content surface of the first user interface window.

2. The system of claim 1, wherein pinning the first callout further comprises:

animating a fade-out of the second user interface window after the second user interface window reaches the first pin location; and

animating a fade-in of the first callout as pinned within the content surface after the second user interface window reaches the first pin location.

3. The system of claim 1, wherein the first callout selection is received from a selection of an item on the first user interface window.

4. The system of claim 1, wherein the first pin selection is received from a selection of an item on the second user interface window.

5. The system of claim 1, wherein the processor is further operative to:

after the first callout is pinned to the content surface, receive a second callout selection in the application;

display, in response to the second callout selection, a second callout in a third user interface window that is separate from and floats above the first user interface window;

receive a second pin selection of the second callout in the application;

in response to the second pin selection, pin the second callout to the content surface in the first user interface window of the application, wherein pinning the second callout comprises;

animating movement of the third user interface window across and above the first user interface window from a second location to a second pin location within the content surface of the first user interface window;

animating a first resizing of the first callout on the content surface in the first user interface window as the second user interface window moves across and above the content surface of the first user interface window to adjust for a size of the second callout as pinned in the content surface, wherein the content in the content surface is not resized again in response to the second pin selection;

displaying a resized first pinned callout, a pinned second callout, and the size adjusted content on the content surface of the first user interface window.

6. The system of claim 5, wherein the first pin selection is received from a selection of an item on the third user interface window.

7. The system of claim 5, wherein the processor is further operative to:

after the second callout is pinned to the content surface, receive a third callout selection in the application;

display, in response to the third callout selection, a third callout in a fourth user interface window that is separate from and floats above the first user interface window;

receive a third pin selection of the third callout in the application;

in response to the third pin selection, pin the third callout to the content surface in the first user interface window of the application, wherein pinning the third callout comprises;

animating movement of the fourth user interface window across and above the first user interface window from a third location to a third pin location within the content surface of the first user interface window;

animating a second resizing of the first callout and a first resizing of the second callout on the content surface in the first user interface window as the third user interface window moves across and above the content surface of the first user interface window to adjust for a size of the third callout as pinned in the content surface, wherein the content in the content surface is not resized again in response to the third pin selection;

displaying a second resized first pinned callout, a first resized pinned second callout, the third callout, and the size adjusted content on the content surface of the first user interface window.

8. The system of claim 5, wherein the first callout and the second callout comprise items selected from at least one of a tasks list, a contacts list, or a calendar.

9. A computer system for animating pinning of callouts to a location on a content surface in a user interface, comprising:

a memory for storing executable program code; and

a processor, functionally coupled to the memory, the processor being responsive to computer-executable instructions contained in the program code and operative to;

receive in the user interface, a selection of a callout from the content surface;

display in the user interface, the callout at an initial position in response to the selection, the initial position comprising the callout floating above pre-existing content displayed in the content surface in the user interface, the callout comprising a rectangular-shaped representation, a portion of the callout comprising a selectable icon near the rectangular-shaped representation in the callout, the selectable icon not comprising the rectangular-shaped representation;

receive in the user interface, a request to pin the callout to a final position on the content surface, the request comprising an input on the selectable icon;

in response to receiving the input on the selectable icon, display in the user interface, an animation of the callout moving, from the initial position, across the content surface until the final position has been reached, the selectable icon being removed from the callout during the animation of the callout moving from the initial position across the content surface; and

after the selectable icon has been removed, pin in the user interface, the callout to the content surface at the final position to integrate the callout with the pre-existing content displayed in the content surface by removing a frame of the rectangular-shaped representation.

10. The system of claim 9, wherein the processor, in pinning the callout to the content surface at the final position is operative to display a cross-fade animation showing a transition of the callout from a position above the content surface at the final position to a docked state within the content surface at the final position.

11. The system of claim 10, wherein the processor is further to:

receive in the user interface, a request to pin at least one additional callout to the final position on the content surface;

display in the user interface, an animation of the at least one additional callout moving across the content surface until the final position has been reached; and

pin in the user interface, the at least one additional callout to the content surface at the final position.

12. The system of claim 11, wherein the processor, in pining in the user interface, the at least one additional callout to the content surface at the final position, is operative to resize a docked callout to make space for the at least one additional callout at the final position.

13. The system of claim 11, wherein the callout and the at least one additional callout comprise items of content selected from a group comprising at least a tasks list, a contacts list and a calendar.

14. A computer-implemented method for animating an attachment of content items to a location on a content surface in a user interface, comprising:

displaying in the user interface, by a computer, a content item at an initial position, the initial position comprising the content item floating above pre-existing content displayed in the content surface in the user interface, the content item comprising a rectangular-shaped representation, a portion of the content item comprising a selectable icon near the rectangular-shaped representation in the content item, the selectable icon not comprising the rectangular-shaped representation;

receiving in the user interface, by the computer, a request to attach the content item to a final position on the content surface, the request comprising an input on the selectable icon;

in response to receiving the input on the selectable icon, displaying in the user interface, by the computer, an animation of the content item moving from the initial position, across the content surface to the final position, the selectable icon being removed during the animation;

after the selectable icon has been removed, attaching in the user interface, by the computer, the content item to the content surface at the final position, the content item being integrated with the content surface at the final position by removing a frame of the rectangular-shaped representation.

15. The method of claim 14, wherein displaying in the user interface, by the computer, the animation of the content item moving, from the initial position, across the content surface to the final position comprises resizing content in the content surface to make space for the content item at the final position.

16. The method of claim 15, wherein resizing the content in the content surface to make space for the content item at the final position comprises resizing the content as the content item moves across the content surface towards the final position.

17. The method of claim 14, wherein attaching in the user interface, by the computer, the content item to the content surface at the final position from the initial position comprises:

displaying a cross-fade animation showing a transition of the content item floating above the final position on the content surface to a docked state within the content surface at the final position.

18. The method of claim 14, further comprising:

receiving in the user interface, by the computer, a request to attach another content item to the final position on the content surface;

in response to receiving the request to attach the another content item, displaying in the user interface, by the computer, an animation of the another content item moving across the content surface until the final position has been reached; and

attaching in the user interface, by the computer, the another content to the content surface at the final position.

19. The method of claim 18, wherein attaching in the user interface, by the computer, the another content item to the content surface at the final position comprises:

resizing a docked content item to make space for the another content item at the final position.

20. The method of claim 18, wherein the content item and the another content item comprise content selected from at least one of a tasks list, a contacts list, or a calendar.