GUI page element layout and typesetting optimization method and system based on artificial intelligence

Through the artificial intelligence-based GUI page element layout and typesetting system, natural language processing and context-aware technology are used to automatically complete the layout and typesetting of page elements, solving the problem of fixed design methods in existing technologies and realizing personalized, real-time responsive and efficient user interface design.

CN120671636AActive Publication Date: 2025-09-19SHANGHAI BOUNDARY INTELLIGENT TECH CO LTD

Patent Information

Application Number
CN202510782022.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-06-12
Publication Date
2025-09-19
Estimated Expiration
2045-06-12

AI Technical Summary

Technical Problem

The existing GUI page element layout and typesetting system has a fixed design method, which is difficult to adapt to personalized needs and different device characteristics. Adjustment is complex and error-prone, requires high professionalism, increases implementation difficulty and cost, and leads to poor user experience.

Method used

An artificial intelligence-based GUI page element layout and typesetting method is adopted. Natural language instructions are received through the language user interface, and the natural language processing module is used to analyze user intentions. Combined with the context perception module and the intelligent agent module, the layout and typesetting of page elements are automatically completed, and optimized through an interactive feedback mechanism, and dynamically adjusted to adapt to user needs and resource usage.

Benefits of technology

It realizes personalized display of user interface, improves design efficiency and user experience, can respond to changes in user needs in real time, reduces resource waste, and provides flexible layout and typesetting solutions.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120671636A_ABST
    Figure CN120671636A_ABST
Patent Text Reader

Abstract

The invention relates to the technical field of interface interaction design, in particular to a GUI page element layout and typesetting optimization method and system based on artificial intelligence. The technical problems that a traditional GUI design mode is insufficient in GUI design flexibility, high in dynamic layout technical threshold, high in manual typesetting cost, limited in experience and unreasonable in resource allocation are solved. According to the technical scheme, the GUI page element layout and typesetting optimization system based on artificial intelligence comprises a natural language processing module, a context sensing module, an intelligent agent module, an interactive feedback optimization module and a cross-device adaptability module. Through the natural language processing technology, the user can describe the demand through the natural language, the system automatically identifies the natural language instruction, the layout and typesetting of the page elements are automatically completed by using the large language model and the intelligent agent, the GUI design efficiency is improved, the personalized display of the user interface is realized, and the user experience is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the technical field of interface interaction design, and in particular to a method and system for optimizing GUI page element layout and typesetting based on artificial intelligence. Background Art

[0002] In the Internet age, GUI (Graphical User Interface) has been the mainstream user interface of digital products for decades, whether on PC or mobile devices. The layout and typesetting of page elements are usually pre-defined during the product design and software development process. This makes the existing user interface design lack flexibility and difficult to adapt to the personalized needs of users and the display characteristics of different devices. In addition, designers need to manually adjust the position and size of each element, which is time-consuming and error-prone. To address the limitations of traditional design, some modern web design frameworks and tools have introduced dynamic layout technologies such as CSS. Grid and Flexbox; these technologies allow for more flexible layout adjustments, but still require designers to have professional knowledge and manually write code to implement them; in the traditional software development process, the technical cost of implementing a page where an element or component can be manually dragged and arranged is high, and users may not necessarily have professional page layout and UI design knowledge to manually rearrange the page. In addition, the manual layout process is time-consuming and difficult to achieve an optimal user experience; when designing and generating user interfaces, existing technologies often fail to effectively consider the real-time status of system resources, resulting in waste of resources or an inability to provide a smooth user experience when resources are tight; and a unified user interface and operation functions are not necessary for some users, but can easily cause comprehension barriers and information interruptions; when processing user requests, existing technologies need to strictly follow the established function entry and operation process to complete the request event processing, and after the operation is completed, they need to return to the initial entry according to the established process and cannot directly start the next operation. The operation process is too long and cannot respond to changes in user needs in real time, affecting the user experience. Summary of the Invention

[0003] In order to overcome the problems that the design method of GUI page element layout and typesetting system under existing technology is fixed, difficult to adapt to personalized needs and different device characteristics, adjustment is complex and error-prone, the use of modern layout technology requires high professionalism, increases the difficulty of implementation, manual dragging typesetting technology is expensive, and users usually do not have professional design capabilities, which affects efficiency and experience.

[0004] The technical solution of the present invention is: a GUI page element layout and typesetting optimization method based on artificial intelligence, comprising the following steps:

[0005] S1: The user inputs natural language instructions or query conditions through the language user interface (LUI) to describe the layout and typesetting requirements of page elements;

[0006] S2: The NLP module parses the user's natural language input and extracts key information, including element type, location, and style. It uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand user intent and convert it into recognizable instructions, generating accurate instruction parameters.

[0007] S3: The context-aware module collects user context information, combines user behavior data, device attributes, and other multi-source data, and uses machine learning and a rules engine to predict the user's current usage environment and needs.

