Display Interface Return Animation via Gesture and Screenshot Scaling

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Existing mobile terminal technologies lack a seamless and intuitive method for switching between user interfaces, particularly when the screen occupation ratio is high, making it difficult for users to sense the interface return function effectively.

Innovation Solution

A method that displays a return animation when a sliding operation event meets a preset condition, indicating the transition from a first user interface to an upper-level user interface, by screenshotting the current interface, overlaying it with a background image, and scaling down the screenshot as the user slides, providing a visual cue for interface switching.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Ease of operation

If a touch button is provided at the bottom of the screen to implement interface return function, then the interface return function can be implemented, but the screen occupation ratio decreases and the device layout becomes more complex

Engineering Contradiction:

Improveinterface return functionVSAvoidscreen occupation ratio

Core Design Contradiction:

Ease of operationVSArea of stationary object

Solution Approach 1:

The invention extracts the interface return function from the physical touch button and implements it through a gesture operation on the full screen. The sliding gesture from bottom to top of the screen replaces the need for a dedicated touch button, thereby removing the button from the screen layout and increasing the screen occupation ratio while maintaining the interface return functionality.

Inventive Principle:

Principle #2Taking out (Extraction)

Solution Approach 2:

The invention introduces a return animation as an intermediary visual element that mediates between the sliding gesture and the interface switching. The animation displays a snapshot of the current interface moving from bottom to top, providing visual feedback that connects the user's gesture to the interface transition, making the function more perceivable without requiring a physical button.

Inventive Principle:

Principle #24Intermediary (Mediator)

2Area of stationary object

If the screen occupation ratio is increased to omit the touch button, then more screen area is available, but users find it difficult to sense the interface return function effectively

Engineering Contradiction:

Improvescreen occupation ratioVSAvoidinterface return function perception

Core Design Contradiction:

Area of stationary objectVSDifficulty of detecting and measuring

Solution Approach 1:

The return animation serves as a visual intermediary that makes the invisible interface return function perceivable. When the user slides from bottom to top, the animation displays a snapshot of the current interface moving upward with visual effects, providing clear feedback that the interface return is being triggered, thus solving the problem of users not sensing the function.

Inventive Principle:

Principle #24Intermediary (Mediator)

Solution Approach 2:

The return animation employs visual changes including transparency adjustments, scaling transformations, and positioning changes of the interface snapshot. These visual transformations create a noticeable animation effect that draws user attention and makes the interface return function perceptible without requiring a physical button indicator.

Inventive Principle:

Principle #32Color changes

3Area of stationary object

If a sliding gesture is used to trigger interface return, then the touch button can be omitted and screen occupation ratio increases, but the interface switching process lacks coherence and naturalness

Engineering Contradiction:

Improvescreen occupation ratioVSAvoidinterface switching coherence

Core Design Contradiction:

Area of stationary objectVSEase of operation

Solution Approach 1:

The return animation acts as a visual intermediary that bridges the sliding gesture and interface switching. The animation displays the current interface snapshot moving from bottom to top, mimicking the sliding gesture's direction and providing a visual narrative that connects the user's action to the interface transition, thereby enhancing coherence and naturalness.

Inventive Principle:

Principle #24Intermediary (Mediator)

Solution Approach 2:

The return animation employs smooth scaling and positioning transformations that create a natural, flowing visual effect. The snapshot of the current interface is scaled and positioned continuously during the animation, creating a curved transition path that feels more natural than abrupt interface switching, enhancing the coherence of the interaction.

Inventive Principle:

Principle #14Spheroidality (Curvature)

Data Source

PatentEP3521992B1Method and apparatus for operating a display and storage medium

Publication Date: 2021.10.27 BEIJING XIAOMI MOBILE SOFTWARE CO LTD

Figure 1~2
Figure 3A
Figure 3B

AI summary

The present disclosure relates to a method and an apparatus for operating a display. The method includes receiving (101, 201, 402) a touch operation event on a screen (30, 50) of the display; displaying (102, 407) a return animation when the touch operation event is a sliding operation event satisfying a preset condition, the return animation being configured to indicate that a first user interface (31) currently displayed on the screen (30, 50) has been triggered to return to an upper-level user interface; and displaying (103, 408) a second user interface (35) when the sliding operation event is completed, the second user interface (35) being the upper-level user interface of the first user interface (31).