Rotation smoothing of a user interface

• US 9,298,336 B2
• Filed: 05/28/2009
• Issued: 03/29/2016
• Est. Priority Date: 05/28/2009
• Status: Active Grant

• Current Assignee: Apple Inc.
• Original Assignee: Apple Inc.
• Inventors: Shaffer, Joshua, Ording, Bas
• Primary Examiner(s): Chauhan, Ulka
• Assistant Examiner(s): ZALALEE, SULTANA MARCIA
• Application Number:
  US12/473,846
• Publication Number:
  US 20100302278A1
• Time in Patent Office: 2,497 Days
• Field of Search: None
• US Class Current: 1/1
• CPC Class Codes: G06F 3/0346 with detection of the device orientation or free movement in a 3D space, e.g. 3D mice, 6-DOF [six degrees of freedom] pointers using gyroscopes, accelerometers or tilt-sensors
• 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
• CPC Class Codes: G06F 3/0482 Interaction with lists of selectable items, e.g. menus
• CPC Class Codes: G06F 3/04845 for image manipulation, e.g. dragging, rotation, expansion or change of colour
• CPC Class Codes: G09G 2320/08 Arrangements within a display terminal for setting, manually or automatically, display parameters of the display terminal
• CPC Class Codes: G09G 2340/0492 Change of orientation of the displayed image, e.g. upside-down, mirrored
• CPC Class Codes: G09G 5/38 with means for controlling the display position

Abstract

This is directed to animating transitions in a user interface as the orientation of the user interface changes. An electronic device can display a user interface in any suitable orientation, including for example in portrait and landscape modes (e.g., based on the orientation of the display). To provide a resource efficient and aesthetically pleasing transition, the electronic device can pre-render the interface in the final orientation, and define an animation by cross-fading the interface between the initial and final interfaces. In some embodiments, the electronic device can identify distinct regions of the interface, and define separate animations for each region. The separate animations can be overlaid and displayed simultaneously to provide a uniform animated transition between the initial and final interfaces.

Claims

1. A method, comprising:

at an electronic device with a display;

displaying, on the display, a first interface of an application in a first orientation, the first interface of the application including a first plurality of regions;

while displaying the first interface in the first orientation, receiving an indication of a change in orientation of the display of the electronic device from the first orientation to a second orientation; and

in response to receiving the indication of the change in orientation of the display from the first orientation to the second orientation, transitioning from the first interface of the application in the first orientation to a second interface of the application in a second orientation, the second interface of the application including a second plurality of regions in the second orientation that correspond to the first plurality of regions in the first orientation, wherein the transitioning includes;

displaying rotation of the first interface from the first orientation toward the second orientation;

displaying replacement of the first interface with the second interface, including displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface, wherein a respective region in the second user interface overlaps the corresponding region in the first user interface during the replacement; and

after displaying the replacement of the first interface with the second interface, displaying rotation of the second interface until the second interface is displayed in the second orientation;

wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface occurs at a point in time after the rotation of the first interface has commenced and before the displaying rotation of the second interface has ceased.

2. The method of claim 1, wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface includes cross-fading one or more corresponding regions between the first interface and the second interface.

3. The method of claim 2, wherein the first interface includes a first region with first text and a second region with second text, and the second interface includes a first region that corresponds to the first region of the first interface and a second region that corresponds to the second region of the first interface, and displaying replacement of the regions of the first interface with corresponding regions of the second interface includes:

displaying cross-fading of the first region of the first interface with the first region of the second interface; and

displaying replacement of the second region of the first interface with the second region of the second interface, without displaying cross-fading.

4. The method of claim 1, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is horizontally stretched relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is unstretched relative to the first text in the first region in the first interface.

5. The method of claim 1, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is distorted relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is undistorted relative to the first text in the first region in the first interface.

6. An electronic device, comprising:

a display;

one or more processors;

memory; and

one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, the one or more programs including instructions for;