[0008] S4: The intelligent agent module selects GUI component elements for typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module;

[0009] S5: Based on the interactive feedback mechanism, users fine-tune the generated interface through the LUI, and the system previews the adjustment effects in real time;

[0010] S6: Utilize dynamic resource management strategies to monitor system resource usage and changes in user needs in real time, and dynamically adjust layout and typesetting based on user feedback and real-time data.

[0011] Preferably, the user inputs natural language instructions or query conditions through the language user interface to describe the layout and typesetting requirements of the page elements; the specific steps are as follows:

[0012] S201: The user opens the system interface including the LUI;

[0013] S202: The system loads and initializes the LUI, preparing to receive user input;

[0014] S203: The user enters a natural language instruction describing the layout and typesetting requirements of the page elements in the LUI through a keyboard or voice input method. The instruction includes a detailed description of the page layout and functional requirements.

[0015] S204: The system pre-processes the original natural language instruction input by the user, including but not limited to removing irrelevant characters, word segmentation, and part-of-speech tagging.

[0016] As a preferred approach, the NLP module parses the user's natural language input, extracts key information, including element type, location, and style, and uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand the user's intent and convert it into recognizable instructions, generating accurate instruction parameters. The specific steps are as follows:

[0017] S301: The NLP module receives natural language text input by a user through a language user interface (LUI);

[0018] S302: Segmenting the text input by the user into independent words or phrases using a rule-based word segmentation algorithm;

[0019] S303: Assign a part-of-speech tag to each word by searching a part-of-speech tagging dictionary and using an HMM statistical model, including noun, verb, and adjective;

[0020] S304: The text after word segmentation and part-of-speech tagging is converted into a computer-understandable format, i.e., word vector, through the embedding layer of the deep learning model BERT;

[0021] S305: Encode the text using the deep learning model BERT and identify the user's intent through the classification layer. The model outputs the probability that the user input belongs to each intent category.

[0022] S306: Based on the identified intent, the specific requirements in the user input are analyzed using a knowledge base and template matching method, including the type, quantity, and layout requirements of page elements.

[0023] S307: Extract key parameters required for layout and typesetting from the analyzed user needs, including element position, size, color, and arrangement;

[0024] S308: Construct specific instruction parameters according to the extracted parameters.

[0025] Preferably, natural language processing technology is used to directly convert the user's natural language description into GUI layout and typesetting instructions, so as to accurately capture and express the user's intention.

[0026] Preferably, the context-aware module collects user context information, combines user behavior data, device attributes and other multi-source data, and uses machine learning and a rule engine to predict the user's current usage environment and needs. The specific steps are as follows:

[0027] S401: Using the API provided by the operating system to obtain device status information, including device type, screen size, and battery level;

[0028] S402: Acquire real-time location, motion status and other information through the device's sensors;

[0029] S403: guiding the user to actively input user preference settings through the user interface;

[0030] S404: Call the corresponding API and sensor interface to obtain the required information data;

[0031] S405: storing the collected context information in a database;

[0032] S406: Clean and format the collected context information, convert the data type and perform unit conversion;

[0033] S407: Combining the user's natural language input, understanding the user's intentions and needs through NLP;

[0034] S408: Extract features from the context information and user intent. For context information, convert the information into numerical and categorical features. For user intent, extract keywords, phrases, and semantic vectors.

[0035] S409: Assigning weights to different context information and user intentions based on preset rules and machine learning models;

[0036] S410: Using a feature splicing fusion strategy to fuse the context information feature and the user intention feature;

[0037] S411: Take features as input and perform feature fusion and information integration through machine learning models;

[0038] S412: Perform rule matching based on the fused features to determine the importance of different contextual information in layout decisions. Use the trained model to predict the fused features and output a layout optimization recommendation and decision that integrates user intent and contextual information.

[0039] S413: Convert the fused features and prediction results into a user request representation, where the user request is represented as a structured data object containing layout parameters, component selection, and typesetting rules.

[0040] Preferably, the intelligent agent module selects GUI component elements for typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module. The specific steps are as follows:

[0041] S501: Receive instruction parameters generated by the NLP module and information provided by the context awareness module;

[0042] S502: Load all available component elements from a predefined GUI component library, including buttons, text boxes, drop-down lists, and picture boxes;

[0043] S503: Classify components according to their functions and uses;

[0044] S504: Mapping user intent and context information to specific GUI component requirements;

[0045] S505: Filtering component elements that match user requirements from the component library;

[0046] S506: Setting initial properties for the selected component based on user input and context information, including text content, color, and size;

[0047] S507: Selecting a grid layout algorithm based on the complexity of the GUI and user preference;

[0048] S508: Generate multiple initial layout solutions using the selected algorithm, each solution including preliminary positions and sizes of components;

[0049] S509: Set layout evaluation criteria, including reasonable spacing between components, page aesthetics, and user interaction convenience;

