Section-Based Page Editing for Dynamic Layout Rule Overrides

Resolve Bottlenecks,
Find Innovative Solutions
Generate Solutions

Solution Overview

Problem

Existing visual design systems struggle with efficiently managing dynamic layout adjustments when designers make sweeping changes that break the existing layout, especially when multiple dynamic layout rules are in play, and there is a lack of intuitive tools to override or bypass these rules during editing sessions.

Innovation Solution

Integrating multiple adaptable adjustment handles with dynamic layout rules, allowing designers to selectively activate or ignore specific layout rules through smart handles, which can override or bypass anchors and constraints, enabling seamless editing without disturbing other components.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Stability of the object's composition

If multiple dynamic layout rules are applied to maintain layout integrity, then layout stability is improved, but flexibility to make sweeping layout changes deteriorates

Engineering Contradiction:
Improvelayout stabilityVSAvoidflexibility to make layout changes
Core Design Contradiction:
Stability of the object's compositionVSAdaptability or versatility

Solution Approach 1:

The system dynamically adjusts the application of layout rules based on user actions. When a user initiates a sweeping change (e.g., dragging a component across the page), the system detects this action and temporarily suspends or overrides certain dynamic layout rules to allow the change, then re-applies them afterward. This makes the layout system dynamic in its rule application, adapting to user intent rather than rigidly enforcing all rules at all times.

Inventive Principle:
Principle #15Dynamics

Solution Approach 2:

Different regions or contexts of the layout are treated differently regarding rule application. The system identifies local areas where sweeping changes are occurring and applies a different set of rules (or no rules) in those local regions while maintaining rule enforcement in other stable regions. This allows local flexibility without compromising global layout integrity.

Inventive Principle:
Principle #3Local quality

2Reliability

If dynamic layout rules are enforced to preserve design integrity, then layout consistency is improved, but ease of making significant layout changes deteriorates

Engineering Contradiction:
Improvelayout consistencyVSAvoidease of making layout changes
Core Design Contradiction:
ReliabilityVSEase of operation

Solution Approach 1:

The system performs preliminary detection of user intent before fully enforcing layout rules. When a user begins a dragging operation, the system anticipates a potential sweeping change and prepares to override rules in advance, rather than blocking the action after rule validation fails. This preliminary action makes the operation smoother and more intuitive for users.

Inventive Principle:
Principle #10Preliminary action

Solution Approach 2:

The system introduces an intermediary mechanism (such as a mode switch or contextual handler) that mediates between the user's change-making intent and the layout rules. This intermediary allows users to temporarily bypass rules when needed while maintaining automatic rule enforcement during normal editing, thus easing operation without completely sacrificing consistency.

Inventive Principle:
Principle #24Intermediary (Mediator)

3Extent of automation

If automatic layout adjustment is applied to maintain anchors and constraints, then layout automation is improved, but complexity of manual adjustments when rules need to be overridden deteriorates

Engineering Contradiction:
Improvelayout automationVSAvoidcomplexity of manual adjustments
Core Design Contradiction:
Extent of automationVSDevice complexity

Solution Approach 1:

The system provides self-service by automatically detecting when a user intends to make a sweeping change and autonomously overriding the appropriate rules without requiring user intervention. The system monitors user actions, determines when rule override is needed, executes the override, and then re-applies rules automatically, all without adding complexity to the user interface or requiring manual configuration.

Inventive Principle:
Principle #25Self-service

Data Source

PatentUS12504870B2Method and system for section-based editing of a website page
Publication Date: 2025.12.23 WIX COM
  • US12504870B2 patent drawing
  • US12504870B2 patent drawing
  • US12504870B2 patent drawing

AI summary

A visual design system includes a dynamic layout editor, a page analyzer, a UI subsystem and a change executor. The dynamic layout editor edits content of a visual creation according to dynamic layout rules. The visual creation includes at least one page having at least two components, the dynamic layout rules are associated with anchors or constraints for positioning the components, and each component has geometrical properties. The page analyzer performs a geometrical analysis on the page in response to a change of components and divides the page into sections based on at least geometrical relationships between the geometrical properties. The UI subsystem generates and presents at least one section to a user for editing as a virtual container containing at least one of the two components. The change executor regenerates and displays the page with the section according to editing changes made during the editing session.