Web Page Object Displacement via Peripheral Convergence Paths
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing web page frameworks fail to effectively place and displace objects on a web page without overlapping with existing elements, lacking a method to visually represent popularity and traffic data in an intuitive manner.
Innovation Solution
An object displacement method that recognizes the display area of web page elements, sets initial positions outside the display area, and moves icons towards target positions within or near content regions, allowing them to converge and represent popularity and traffic data through non-linear paths that avoid overlapping with other elements.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Loss of information
If objects are placed and moved on web pages using conventional frameworks, then object movement can be implemented, but objects overlap with web page elements and the visual representation of popularity data is not intuitive
Solution Approach 1:
The system performs preliminary analysis of web page elements and their display areas before placing objects. It pre-calculates valid placement regions and movement paths that avoid overlapping with web page elements, ensuring objects are positioned and moved only in appropriate areas without interfering with existing content.
Solution Approach 2:
The system introduces a new spatial dimension for object placement by utilizing areas outside the conventional web page display region. Objects are placed in peripheral areas and move along paths that extend beyond the main content area, creating a separate visual layer that represents popularity data without interfering with web page elements.
2Loss of information
If multiple objects are converged on a specific target to represent popularity, then visual attention is attracted, but the web page becomes visually crowded
Solution Approach 1:
The system uses the peripheral area outside the main web page display region as an additional dimension for object convergence. Multiple objects converge on targets located in this peripheral zone, allowing popularity representation to occur in a space that does not compete with the main web page content area, thus avoiding visual crowding.
Solution Approach 2:
The system segments the web page space into a main display area for content and a peripheral area for object representation. By separating these functions into different spatial zones, the system allows popularity visualization through object convergence without interfering with the primary web page content display.
3Loss of information
If objects are placed within the display area to represent traffic data, then data visualization is achieved, but it interferes with the display of web page elements
Solution Approach 1:
The system utilizes the peripheral area outside the conventional web page display boundaries as a separate dimension for traffic data visualization. Objects representing traffic data are placed and moved in this peripheral zone, allowing data visualization to occur without interfering with the reliable display of web page elements in the main content area.
Solution Approach 2:
The system performs preliminary identification of the peripheral area that lies outside web page element display regions. By pre-determining this safe zone for object placement, the system ensures that traffic data visualization through object movement does not conflict with or interfere with the display of web page elements.
Data Source
AI summary
A script (object displacement program) is embedded in a Web page to be transmitted from a Web server 10 and executed by a user terminal 20. The user terminal 20 into which the object displacement program is read displaces a plurality of icons from their initial positions to target positions through a path outside a display area of elements in the Web page, and makes the icons converge on the vicinity of each of the elements in such a way that the icons are distributed to the respective elements in the page in accordance with various access data and statistical data (e.g. the number of page views (PV), click-through rate (CTR), order quantity etc.).