[0050] S510: Perform a quality assessment on each layout solution and calculate the degree to which it meets the assessment criteria;

[0051] S511: Based on the evaluation results, the layout solution is optimized in an iterative manner. The overall layout effect is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted based on user context information.

[0052] S512: Selecting an optimal solution from the optimized layout solutions as the final layout;

[0053] S513: According to the final layout plan, the selected component elements are automatically laid out on the page at the specified position and size.

[0054] As a preference, based on the interactive feedback mechanism, the user fine-tunes the generated interface through the LUI, and the system previews the adjustment effect in real time; the specific steps are as follows:

[0055] S601: The user inputs an adjustment instruction through the language user interface;

[0056] S602: The NLP module receives the user's natural language input, performs syntax analysis, semantic understanding, and intent recognition, and extracts specific adjustment requirements and target element attributes;

[0057] S603: The NLP module converts the parsed user intent and element attributes into command parameters that can be recognized by the system, including component ID, operation type, target location, and size;

[0058] S604: The intelligent agent module receives the instruction parameters generated by the NLP module and prepares to adjust the interface layout;

[0059] S605: The intelligent agent module calls the corresponding component in the GUI component library according to the instruction parameters and performs actual layout adjustment on the interface, including moving and resizing components, adding new components, and deleting existing components;

[0060] S606: The system renders the interface in real time during the adjustment process and displays it to the user through the GUI, so that the user can immediately see the effect of the adjustment;

[0061] S607: The user observes the real-time preview effect and confirms if satisfied, and the system saves the new layout plan; if not satisfied, the user continues to input new adjustment instructions through the LUI and repeats the above steps until satisfied.

[0062] As a preferred approach, a dynamic resource management strategy is used to monitor system resource usage and user demand changes in real time, and to dynamically adjust layout and typesetting based on user feedback and real-time data. The specific steps are as follows:

[0063] S701: The system monitors the usage of hardware resources and the status of network resources in real time;

[0064] S702: Collect information about current and potential changes in user needs through user behavior data and interaction feedback;

[0065] S703: Based on the system resource usage and changes in user needs, evaluate whether the current resources meet the user needs; if resources are tight, optimize resource allocation, including reducing unnecessary data loading and compressing resource files;

[0066] S704: Based on the resource evaluation results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategies, including reducing layout complexity and optimizing component loading order;

[0067] S705: The system collects user feedback on layout and typesetting in real time, and continuously optimizes the layout and typesetting solutions based on real-time data and resource usage.

[0068] Artificial intelligence-based GUI page element layout and typesetting system, including:

[0069] Language user interface, used to provide a natural language interface for users to interact with the system and receive users' natural language instructions and query conditions;

[0070] The natural language processing module is used to parse the user's natural language input, extract key information, and generate accurate instruction parameters;

[0071] Context-aware module, used to collect user context information to provide auxiliary information for intelligent layout and typesetting;

[0072] Intelligent agent module, which is used to automatically select GUI component elements for typesetting and layout based on the user's natural language input and context information, and optimize existing pages and component elements;

[0073] Interactive feedback optimization module, which provides a feedback mechanism for users to interact with the system, allowing users to fine-tune layout and typesetting through natural language and preview the adjustment effects in real time;

[0074] Large language model fine-tuning training module, used to train and fine-tune the existing large language model in the GUI knowledge domain to improve its performance in GUI layout and typesetting tasks;

[0075] The cross-device adaptability module is used to ensure that the system can automatically adjust the layout and typesetting to adapt to different devices and screen sizes to provide a consistent user experience.

[0076] Preferably, innovative algorithms can automatically analyze and generate optimized page layout solutions based on the user's natural language input and contextual information, understand the user's contextual environment through context perception, and provide personalized layout and typesetting solutions accordingly. Through interactive feedback and optimization mechanisms, users can provide interactive feedback through natural language, and the system can further optimize the layout and typesetting based on this to improve user satisfaction. Through automated cross-device adaptability, the system can automatically adjust the layout and typesetting to adapt to different devices and screen sizes to ensure a consistent user experience. By protecting dynamic resource allocation and management methods, the user experience is guaranteed while optimizing the use of system resources.

[0077] Beneficial effects of the present invention:

[0078] 1. Compared with the existing GUI page element layout and typesetting systems, which have a fixed design method and are difficult to adapt to individual needs and different device characteristics, and are complex and error-prone to adjustment, the use of modern layout technology requires high professionalism, which increases the difficulty of implementation. Manual dragging and typesetting technology is expensive, and users generally do not have professional design capabilities, which affects efficiency and experience. This invention uses natural language processing technology to enable users to describe their needs in natural language. The system automatically recognizes natural language instructions and uses a large language model and intelligent agents to automatically complete the layout and typesetting of page elements, thereby improving GUI design efficiency, realizing personalized display of user interfaces, and enhancing user experience.

