Adaptive User Interface Configuration via Stretching Ratio

Resolve Bottlenecks,
Find Innovative Solutions
Generate Solutions

Solution Overview

Problem

Existing user interface design processes are cumbersome and inefficient due to the need for multiple configurations for different device resolutions, leading to poor operability and complex boundary considerations.

Innovation Solution

A method and system for adaptive user interface configuration, involving a panel with multiple areas, where user interface components are corresponded with areas, stretched, and moved to adapt to user equipment, using a stretching ratio calculated from screen and panel dimensions, allowing components to be placed in adaptive positions based on percentage coordinates.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Adaptability or versatility

If different user interface logics are designed for different resolutions, then the user interface can be adapted to multiple devices, but the design steps become cumbersome and operability deteriorates

Engineering Contradiction:
Improveuser interface adaptation to multiple devicesVSAvoiddesign operability
Core Design Contradiction:
Adaptability or versatilityVSEase of operation

Solution Approach 1:

The patent changes the parameter from discrete resolution-based logic to a continuous stretching ratio parameter. By calculating the stretching ratio based on screen dimensions and applying it uniformly to all UI components, the system achieves multi-device adaptation without requiring separate design logics for different resolutions, thus maintaining design simplicity and operability.

Inventive Principle:
Principle #35Parameter changes

Solution Approach 2:

The patent creates a universal UI configuration method that works across all device resolutions through a single stretching ratio calculation. Instead of creating multiple resolution-specific UI logics, one universal configuration approach handles all devices by dynamically calculating and applying the appropriate stretching ratio, eliminating the need for multiple design paths.

Inventive Principle:
Principle #6Universality (Multi-functionality)

2Adaptability or versatility

If an available area is set first and then different user interface logics are designed for different resolutions, then the user interface can cover various screen sizes, but the design process becomes complex with extensive boundary considerations

Engineering Contradiction:
Improveuser interface coverage of various screen sizesVSAvoiddesign process complexity
Core Design Contradiction:
Adaptability or versatilityVSDevice complexity

Solution Approach 1:

The patent replaces the complex boundary-based design approach with a simple parameter-driven approach. Instead of manually configuring boundaries and creating different logics for different resolution ranges, the system calculates a single stretching ratio parameter that automatically scales the UI to fit any screen size, dramatically reducing design process complexity.

Inventive Principle:
Principle #35Parameter changes

Solution Approach 2:

The system performs self-adaptation by automatically calculating the stretching ratio based on screen dimensions and applying it to UI components. This eliminates the need for manual boundary configuration and complex design decisions, allowing the UI configuration system to adapt itself to different screen sizes without extensive human intervention.

Inventive Principle:
Principle #25Self-service

3Adaptability or versatility

If multiple user interface configurations are created for different devices, then the user interface can be optimized for each device, but the work costs increase significantly

Engineering Contradiction:
Improveuser interface optimization for each deviceVSAvoiddesign work time
Core Design Contradiction:
Adaptability or versatilityVSLoss of time

Solution Approach 1:

The patent reduces design work time by changing from a multi-configuration approach to a single-parameter approach. Instead of creating and maintaining multiple UI configurations for different devices, designers only need to create one base UI configuration, and the system automatically generates device-specific versions by applying the calculated stretching ratio, significantly reducing design and maintenance time.

Inventive Principle:
Principle #35Parameter changes

Solution Approach 2:

The system creates device-specific UI configurations by copying and scaling the base UI configuration using the stretching ratio. Instead of manually designing each UI from scratch for different devices, the system copies the base configuration and applies geometric transformation (scaling), which is much faster and less costly than creating multiple independent configurations.

Inventive Principle:
Principle #26Copying

Data Source

PatentEP3968153B1Adaptive user-interface configuration method, system, and device, and medium
Publication Date: 2024.03.06 LILITH TECH (SHANGHAI) CO LTD
  • EP3968153B1 patent drawingFigure 1A~1B
  • EP3968153B1 patent drawingFigure 1C~1D
  • EP3968153B1 patent drawingFigure 1E~1F

AI summary

The present invention relates to a technical field of user interface display, and in particular to a method, system, and device for adaptive configuration of a user interface, and a medium. The method of the present invention includes: respectively making a correspondence between one or more user interface components and one area of a plurality of areas of a panel; performing a stretching operation on the plurality of areas and the one or more user interface components, and performing a moving operation on the plurality of areas, to generate an adaptive panel and one or more adaptive user interface components adapted to user equipment; and respectively placing the one or more adaptive user interface components in corresponding areas of the adaptive panel to generate an adaptive user interface. The present invention simplifies design steps of user interface, enhances operability, and implements adaptive configuration of the user interface.