IP Library › Granted Patent US 10,628,987
Granted Patent B2
US 10,628,987 · App. 16/032,403 · Granted Apr 21, 2020

Condensed transitions of graphical elements presented in graphical user interfaces

Inventors: Eric Charles Henry (San Francisco, CA); Sharon Harris (Brooklyn, NY); Jonas Alon Naimark (San Francisco, CA); Brenton Alexander Simpson (San Francisco, CA); Ke Li (Brooklyn, NY)
Assignee: Google LLC
G06T13/80G06F3/04817G06F9/451
View Patent ↗
Loading inventors, assignments & file history…
Monitor This Case
Get email alerts when status or documents change.
Order Certified Copies
Most orders are placed with the USPTO same day — all within 24 business hours.
Order via The Patent Place →
Pre-filled with this patent's details
Quick Facts
Patent No.
US 10,628,987
App. No.
16/032,403
Granted
Apr 21, 2020
Kind
B2
Abstract

Methods, systems, and apparatus, including computer programs encoded on a computer storage medium, for identifying a graphical user interface including a container having a first child element and a second child element; providing for display the container on the graphical user interface in a first state, the first state including display of the first child element, but not the second child element; applying a transition to the container to effectuate a state change of the container from the first state to a second state, the second state including display of the second child element, but not the first child element, applying the transition including applying a crossfade to the container to graphically fade the first child element to the second child element during application of the transition to the container; and after applying the transition, providing for display the container on the graphical user interface in the second state.

Claims (31)

1. A computer-implemented method, comprising

identifying a graphical user interface including a container having a first child element and a second child element;

providing for display the container on the graphical user interface in a first state, the first state including display of the first child element, but not the second child element;

applying a transition to the container to effectuate a state change of the container from the first state to a second state as the container moves within the graphical user interface, the second state including display of the second child element, but not the first child element, applying the transition including applying a crossfade to the container to graphically fade between the first child element and the second child element as the container moves within the graphical user interface, wherein the transition to the container provides an animation that is visually perceived as a direct transition between the first child element and the second child element independent of an interpolation process that morphs the first child element into the second child element; and

after applying the transition, providing the container for display within the graphical user interface in the second state.

2. The computer-implemented method of claim 1 , wherein applying the crossfade to the container to graphically fade the first child element to the second child element includes adjusting an opacity of the first child element and the second child element.

3. The computer-implemented method of claim 2 , wherein adjusting the opacity of the first child element and the second child element includes decreasing the opacity of the first child element and increasing the opacity of the second child element during application of the crossfade.

4. The computer-implemented method of claim 3 , wherein application of the transition to the container includes maintaining the container in the first state while decreasing the opacity of the first child element.

5. The computer-implemented method of claim 4 , wherein application of the transition to the container includes maintaining the container in the second state while increasing the opacity of the second child element.

6. The computer-implemented method of claim 1 , wherein each child element is represented by a respective frame in the container and wherein applying the transition to the container includes replacing the frame in the container in the first state with the frame in the container in the second state through a change in opacity of the frames.

7. A system comprising:

one or more computers and one or more storage devices storing instructions that are operable, when executed by the one or more computers, to cause the one or more computers to perform operations comprising:

identifying a graphical user interface including a container having a first child element and a second child element;

providing for display the container on the graphical user interface in a first state, the first state including display of the first child element, but not the second child element;

applying a transition to the container to effectuate a state change of the container from the first state to a second state as the container moves within the graphical user interface, the second state including display of the second child element, but not the first child element, the applying the transition including applying a crossfade to the container to graphically fade between the first child element and the second child element as the container moves within the graphical user interface, wherein the transition to the container provides an animation that is visually perceived as a direct transition between the first child element and the second child element independent of an interpolation process that morphs the first child element into the second child element; and

after applying the transition, providing the container for display within the graphical user interface in the second state.

8. The system of claim 7 , wherein applying the crossfade to the container to graphically fade the first child element to the second child element includes adjusting an opacity of the first child element and the second child element.

9. The system of claim 8 , wherein adjusting the opacity of the first child element and the second child element including decreasing the opacity of the first child element and increasing the opacity of the second child element during application of the crossfade.

10. The system of claim 9 , wherein application of the transition to the container includes maintaining the container in the first state while decreasing the opacity of the first child element.

11. The system of claim 10 , wherein application of the transition to the container includes maintaining the container in the second state while increasing the opacity of the second child element.

12. The system of claim 7 , wherein each child element is represented by a respective frame in the container and wherein applying the transition to the container includes replacing the frame in the container in the first state with the frame in the container in the second state through a change in opacity of the frames.

13. A non-transitory computer-readable medium storing software comprising instructions executable by one or more computers which, upon such execution, cause the one or more computers to perform operations comprising:

identifying a graphical user interface including a container having a first child element and a second child element;

providing for display the container on the graphical user interface in a first state, the first state including display of the first child element, but not the second child element;

applying a transition to the container to effectuate a state change of the container from the first state to a second state as the container moves within the graphical user interface, the second state including display of the second child element, but not the first child element, the applying the transition including applying a crossfade to the container to graphically fade between the first child element and the second child element as the container moves within the graphical user interface, wherein the transition to the container provides an animation that is visually perceived as a direct transition between the first child element and the second child element independent of an interpolation process that morphs the first child element into the second child element; and

after applying the transition, providing the container for display within the graphical user interface in the second state.

14. The computer-readable medium of claim 13 , wherein applying the crossfade to the container to graphically fade the first child element to the second child element includes adjusting an opacity of the first child element and the second child element.

15. The computer-readable medium of claim 14 , wherein adjusting the opacity of the first child element and the second child element including decreasing the opacity of the first child element and increasing the opacity of the second child element during application of the crossfade.

16. The computer-readable medium of claim 15 , wherein application of the transition to the container includes maintaining the container in the first state while decreasing the opacity of the first child element.

17. The computer-readable medium of claim 16 , wherein application of the transition to the container includes maintaining the container in the second state while increasing the opacity of the second child element.

18. The computer-readable medium of claim 13 , wherein each child element is represented by a respective frame in the container and wherein applying the transition to the container includes replacing the frame in the container in the first state with the frame in the container in the second state through a change in opacity of the frames.

Assignments (1)
ASSIGNMENT OF ASSIGNOR'S INTEREST Recorded Jul 12, 2018
From: HENRY, ERIC CHARLES; HARRIS, SHARON; NAIMARK, JONAS ALON; SIMPSON, BRENTON ALEXANDER; LI, KE
To: GOOGLE LLC
Reel/Frame 046328/0521 →
Continuity (2)
Provisional Application 62668678 · May 8, 2018
Related Publication 20190347842A1 · Nov 14, 2019