[0079] 2. By accurately identifying users' natural language commands and behavior patterns, and generating corresponding command parameters to transmit to the intelligent agent module, it dynamically typesets and generates a personalized user interface, achieving flexible allocation of application resources, flexibly adjusting page typesetting and layout based on the user's current situation, reducing unnecessary resource loading and data acquisition, thereby optimizing system performance and improving user experience. The user interface is highly real-time and responsive, ensuring that users' needs are met immediately and their needs change;

[0080] 3. Through the intelligent proxy module, you can call pre-generated GUI components or new components generated according to natural language instructions to quickly complete page layout or optimize the user interface, while realizing the request and display of back-end data. BRIEF DESCRIPTION OF THE DRAWINGS

[0081] Figure 1 Shown is a schematic diagram of the artificial intelligence-based GUI page element layout and typesetting system architecture of the present invention;

[0082] Figure 2 What is shown is a flowchart of the steps of the artificial intelligence-based GUI page element layout and typesetting optimization method of the present invention. DETAILED DESCRIPTION

[0083] The present invention will be further described below with reference to the accompanying drawings and examples.

[0084] See also Figure 1-2 The present invention provides an embodiment: a GUI page element layout and typesetting optimization method based on artificial intelligence, comprising the following steps:

[0085] S1: The user inputs natural language instructions or query conditions through the language user interface (LUI) to describe the layout and typesetting requirements of page elements;

[0086] S2: The NLP module parses the user's natural language input and extracts key information, including element type, location, and style. It uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand user intent and convert it into recognizable instructions, generating accurate instruction parameters.

[0087] S3: The context-aware module collects user context information, combines user behavior data, device attributes, and other multi-source data, and uses machine learning and a rules engine to predict the user's current usage environment and needs.

[0088] S4: The intelligent agent module selects GUI component elements for typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module;

[0089] S5: Based on the interactive feedback mechanism, users fine-tune the generated interface through the LUI, and the system previews the adjustment effects in real time;

[0090] S6: Utilize dynamic resource management strategies to monitor system resource usage and changes in user needs in real time, and dynamically adjust layout and typesetting based on user feedback and real-time data.

[0091] Preferably, the user inputs natural language instructions or query conditions through the language user interface to describe the layout and typesetting requirements of the page elements; the specific steps are as follows:

[0092] S201: The user opens the system interface including the LUI;

[0093] S202: The system loads and initializes the LUI, preparing to receive user input;

[0094] S203: The user enters a natural language instruction describing the layout and typesetting requirements of the page elements in the LUI through a keyboard or voice input method. The instruction includes a detailed description of the page layout and functional requirements.

[0095] S204: The system pre-processes the original natural language instruction input by the user, including but not limited to removing irrelevant characters, word segmentation, and part-of-speech tagging.

[0096] As a preferred approach, the NLP module parses the user's natural language input, extracts key information, including element type, location, and style, and uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand the user's intent and convert it into recognizable instructions, generating accurate instruction parameters. The specific steps are as follows:

[0097] S301: The NLP module receives natural language text input by a user through a language user interface (LUI);

[0098] S302: Segmenting the text input by the user into independent words or phrases using a rule-based word segmentation algorithm;

[0099] S303: Assign a part-of-speech tag to each word by searching a part-of-speech tagging dictionary and using an HMM statistical model, including noun, verb, and adjective;

[0100] S304: The text after word segmentation and part-of-speech tagging is converted into a computer-understandable format, i.e., word vector, through the embedding layer of the deep learning model BERT;

[0101] S305: Encode the text using the deep learning model BERT and identify the user's intent through the classification layer. The model outputs the probability that the user input belongs to each intent category.

[0102] S306: Based on the identified intent, the specific requirements in the user input are analyzed using a knowledge base and template matching method, including the type, quantity, and layout requirements of page elements.

[0103] S307: Extract key parameters required for layout and typesetting from the analyzed user needs, including element position, size, color, and arrangement;

[0104] S308: Construct specific instruction parameters according to the extracted parameters.

[0105] Preferably, natural language processing technology is used to directly convert the user's natural language description into GUI layout and typesetting instructions, so as to accurately capture and express the user's intention.

[0106] Preferably, the context-aware module collects user context information, combines user behavior data, device attributes and other multi-source data, and uses machine learning and a rule engine to predict the user's current usage environment and needs. The specific steps are as follows:

[0107] S401: Using the API provided by the operating system to obtain device status information, including device type, screen size, and battery level;

[0108] S402: Acquire real-time location, motion status and other information through the device's sensors;

[0109] S403: guiding the user to actively input user preference settings through the user interface;

[0110] S404: Call the corresponding API and sensor interface to obtain the required information data;

[0111] S405: storing the collected context information in a database;

[0112] S406: Clean and format the collected context information, convert the data type and perform unit conversion;

[0113] S407: Combining the user's natural language input, understanding the user's intentions and needs through NLP;

