Adaptive User Interface Configuration via Stretching Ratio
Find Innovative SolutionsGenerate 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
Engineering 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
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.
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.
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
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.
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.
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
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.
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.
Data Source
Figure 1A~1B
Figure 1C~1D
Figure 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.