Web Page Link Reorganization via Drag and Drop Visual Feedback

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Existing methods for organizing web page elements, such as links, are time-consuming and cumbersome, lacking efficient feedback during reorganization, requiring manual editing and repeated processes to achieve satisfactory results.

Innovation Solution

Implementing drag and drop operations within an edit mode for web pages, where selected elements can be moved with visual feedback, including a 'ghost' image and colored lines, to provide immediate reordering and grouping, allowing for quick reorganization across web pages and between applications.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Ease of operation

If manual editing process is used to reorganize web page elements, then the web page can be edited, but the process is time-consuming and cumbersome

Engineering Contradiction:

Improveease of reorganizing web page elementsVSAvoidtime required for reorganization

Core Design Contradiction:

Ease of operationVSLoss of time

Solution Approach 1:

The patent replaces the manual mechanical editing process with an automated drag-and-drop interface. Users can select elements and drag them to new positions using mouse operations, and the system automatically handles the reorganization logic, including updating links, images, and metadata, eliminating the need for manual code editing and repeated previewing.

Inventive Principle:

Principle #28Mechanics substitution (Replace mechanical system)

Solution Approach 2:

The patent implements real-time visual feedback during the drag-and-drop operation. As users drag elements, a 'ghost' image follows the cursor showing the element's current position. When dropped, a colored horizontal line appears at the target location to indicate where the element will be inserted. This immediate visual feedback allows users to verify changes instantly without manual previewing.

Inventive Principle:

Principle #23Feedback

2Reliability

If manual editing process is used to reorganize web page elements, then changes can be made, but the author must re-open the revised web page to appreciate changes

Engineering Contradiction:

Improveaccuracy of reorganizationVSAvoidtime for feedback verification

Core Design Contradiction:

ReliabilityVSLoss of time

Solution Approach 1:

The patent provides immediate visual feedback during the drag-and-drop operation. The 'ghost' image follows the cursor to show the element's projected position, and a colored horizontal line appears at the drop target to confirm where the element will be inserted. This real-time feedback mechanism allows users to verify reorganization accuracy instantly without re-opening the web page.

Inventive Principle:

Principle #23Feedback

Solution Approach 2:

The patent creates a visual copy of the element being dragged (the 'ghost' image) that follows the cursor and displays the element's projected position. This visual copy allows users to verify the reorganization outcome without actually committing the change yet, enabling instant appreciation of the modification.

Inventive Principle:

Principle #26Copying

3Productivity

If manual editing process is used to reorganize web page elements, then reordering can be achieved, but the process does not provide efficient feedback

Engineering Contradiction:

Improveefficiency of reorganizationVSAvoidease of verifying changes

Core Design Contradiction:

ProductivityVSEase of operation

Solution Approach 1:

The patent implements comprehensive visual feedback throughout the drag-and-drop process. The 'ghost' image provides continuous feedback on the element's movement, while the colored horizontal line at the drop target provides confirmation of the insertion point. This feedback mechanism makes verification as easy as observing the visual indicators, dramatically improving productivity.

Inventive Principle:

Principle #23Feedback

4Productivity

If drag and drop operation is implemented, then reorganization speed increases, but the system complexity increases

Engineering Contradiction:

Improvespeed of reorganizationVSAvoidcomplexity of editing system

Core Design Contradiction:

ProductivityVSDevice complexity

Solution Approach 1:

The patent implements self-service functionality where the system automatically handles all aspects of element reorganization. When users drag elements, the system automatically updates links, repositions images, and reorganizes metadata without requiring manual intervention. This automation increases productivity while managing complexity through intelligent system behavior rather than complex user interfaces.

Inventive Principle:

Principle #25Self-service

Data Source

PatentUS7444597B2Organizing elements on a web page via drag and drop operations

Publication Date: 2008.10.28 MICROSOFT TECHNOLOGY LICENSING LLC

AI summary

Methods, systems and computer-readable media are provided for organizing links on a web page via drag and drop operations. Single web page links or groups of web page links may be dragged from one location on a web page to another location on a web page or to another group of links on the web page. Links may also be dragged from a first web page or first client application document and may be dropped to a second web page on a same or separate web browsing application.