[0114] S408: Extract features from the context information and user intent. For context information, convert the information into numerical and categorical features. For user intent, extract keywords, phrases, and semantic vectors.

[0115] S409: Assigning weights to different context information and user intentions based on preset rules and machine learning models;

[0116] S410: Using a feature splicing fusion strategy to fuse the context information feature and the user intention feature;

[0117] S411: Take features as input and perform feature fusion and information integration through machine learning models;

[0118] S412: Perform rule matching based on the fused features to determine the importance of different contextual information in layout decisions. Use the trained model to predict the fused features and output a layout optimization recommendation and decision that integrates user intent and contextual information.

[0119] S413: Convert the fused features and prediction results into a user request representation, where the user request is represented as a structured data object containing layout parameters, component selection, and typesetting rules.

[0120] Preferably, the intelligent agent module selects GUI component elements for typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module. The specific steps are as follows:

[0121] S501: Receive instruction parameters generated by the NLP module and information provided by the context awareness module;

[0122] S502: Load all available component elements from a predefined GUI component library, including buttons, text boxes, drop-down lists, and picture boxes;

[0123] S503: Classify components according to their functions and uses;

[0124] S504: Mapping user intent and context information to specific GUI component requirements;

[0125] S505: Filtering component elements that match user requirements from the component library;

[0126] S506: Setting initial properties for the selected component based on the user input and context information, including text content, color, and size;

[0127] S507: Selecting a grid layout algorithm based on the complexity of the GUI and user preference;

[0128] S508: Generate multiple initial layout solutions using the selected algorithm, each solution including preliminary positions and sizes of components;

[0129] S509: Set layout evaluation criteria, including reasonable spacing between components, page aesthetics, and user interaction convenience;

[0130] S510: Perform a quality assessment on each layout solution and calculate the degree to which it meets the assessment criteria;

[0131] S511: Based on the evaluation results, the layout solution is optimized in an iterative manner. The overall layout effect is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted based on user context information.

[0132] S512: Selecting an optimal solution from the optimized layout solutions as the final layout;

[0133] S513: According to the final layout plan, the selected component elements are automatically laid out on the page at the specified position and size.

[0134] As a preference, based on the interactive feedback mechanism, the user fine-tunes the generated interface through the LUI, and the system previews the adjustment effect in real time; the specific steps are as follows:

[0135] S601: The user inputs an adjustment instruction through the language user interface;

[0136] S602: The NLP module receives the user's natural language input, performs syntax analysis, semantic understanding, and intent recognition, and extracts specific adjustment requirements and target element attributes;

[0137] S603: The NLP module converts the parsed user intent and element attributes into command parameters that can be recognized by the system, including component ID, operation type, target location, and size;

[0138] S604: The intelligent agent module receives the instruction parameters generated by the NLP module and prepares to adjust the interface layout;

[0139] S605: The intelligent agent module calls the corresponding components in the GUI component library according to the instruction parameters and optimizes the actual layout on the interface, including moving components, adjusting the size, adding new components, and deleting existing components;

[0140] S606: The system renders the interface in real time during the adjustment process and displays it to the user through the LUI, so that the user can immediately see the effect of the adjustment;

[0141] S607: The user observes the real-time preview effect and confirms if satisfied, and the system saves the new layout plan; if not satisfied, the user continues to input new adjustment instructions through the LUI and repeats the above steps until satisfied.

[0142] As a preferred approach, a dynamic resource management strategy is used to monitor system resource usage and user demand changes in real time, and to dynamically adjust layout and typesetting based on user feedback and real-time data. The specific steps are as follows:

[0143] S701: The system monitors the usage of hardware resources and the status of network resources in real time;

[0144] S702: Collect information about current and potential changes in user needs through user behavior data and interaction feedback;

[0145] S703: Based on the system resource usage and changes in user needs, evaluate whether the current resources meet the user needs; if resources are tight, optimize resource allocation, including reducing unnecessary data loading and compressing resource files;

[0146] S704: Based on the resource evaluation results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategies, including reducing layout complexity and optimizing component loading order;

[0147] S705: The system collects user feedback on layout and typesetting in real time, and continuously optimizes the layout and typesetting solutions based on real-time data and resource usage.

[0148] Artificial intelligence-based GUI page element layout and typesetting system, including:

[0149] Language user interface, used to provide a natural language interface for users to interact with the system and receive users' natural language instructions and query conditions;

[0150] The natural language processing module is used to parse the user's natural language input, extract key information, and generate accurate instruction parameters;

[0151] Context-aware module, used to collect user context information to provide auxiliary information for intelligent layout and typesetting;

[0152] Intelligent agent module, which is used to automatically select GUI component elements for typesetting and layout based on the user's natural language input and context information, and optimize existing pages and component elements;

[0153] Interactive feedback optimization module, which provides a feedback mechanism for users to interact with the system, allowing users to fine-tune layout and typesetting through natural language and preview the adjustment effects in real time;

