Responsive UI Layout for Aspect Ratio Changes on Resizable Screens

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Existing user interfaces face inefficiencies in utilizing display screen space due to mismatched aspect ratios between content elements and display screens, leading to wasted padding regions and suboptimal user interface arrangements when screen sizes are adjusted.

Innovation Solution

Adapting user interfaces by presenting user interface elements overlaid on padding regions that border content elements, adjusting the location and configuration of content elements to optimize display space utilization as screen sizes change.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Manufacturing precision

If content elements are displayed with their original aspect ratio on display screens with different aspect ratios, then the content element's aspect ratio is preserved, but padding regions are created that waste display space

Engineering Contradiction:

Improveaspect ratio preservationVSAvoiddisplay space utilization

Core Design Contradiction:

Manufacturing precisionVSArea of stationary object

Solution Approach 1:

The patent applies dimensionality change by transitioning from a 2D aspect ratio constraint to a 3D spatial arrangement solution. When aspect ratio mismatch creates padding regions, the system introduces a new dimension by overlaying user interface elements on these padding regions, effectively utilizing the previously wasted space without compromising the content element's aspect ratio preservation.

Inventive Principle:

Principle #17Another dimension (Dimensionality change)

Solution Approach 2:

The patent converts the harmful effect of padding regions (wasted display space) into a beneficial opportunity by overlaying user interface elements on these same padding regions. The aspect ratio mismatch that originally created unusable space now becomes the foundation for enhanced user interface functionality, allowing additional elements to be displayed without interfering with the main content.

Inventive Principle:

Principle #22Blessing in disguise (Convert harm into benefit)

2Area of stationary object

If user interface elements are added to utilize padding regions, then display space utilization is improved, but the user interface arrangement becomes more complex

Engineering Contradiction:

Improvedisplay space utilizationVSAvoiduser interface arrangement

Core Design Contradiction:

Area of stationary objectVSDevice complexity

Solution Approach 1:

The patent applies segmentation by dividing the display screen into distinct functional zones: the main content area that preserves aspect ratio, and the padding regions that are segmented for specific user interface elements. This segmentation allows each zone to serve its primary function independently, simplifying the overall arrangement logic despite the increased functionality.

Inventive Principle:

Principle #1Segmentation

Solution Approach 2:

The patent applies local quality by assigning different functional characteristics to different regions of the display screen. The central content area maintains its aspect ratio preservation quality, while the surrounding padding regions are assigned user interface element display quality. This localized functional differentiation resolves the complexity by creating clear, region-specific rules rather than requiring complex global arrangement logic.

Inventive Principle:

Principle #3Local quality

3Adaptability or versatility

If the display screen physical size is adjusted, then screen adaptability is improved, but the arrangement of user interface elements becomes suboptimal due to aspect ratio mismatches

Engineering Contradiction:

Improvescreen size adaptabilityVSAvoiduser interface arrangement

Core Design Contradiction:

Adaptability or versatilityVSEase of operation

Solution Approach 1:

The patent applies dynamics by creating a responsive user interface arrangement that automatically adapts to changing display screen physical sizes. When the screen size is adjusted, the system dynamically recalculates the padding regions and repositions user interface elements accordingly, ensuring optimal arrangement at each size configuration rather than maintaining a static, suboptimal layout.

Inventive Principle:

Principle #15Dynamics

Solution Approach 2:

The patent implements feedback by continuously monitoring the display screen physical size and aspect ratio relationships, then using this information to automatically adjust user interface element positions. The system detects the screen size change, calculates the resulting padding regions, and responds by optimally arranging user interface elements within these regions, creating a closed-loop adaptive system.

Inventive Principle:

Principle #23Feedback

Data Source

PatentUS12579920B2Adapting a user interface responsive to screen size adjustment

Publication Date: 2026.03.17 QUALCOMM INC

AI summary

In some aspects, a device may present a content element on a display screen that is in a first size configuration, the content element having an aspect ratio. The device may detect adjustment of a physical size of the display screen from the first size configuration having a first display aspect ratio to a second size configuration having a second display aspect ratio different from the first display aspect ratio. The device may present, responsive to adjustment of the physical size of the display screen from the first size configuration to the second size configuration, one or more user interface elements on the display screen in a non-overlapping arrangement with respect to the content element. Numerous other aspects are described.