displaying, on the display, a first interface of an application in a first orientation, the first interface of the application including a first plurality of regions;

while displaying the first interface in the first orientation, receiving an indication of a change in orientation of the display of the electronic device from the first orientation to a second orientation; and

in response to receiving the indication of the change in orientation of the display from the first orientation to the second orientation, transitioning from the first interface of the application in the first orientation to a second interface of the application in a second orientation, the second interface of the application including a second plurality of regions in the second orientation that correspond to the first plurality of regions in the first orientation, wherein the transitioning includes;

displaying rotation of the first interface from the first orientation toward the second orientation;

displaying replacement of the first interface with the second interface, including displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface, wherein a respective region in the second user interface overlaps the corresponding region in the first user interface during the replacement; and

after displaying the replacement of the first interface with the second interface, displaying rotation of the second interface until the second interface is displayed in the second orientation;

wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface occurs at a point in time after the rotation of the first interface has commenced and before the displaying rotation of the second interface has ceased.

7. The device of claim 6, wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface includes cross-fading one or more corresponding regions between the first interface and the second interface.

8. The device of claim 7, wherein the first interface includes a first region with first text and a second region with second text, and the second interface includes a first region that corresponds to the first region of the first interface and a second region that corresponds to the second region of the first interface, and displaying replacement of the regions of the first interface with corresponding regions of the second interface includes:

displaying cross-fading of the first region of the first interface with the first region of the second interface; and

displaying replacement of the second region of the first interface with the second region of the second interface, without displaying cross-fading.

9. The device of claim 6, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is horizontally stretched relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is unstretched relative to the first text in the first region in the first interface.

10. The device of claim 6, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is distorted relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is undistorted relative to the first text in the first region in the first interface.

11. A non-transitory computer readable storage medium storing one or more programs, the one or more programs comprising instructions, which when executed by an electronic device with a display, cause the device to:

display, on the display, a first interface of an application in a first orientation, the first interface of the application including a first plurality of regions;

while displaying the first interface in the first orientation, receive an indication of a change in orientation of the display of the electronic device from the first orientation to a second orientation; and

in response to receiving the indication of the change in orientation of the display from the first orientation to the second orientation, transition from the first interface of the application in the first orientation to a second interface of the application in a second orientation, the second interface of the application including a second plurality of regions in the second orientation that correspond to the first plurality of regions in the first orientation, wherein the transition includes;

displaying replacement of the first interface with the second interface, including displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface, wherein a respective region in the second user interface overlaps the corresponding region in the first user interface during the replacement; and

after displaying the replacement of the first interface with the second interface, displaying rotation of the second interface until the second interface is displayed in the second orientation;

wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface occurs at a point in time after the rotation of the first interface has commenced and before the displaying rotation of the second interface has ceased.

12. The computer readable storage medium of claim 11, wherein displaying replacement of the first plurality of regions of the first interface with the corresponding second plurality of regions of the second interface includes cross-fading one or more corresponding regions between the first interface and the second interface.

13. The computer readable storage medium of claim 12, wherein the first interface includes a first region with first text and a second region with second text, and the second interface includes a first region that corresponds to the first region of the first interface and a second region that corresponds to the second region of the first interface, and displaying replacement of the regions of the first interface with corresponding regions of the second interface includes:

displaying cross-fading of the first region of the first interface with the first region of the second interface; and

displaying replacement of the second region of the first interface with the second region of the second interface, without displaying cross-fading.

14. The computer readable storage medium of claim 11, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is horizontally stretched relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is unstretched relative to the first text in the first region in the first interface.

15. The computer readable storage medium of claim 11, wherein:

the first interface includes a first region with first text and a second region with second text;

the second interface includes a corresponding first region with the first text and a corresponding second region with the second text;

the second text in the corresponding second region in the second interface is distorted relative to the second text in the second region in the first interface; and

the first text in the corresponding first region in the second interface is undistorted relative to the first text in the first region in the first interface.