[0154] Large language model fine-tuning training module, used to train and fine-tune the existing large language model in the GUI knowledge domain to improve its performance in GUI layout and typesetting tasks;

[0155] The cross-device adaptability module is used to ensure that the system can automatically adjust the layout and typesetting to adapt to different devices and screen sizes to provide a consistent user experience.

[0156] Preferably, innovative algorithms can automatically analyze and generate optimized page layout solutions based on the user's natural language input and contextual information, understand the user's contextual environment through context perception, and provide personalized layout and typesetting solutions accordingly. Through interactive feedback and optimization mechanisms, users can provide interactive feedback through natural language, and the system can further optimize the layout and typesetting based on this to improve user satisfaction. Through automated cross-device adaptability, the system can automatically adjust the layout and typesetting to adapt to different devices and screen sizes to ensure a consistent user experience. By protecting dynamic resource allocation and management methods, the user experience is guaranteed while optimizing the use of system resources.

[0157] Example 1

[0158] Alternatively, in a customer relationship management (CRM) system, a user needs to quickly build a data dashboard to visually monitor and display the latest customer growth data, follow-up status, and account overviews of important customers. The user hopes that this dashboard can efficiently support their daily work while providing good visual effects and user experience.

[0159] User input requirements: Users enter natural language commands through the CRM system's language user interface (LUI): "I need a dashboard showing the latest customer growth data, the status of the 20 most recently followed-up customers, an overview of the account data of the top ten customers, a navigation menu on the left, and a search box at the top."

[0160] After receiving the user's natural language input, the NLP module performs the following processing:

[0161] Word segmentation: split long sentences into independent words such as "I", "need", "one", "data dashboard", etc.

[0162] Part-of-speech tagging: assign a part of speech to each word, such as "need" is a verb and "data dashboard" is a noun phrase;

[0163] Named Entity Recognition: Identify key entities such as "customer growth data", "customer status", and "account data overview";

[0164] Dependency parsing: understanding sentence structure, identifying subject-verb-object relationships, and determining user intent;

[0165] Convert to instruction parameters: Extract key information about layout and typesetting, such as element type (line chart, data table, panel), position (left navigation, top search box), and style (no specific style requirements, but can be applied according to preset templates);

[0166] The context-aware module collects user behavior data (such as previously visited pages and frequently used functions) and device attributes (screen size, resolution), and other information to predict the user's likely usage environment and preferences;

[0167] The intelligent agent module performs the following operations based on the instruction parameters generated by the NLP module and the information provided by the context awareness module:

[0168] 1. Select appropriate components from the GUI component library: growth trend line chart, customer basic information data table, customer follow-up progress information panel, navigation menu component, and search box component;

[0169] 2. Set the initial properties of the component, such as size, color, etc.;

[0170] 3. Select a suitable layout algorithm and generate an initial layout plan;

[0171] 4. Evaluate and optimize the layout plan to ensure reasonable spacing between components, beautiful pages, and convenient user interaction;

[0172] 5. Finally generate and display the layout plan;

[0173] Users can fine-tune the generated dashboard through the LUI, such as adjusting component positions and changing the displayed data range. The system previews the adjustment results in real time, and users can save the new layout plan after confirming their satisfaction. The system monitors resource usage in real time and dynamically adjusts the layout and typesetting based on user feedback and real-time data. For example, when resources are tight, it can reduce unnecessary data loading and optimize resource allocation.

[0174] The user successfully built a data dashboard that meets their needs, clearly displaying the latest customer growth data, follow-up status, and account overviews of key customers. Through interactive feedback, the user can fine-tune the dashboard according to their needs to ensure that the dashboard not only meets functional requirements but also has a good visual effect and user experience.

[0175] Example 2

[0176] Optionally, assume that on an e-commerce platform, a user wants to quickly query and view the latest order status, including order product information, delivery status, etc. The user wants to input instructions through natural language, and the system automatically generates a page containing the required information. The steps are as follows:

[0177] A1: The user enters a query command. The user enters a natural language query command through the LUI of the e-commerce platform: "Help me check the status of the latest orders."

[0178] A2: NLP module analysis: The NLP module analyzes the user's query and identifies key information: the query target is "latest order status";

[0179] A3: The context-aware module collects the user's recent behavior data (such as previously viewed orders and purchased items) and device attributes to predict the orders the user may want to view.

[0180] A4: The intelligent agent module performs the following operations based on the query intent analyzed by the NLP module and the information provided by the context awareness module:

[0181] Call the order management system API to obtain the latest order data; select a map component (for displaying delivery information) and an order details list component from the GUI component library; fill in the components based on the order data, generate a page containing order product information, a delivery map, and other information, and display it to the user for preview;

[0182] A6: Users can provide feedback on the generated page through the LUI, such as adding or deleting certain display information or adjusting the order of components. The system will preview the adjustment effects in real time and make further optimizations based on user feedback.

[0183] A7: The system monitors resource usage in real time to ensure that displaying large amounts of order information does not cause system lag or resource exhaustion. It dynamically adjusts layout and typesetting strategies based on user feedback and real-time data, such as reducing the number of orders loaded at once and optimizing the order in which data is loaded.

[0184] A8: The user successfully querys the page using natural language and quickly generates a page containing the latest order status. The page displays key information such as product information and a delivery map. The user can fine-tune the page through interactive feedback to ensure that the page meets both information display needs and provides a good user experience.

[0185] The embodiments of the present invention are described in detail above with reference to the accompanying drawings. However, the present invention is not limited to the above embodiments. Various changes can be made within the scope of knowledge of those skilled in the art without departing from the spirit of the present invention.

Claims

1. A method for optimizing GUI page element layout and typesetting based on artificial intelligence; characterized by: The following steps are included: S1: The user inputs natural language instructions or query conditions through the language user interface (LUI); S2: The NLP module parses the user's natural language input, extracts key information, and uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand the user's intent and convert it into recognizable instructions, generating accurate instruction parameters. S3: The context-aware module collects user context information, combines user behavior data, device attributes, and other multi-source data, and uses machine learning and a rules engine to predict the user's current usage environment and needs. S4: The intelligent agent module selects GUI component elements for automatic typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module; S5: Based on the interactive feedback mechanism, users fine-tune the generated interface through the LUI, and the system previews the adjustment effects in real time; S6: Utilize dynamic resource management strategies to monitor system resource usage and changes in user needs in real time, and dynamically adjust layout and typesetting based on user feedback and real-time data.

2. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 1, characterized in that: The user enters natural language instructions or query conditions through the language user interface to describe the layout and typesetting requirements of page elements. The specific steps are as follows: S201: The user opens the system interface including the LUI; S202: The system loads and initializes the LUI, preparing to receive user input; S203: The user enters a natural language instruction describing the layout and typesetting requirements of the page elements in the LUI through a keyboard or voice input method. The instruction includes a detailed description of the page layout and functional requirements. S204: The system pre-processes the original natural language instruction input by the user, including but not limited to removing irrelevant characters, word segmentation, and part-of-speech tagging.

3. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 2, characterized in that: The NLP module parses the user's natural language input and extracts key information, including element type, location, and style. It then uses natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency syntax analysis, to understand the user's intent and convert it into recognizable instructions, generating precise instruction parameters. The specific steps are as follows: S301: The NLP module receives natural language text input by a user through a language user interface (LUI); S302: Segmenting the text input by the user into independent words or phrases using a rule-based word segmentation algorithm; S303: Assign a part-of-speech tag to each word by searching a part-of-speech tagging dictionary and using an HMM statistical model, including noun, verb, and adjective; S304: The text after word segmentation and part-of-speech tagging is converted into a computer-understandable format, i.e., word vector, through the embedding layer of the deep learning model BERT; S305: Encode the text using the deep learning model BERT and identify the user's intent through the classification layer. The model outputs the probability that the user input belongs to each intent category. S306: Based on the identified intent, the specific requirements in the user input are analyzed by combining the knowledge base and template matching method, including the type, quantity, and layout requirements of the page elements; S307: Extract key parameters required for layout and typesetting from the analyzed user needs, including element position, size, color, and arrangement; S308: Construct specific instruction parameters according to the extracted parameters.

4. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 3, characterized in that: The context-aware module collects user context information, combines it with multiple sources of data, such as user behavior data and device attributes, and uses machine learning and a rules engine to predict the user's current usage environment and needs. The specific steps are as follows: S401: Using the API provided by the operating system to obtain device status information, including device type, screen size, etc.; S402: Acquire real-time location, motion status and other information through the device's sensors; S403: Obtain user historical data to determine user preferences, recent layout requirements, and other information; S404: Call the corresponding API and sensor interface to obtain the required information data; S405: storing the collected context information in a database; S406: Clean and format the collected context information, convert the data type and perform unit conversion; S407: Combining the user's natural language input, understanding the user's intentions and needs through NLP; S408: Extracting features from context information and user intent representation; For contextual information, convert the information into numerical and categorical features; For user intent, extract keywords, phrases and semantic vectors; S409: Assigning weights to different context information and user intentions based on preset rules and machine learning models; S410: Using a feature splicing fusion strategy to fuse the context information feature and the user intention feature; S411: Take features as input and perform feature fusion and information integration through machine learning models; S412: Perform rule matching based on the fused features to determine the importance of different contextual information in layout decisions. Use the trained model to predict the fused features and output a layout optimization recommendation and decision that integrates user intent and contextual information. S413: Convert the fused features and prediction results into a user request representation, where the user request is represented as a structured data object containing layout parameters, component selection, and typesetting rules.

5. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 4, characterized in that: The intelligent agent module selects GUI component elements for typesetting and layout, or optimizes existing pages and component elements based on the instruction parameters generated by the NLP module and the information provided by the context awareness module. The specific steps are as follows: S501: Receive instruction parameters generated by the NLP module and information provided by the context awareness module; S502: Load all available component elements from a predefined GUI component library, including buttons, text boxes, drop-down lists, and picture boxes; S503: Classify components according to their functions and uses; S504: Mapping user intent and context information to specific GUI component requirements; S505: Filtering component elements that match user requirements from the component library; S506: Setting initial properties for the selected component based on user input and context information, including text content, color, and size; S507: Selecting a grid layout algorithm based on the complexity of the GUI and user preference; S508: Generate multiple initial layout solutions using the selected algorithm, each solution including preliminary positions and sizes of components; S509: Set layout evaluation criteria, including reasonable spacing between components, page aesthetics, and user interaction convenience; S510: Perform a quality assessment on each layout solution and calculate the degree to which it meets the assessment criteria; S511: Based on the evaluation results, the layout solution is optimized in an iterative manner. The overall layout effect is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted based on user context information. S512: Selecting an optimal solution from the optimized layout solutions as the final layout; S513: According to the final layout plan, the selected component elements are automatically laid out on the page at the specified position and size.

6. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 5, characterized in that: Based on the interactive feedback mechanism, users can fine-tune the generated interface through the LUI, and the system will preview the adjustment effect in real time. The specific steps are as follows: S601: The user inputs an adjustment instruction through the language user interface; S602: The NLP module receives the user's natural language input, performs syntax analysis, semantic understanding, and intent recognition, and extracts specific adjustment requirements and target element attributes; S603: The NLP module converts the parsed user intent and element attributes into command parameters that can be recognized by the system, including component ID, operation type, target location, and size; S604: The intelligent agent module receives the instruction parameters generated by the NLP module and prepares to adjust the interface layout; S605: The intelligent agent module performs real-time adjustment and optimization of the actual layout on the interface according to the instruction parameters, including moving components, adjusting sizes, adding new components, and deleting existing components; S606: The system renders the interface in real time during the adjustment process and displays it to the user through the GUI, so that the user can immediately see the effect of the adjustment; S607: The user observes the real-time preview effect and confirms if satisfied, and the system saves the new layout plan; if not satisfied, the user continues to input new adjustment instructions through the LUI and repeats the above steps until satisfied.

7. The artificial intelligence-based GUI page element layout and typesetting optimization method according to claim 6, characterized in that: Utilize dynamic resource management strategies to monitor system resource usage and user demand changes in real time, and dynamically adjust layout and typesetting based on user feedback and real-time data. The specific steps are as follows: S701: The system monitors the usage of hardware resources and the status of network resources in real time; S702: Collect information about current and potential changes in user needs through user behavior data and interaction feedback; S703: Based on the system resource usage and changes in user needs, evaluate whether the current resources meet the user needs; if resources are tight, optimize resource allocation, including reducing unnecessary data loading and compressing resource files; S704: Based on the resource evaluation results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategies, including reducing layout complexity and optimizing component loading order; S705: The system collects user feedback on layout and typesetting in real time, and continuously optimizes the layout and typesetting solutions based on real-time data and resource usage.

8. An artificial intelligence-based GUI page element layout and typesetting system, characterized by: Includes: Language user interface, used to provide a natural language interface for users to interact with the system and receive users' natural language instructions and query conditions; The natural language processing module is used to parse the user's natural language input, extract key information, and generate accurate instruction parameters; The context-aware module is used to collect user context information and provide auxiliary information for intelligent layout and typesetting.

9. The artificial intelligence-based GUI page element layout and typesetting system according to claim 8, characterized in that: Also included are: Intelligent agent module, which is used to automatically select GUI component elements for typesetting and layout based on the user's natural language input and context information, and optimize existing pages and component elements; The interactive feedback optimization module is used to provide a feedback mechanism for users to interact with the system, allowing users to fine-tune the layout and typesetting through natural language and preview the adjustment effects in real time.

10. The artificial intelligence-based GUI page element layout and typesetting system according to claim 9, characterized in that: Also included are: Large language model fine-tuning training module, used to train and fine-tune the existing large language model in the GUI knowledge domain to improve its performance in GUI layout and typesetting tasks; The cross-device adaptability module is used to ensure that the system can automatically adjust the layout and typesetting to adapt to different devices and screen sizes to provide a consistent user experience.

Citation Information

Patent Citations

  • Interactive interface generation method and device, electronic equipment and vehicle

    CN119149025A

  • LUI and GUI method and system based on emotion module

    CN119441439A

  • Methods and apparatuses involving automated task completion for website refinement / customization

    WO2025054324A2

Cited By

  • Interface layout recommendation method for intelligent equipment

    CN120973456A

  • Agent-driven PPT layout generation method and system based on feedback optimization and medium

    CN121072465A

  • Work display adaptive typesetting method and system based on big data

    CN121745076A