Artificial intelligence-based gui page element layout and typesetting optimization method and system

Abstract

The application relates to the technical field of interface interaction design, in particular to a GUI page element layout and layout optimization method and system based on artificial intelligence; a technical problem is that traditional GUI design methods have insufficient GUI design flexibility, high dynamic layout technical threshold, high manual layout cost, limited experience and unreasonable resource allocation; a technical scheme is that the GUI page element layout and layout optimization method and system based on artificial intelligence comprise a natural language processing module, a context perception module, an intelligent agent module, an interactive feedback optimization module, an interactive feedback optimization module and a cross-device adaptability module; the application enables a user to describe requirements through natural language by means of a natural language processing technology; the system automatically identifies natural language instructions; a large language model and an intelligent agent are utilized to automatically complete page element layout and layout, improve GUI design efficiency, realize user interface personalized display and improve user experience.

Description

Technical Field

[0001] This invention relates to the field of interface interaction design technology, and in particular to a method and system for optimizing the layout and typesetting of GUI page elements based on artificial intelligence. Background Technology

[0002] In the internet age, whether on PCs or mobile devices, GUI (Graphical User Interface) has been the mainstream user interface for digital products for decades. The layout and typography of page elements are usually predefined during product design and software development. This results in a lack of flexibility in existing user interface design methods, making it difficult to adapt to users' personalized needs and the display characteristics of different devices. In addition, designers need to manually adjust the position and size of each element, a process that is both time-consuming and error-prone. To overcome the limitations of traditional design, some modern web design frameworks and tools have introduced dynamic layout technologies, such as CSS. Grid and Flexbox technologies allow for more flexible layout adjustments, but still require designers to possess specialized knowledge and manually write code to implement them. In traditional software development, implementing a page where elements or components can be manually dragged and rearranged is costly. Furthermore, users may not possess the professional knowledge of page layout and UI design to manually rearrange the page. In addition, manual layout is time-consuming and struggles 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, leading to resource waste or an inability to provide a smooth user experience when resources are scarce. A unified user interface and operational functions are not essential for some users and can easily cause comprehension difficulties and information overload. When processing user requests, existing technologies require strict adherence to predetermined functional entry points and operational flows to complete request event processing. After the operation is completed, the user must return to the initial entry point according to the predetermined flow, preventing direct initiation of the next operation. This excessively long operation flow and inability to respond to changes in user needs in real time negatively impact the user experience. Summary of the Invention

[0003] To overcome the limitations of existing GUI page element layout systems, which are characterized by fixed design methods, difficulty in adapting to personalized needs and different device characteristics, complex and error-prone adjustments, and the high professional requirements and implementation difficulty of modern layout technologies, as well as the high cost of manual drag-and-drop layout technology, which often affects efficiency and user experience due to users' lack of professional design capabilities, we must address these issues.

[0004] The technical solution of this invention is: a method for optimizing the layout and typesetting of GUI page elements based on artificial intelligence, comprising the following steps:

[0005] S1: Users input natural language commands or query conditions through the Language User Interface (LUI) to describe the layout and typography requirements of page elements;

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

[0007] S3: The context-aware module collects user context information and combines it with user behavior data, device attributes, and other multi-source data to predict the user's current usage environment and needs through machine learning and rule engines;

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

[0009] S5: Based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect 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 arrangement based on user feedback and real-time data.

[0011] Preferably, users can input natural language commands or search criteria through the language user interface to describe their layout and typography requirements for page elements; the specific steps are as follows:

[0012] S201: The user opens a system interface containing LUI;

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

[0014] S203: Users input natural language commands in LUI via keyboard or voice input to describe page element layout and typography requirements. The commands include detailed descriptions of page layout and functional requirements.

[0015] S204: The system preprocesses the user's raw natural language commands, 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, position, and style, and employs natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency parsing, to understand the user's intent and transform it into recognizable instructions, generating precise instruction parameters. The specific steps are as follows:

[0017] S301: The NLP module receives natural language text input by the user through the Language User Interface (LUI);

[0018] S302: Use a rule-based word segmentation algorithm to segment the user-input text into individual words or phrases;

[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 nouns, verbs, and adjectives;

[0020] S304: The embedding layer of the deep learning model BERT converts the segmented and part-of-speech-tagged text into a computer-understandable format, namely word vectors.

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

[0022] S306: Based on the identified intent, analyze the specific needs in the user input using a knowledge base and template matching methods, including the type, quantity, and layout requirements of page elements;

[0023] S307: Extract the key parameters required for layout and typesetting from the parsed user requirements, including element position, size, color, and arrangement.

[0024] S308: Construct specific instruction parameters based on the extracted parameters.

[0025] Preferably, natural language processing technology is used to directly convert the user's natural language description into instructions for GUI layout and typesetting, thereby accurately capturing and expressing the user's intent.

[0026] As a preferred approach, the context-aware module collects user context information and combines it with multi-source data such as user behavior data and device attributes to predict the user's current usage environment and needs through machine learning and a rule engine; the specific steps are as follows:

[0027] S401: Use 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: Guide users 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: Store the collected context information in the database;

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

[0033] S407: Combines the user's natural language input with NLP to understand the user's intent and needs;

[0034] S408: Extract features from contextual 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.

[0035] S409: Assign weights to different contextual information and user intents based on preset rules and machine learning models;

[0036] S410: Use a feature concatenation fusion strategy to fuse contextual information features and user intent features;

[0037] S411: Take features as input and integrate them 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 the layout decision; use the trained model to predict the fused features and output a layout optimization suggestion and decision that integrates user intent and contextual information;

[0039] S413: Transform the fused features and prediction results into a user request representation, which is a structured data object containing layout parameters, component selection, and typography rules.

[0040] As a preferred approach, the intelligent agent module selects GUI component elements for layout and arrangement based on the instruction parameters generated by the NLP module and the information provided by the context-aware module, or optimizes existing pages and component elements; the specific steps are as follows:

[0041] S501: Receives instruction parameters generated by the NLP module and information provided by the context-aware module;

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

[0043] S503: Classify components according to their function and purpose;

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

[0045] S505: Select component elements from the component library that match the user's needs;

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

[0047] S507: Select the grid layout algorithm based on the complexity of the GUI and user preferences;

[0048] S508: Generate multiple initial layout schemes using the selected algorithm, each scheme containing the initial positions and sizes of the components;

[0049] S509: Set layout evaluation criteria, including the rationality of spacing between components, page aesthetics, and ease of user interaction;

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

[0051] S511: Based on the evaluation results, the layout scheme is optimized iteratively, the overall effect of the layout is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted in combination with user context information;

[0052] S512: Select the optimal layout from the optimized layout schemes as the final layout;

[0053] S513: Based on the final layout scheme, automatically arrange the selected component elements on the page according to the specified position and size.

[0054] As a preferred approach, based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect in real time; the specific steps are as follows:

[0055] S601: Users input adjustment commands through the language user interface;

[0056] S602: The NLP module receives the user's natural language input, performs syntactic 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 system-recognizable instruction parameters, including component ID, operation type, target location, and size;

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

[0059] S605: The intelligent agent module calls the corresponding components in the GUI component library according to the instruction parameters and performs actual layout adjustments on the interface, including moving components, resizing, 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, allowing the user to see the effect of the adjustment immediately;

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

[0062] As a preferred approach, a dynamic resource management strategy is employed to monitor system resource usage and changes in user needs in real time, and to dynamically adjust the layout and arrangement 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 on current and potential changes in user needs through user behavior data and interaction feedback;

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

[0066] S704: Based on resource assessment results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategy, 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 layout and typesetting schemes by combining real-time data and resource usage.

[0068] An AI-based GUI page element layout and typesetting system includes:

[0069] The language user interface is used to provide a natural language interface for users to interact with the system, and to receive natural language commands and query conditions from users.

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

[0071] The context-aware module is used to collect user context information to provide auxiliary information for intelligent layout and typesetting.

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

[0073] The interactive feedback optimization module provides a feedback mechanism for users to interact with the system, allowing users to fine-tune the layout and typography using natural language and preview the adjustment effect in real time;

[0074] The Large Language Model Fine-tuning Training Module is used to train and fine-tune existing large language models in the GUI knowledge domain, thereby improving their performance in GUI layout and typesetting tasks.

[0075] The cross-device adaptability module ensures that the system can automatically adjust the layout and typography to adapt to different devices and screen sizes, providing a consistent user experience.

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

[0077] The beneficial effects of this invention are:

[0078] 1. Compared to existing GUI page element layout and typesetting systems, which have fixed design methods, are difficult to adapt to personalized needs and different device characteristics, are complex to adjust and prone to errors, and require high professional expertise to use modern layout technology, increasing implementation difficulty, manual drag-and-drop typesetting technology is costly, and users usually do not have professional design capabilities, affecting efficiency and experience; this invention uses natural language processing technology to enable users to describe their needs through natural language, the system automatically recognizes natural language commands, and uses large language models and intelligent agents to automatically complete the layout and typesetting of page elements, improving GUI design efficiency, realizing personalized display of user interface 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, the application resources are dynamically arranged and personalized user interfaces are generated. This enables flexible allocation of application resources, flexibly adjusting page layout and arrangement according to 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' immediate needs are met and changes in needs are addressed.

[0080] 3. The intelligent proxy module can call pre-generated GUI components or new components generated based on natural language instructions to quickly complete page layout or optimize the user interface, while also requesting and displaying backend data. Attached Figure Description

[0081] Figure 1 The diagram shows the architecture of the AI-based GUI page element layout and typesetting system of the present invention.

[0082] Figure 2 The diagram illustrates the steps of the AI-based GUI page element layout and typesetting optimization method of the present invention. Detailed Implementation

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

[0084] Please see Figure 1-2 This invention provides an embodiment of an artificial intelligence-based GUI page element layout and typesetting optimization method, comprising the following steps:

[0085] S1: Users input natural language commands or query conditions through the Language User Interface (LUI) to describe the layout and typography requirements of page elements;

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

[0087] S3: The context-aware module collects user context information and combines it with user behavior data, device attributes, and other multi-source data to predict the user's current usage environment and needs through machine learning and rule engines;

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

[0089] S5: Based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect 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 arrangement based on user feedback and real-time data.

[0091] Preferably, users can input natural language commands or search criteria through the language user interface to describe their layout and typography requirements for page elements; the specific steps are as follows:

[0092] S201: The user opens a system interface containing LUI;

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

[0094] S203: Users input natural language commands in LUI via keyboard or voice input to describe page element layout and typography requirements. The commands include detailed descriptions of page layout and functional requirements.

[0095] S204: The system preprocesses the user's raw natural language commands, 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, position, and style, and employs natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency parsing, to understand the user's intent and transform it into recognizable instructions, generating precise instruction parameters. The specific steps are as follows:

[0097] S301: The NLP module receives natural language text input by the user through the Language User Interface (LUI);

[0098] S302: Use a rule-based word segmentation algorithm to segment the user-input text into individual words or phrases;

[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 nouns, verbs, and adjectives;

[0100] S304: The embedding layer of the deep learning model BERT converts the segmented and part-of-speech-tagged text into a computer-understandable format, namely word vectors.

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

[0102] S306: Based on the identified intent, analyze the specific needs in the user input using a knowledge base and template matching methods, including the type, quantity, and layout requirements of page elements;

[0103] S307: Extract the key parameters required for layout and typesetting from the parsed user requirements, including element position, size, color, and arrangement.

[0104] S308: Construct specific instruction parameters based on the extracted parameters.

[0105] Preferably, natural language processing technology is used to directly convert the user's natural language description into instructions for GUI layout and typesetting, thereby accurately capturing and expressing the user's intent.

[0106] As a preferred approach, the context-aware module collects user context information and combines it with multi-source data such as user behavior data and device attributes to predict the user's current usage environment and needs through machine learning and a rule engine; the specific steps are as follows:

[0107] S401: Use 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: Guide users 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: Store the collected context information in the database;

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

[0113] S407: Combines the user's natural language input with NLP to understand the user's intent and needs;

[0114] S408: Extract features from contextual 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.

[0115] S409: Assign weights to different contextual information and user intents based on preset rules and machine learning models;

[0116] S410: Use a feature concatenation fusion strategy to fuse contextual information features and user intent features;

[0117] S411: Take features as input and integrate them 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 the layout decision; use the trained model to predict the fused features and output a layout optimization suggestion and decision that integrates user intent and contextual information;

[0119] S413: Transform the fused features and prediction results into a user request representation, which is a structured data object containing layout parameters, component selection, and typography rules.

[0120] As a preferred approach, the intelligent agent module selects GUI component elements for layout and arrangement based on the instruction parameters generated by the NLP module and the information provided by the context-aware module, or optimizes existing pages and component elements; the specific steps are as follows:

[0121] S501: Receives instruction parameters generated by the NLP module and information provided by the context-aware module;

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

[0123] S503: Classify components according to their function and purpose;

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

[0125] S505: Select component elements from the component library that match the user's needs;

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

[0127] S507: Select the grid layout algorithm based on the complexity of the GUI and user preferences;

[0128] S508: Generate multiple initial layout schemes using the selected algorithm, each scheme containing the initial positions and sizes of the components;

[0129] S509: Set layout evaluation criteria, including the rationality of spacing between components, page aesthetics, and ease of user interaction;

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

[0131] S511: Based on the evaluation results, the layout scheme is optimized iteratively, the overall effect of the layout is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted in combination with user context information;

[0132] S512: Select the optimal layout from the optimized layout schemes as the final layout;

[0133] S513: Based on the final layout scheme, automatically arrange the selected component elements on the page according to the specified position and size.

[0134] As a preferred approach, based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect in real time; the specific steps are as follows:

[0135] S601: Users input adjustment commands through the language user interface;

[0136] S602: The NLP module receives the user's natural language input, performs syntactic 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 system-recognizable instruction parameters, including component ID, operation type, target location, and size;

[0138] S604: The intelligent agent module receives 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 and adjusts the actual layout on the interface, including moving components, adjusting their 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 LUI, allowing the user to see the effect of the adjustment immediately;

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

[0142] As a preferred approach, a dynamic resource management strategy is employed to monitor system resource usage and changes in user needs in real time, and to dynamically adjust the layout and arrangement 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 on current and potential changes in user needs through user behavior data and interaction feedback;

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

[0146] S704: Based on resource assessment results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategy, 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 layout and typesetting schemes by combining real-time data and resource usage.

[0148] An AI-based GUI page element layout and typesetting system includes:

[0149] The language user interface is used to provide a natural language interface for users to interact with the system, and to receive natural language commands and query conditions from users.

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

[0151] The context-aware module is used to collect user context information to provide auxiliary information for intelligent layout and typesetting.

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

[0153] The interactive feedback optimization module provides a feedback mechanism for users to interact with the system, allowing users to fine-tune the layout and typography using natural language and preview the adjustment effect in real time;

[0154] The Large Language Model Fine-tuning Training Module is used to train and fine-tune existing large language models in the GUI knowledge domain, thereby improving their performance in GUI layout and typesetting tasks.

[0155] The cross-device adaptability module ensures that the system can automatically adjust the layout and typography to adapt to different devices and screen sizes, providing a consistent user experience.

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

[0157] Example 1

[0158] Optionally, within a Customer Relationship Management (CRM) system, users need to quickly build a data dashboard to intuitively monitor and display the latest customer growth data, follow-up status, and account overviews of key customers; users expect this dashboard to efficiently support their daily work while providing good visual effects and user experience.

[0159] User input requirements: The user inputs a natural language command through the CRM system's Language User Interface (LUI): "I need a data dashboard that displays the latest customer growth data, the status of the 20 most recently followed 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: breaks long sentences down into independent words such as "I", "need", "one", and "data dashboard";

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

[0163] Named entity recognition: Identifies key entities such as "customer growth data", "customer information", and "account data overview";

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

[0165] Convert into command parameters: Extract key information about the 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), device attributes (screen size, resolution), and other information to predict the user's possible usage environment and preferences.

[0167] Based on the instruction parameters generated by the NLP module and the information provided by the context-aware module, the intelligent agent module performs the following operations:

[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 component's initial properties, such as size and color;

[0170] 3. Select a suitable layout algorithm to generate an initial layout scheme;

[0171] 4. Evaluate and optimize the layout scheme to ensure reasonable spacing between components, aesthetically pleasing page, and convenient user interaction;

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

[0173] Users can fine-tune the generated Kanban board through LUI, such as adjusting component positions and changing the displayed data range; the system previews the adjustment effect in real time, and users can save the new layout scheme after confirming their satisfaction; the system monitors resource usage in real time and dynamically adjusts the layout and arrangement based on user feedback and real-time data, such as reducing unnecessary data loading and optimizing resource allocation when resources are scarce;

[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 own needs, ensuring that the dashboard not only meets functional requirements but also has good visual effects and user experience.

[0175] Example 2

[0176] Optionally, on an e-commerce platform, users want to quickly query and view the latest order information, including product details and delivery status; users want to input commands via 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: "Please check the status of the latest orders."

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

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

[0180] A4: Based on the query intent parsed by the NLP module and the information provided by the context-aware module, the intelligent agent module performs the following operations:

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

[0182] A6: Users can provide feedback on the generated page through LUI, such as adding or deleting certain display information, adjusting the arrangement order of components, etc.; the system previews the adjustment effect in real time and makes further optimizations based on user feedback;

[0183] A7: The system monitors resource usage in real time to ensure that displaying a large amount of order information will not cause system lag or resource exhaustion. The layout and arrangement strategies are dynamically adjusted based on user feedback and real-time data, such as reducing the number of orders loaded at one time and optimizing the data loading order.

[0184] A8: The user successfully generated a page containing the latest order information quickly through a natural language query command. The page displays key information such as order details and delivery map. Users 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 have been described in detail above with reference to the accompanying drawings. However, the present invention is not limited to the above embodiments. Within the scope of knowledge possessed by those skilled in the art, various changes can be made 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: It includes the following steps: S1: Users input natural language commands 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 parsing, to understand the user's intent and convert it into recognizable instructions, generating accurate instruction parameters. S3: The context awareness module collects the user's context information, combines the user's behavior data and device attributes, including device type, screen size, and battery level, and obtains the real-time location and motion status through the device's sensors. It extracts features from the context information and user intent representation. For the context information, the information is converted into numerical and categorical features. For the user intent, keywords, phrases, and semantic vectors are extracted. The context information features and user intent features are fused using a feature concatenation fusion strategy. The features are used as input, and machine learning and rule engine are used to predict the user's current usage environment and needs. S4: The intelligent agent module selects GUI component elements for automatic layout and arrangement based on the instruction parameters generated by the NLP module and the information provided by the context-aware module, or optimizes existing pages and component elements. S5: Based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect in real time; S6: Utilize dynamic resource management strategies to monitor system resource usage and changes in user needs in real time. Based on these factors, assess whether current resources meet user requirements. If resources are scarce, optimize resource allocation, including reducing unnecessary data loading and compressing resource files. Based on resource assessment results and the priority of user needs, the intelligent agent module dynamically adjusts layout and arrangement strategies, including reducing layout complexity and optimizing component loading order. It also dynamically adjusts layout and arrangement based on user feedback and real-time data.

2. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 1, characterized in that: Users input natural language commands or search criteria through the language user interface to describe their layout and typography requirements for page elements; the specific steps are as follows: S201: The user opens a system interface containing LUI; S202: The system loads and initializes LUI, preparing to receive user input; S203: Users input natural language commands in LUI via keyboard or voice input to describe page element layout and typography requirements. The commands include detailed descriptions of page layout and functional requirements. S204: The system preprocesses the user's raw natural language commands, including but not limited to removing irrelevant characters, word segmentation, and part-of-speech tagging.

3. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 2, characterized in that: The NLP module parses the user's natural language input, extracts key information including element type, position, and style, and employs natural language processing algorithms, including word segmentation, part-of-speech tagging, named entity recognition, and dependency parsing, to understand the user's intent and transform it into recognizable instructions, generating precise instruction parameters. The specific steps are as follows: S301: The NLP module receives natural language text input by the user through the Language User Interface (LUI); S302: Use a rule-based word segmentation algorithm to segment the user-input text into individual words or phrases; 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 nouns, verbs, and adjectives; S304: The embedding layer of the deep learning model BERT converts the segmented and part-of-speech-tagged text into a computer-understandable format, namely word vectors. S305: The text is encoded using the deep learning model BERT, and the user's intent is identified through a classification layer. The model outputs the probability that the user's input belongs to each intent category. S306: Based on the identified intent, analyze the specific needs in the user input using a knowledge base and template matching methods, including the type, quantity, and layout requirements of page elements; S307: Extract the key parameters required for layout and typesetting from the parsed user requirements, including element position, size, color, and arrangement. S308: Construct specific instruction parameters based on the extracted parameters.

4. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 3, characterized in that: The context-aware module collects user context information, combines it with user behavior data and device attributes (including device type, screen size, and battery level), and uses machine learning and a rule engine to predict the user's current usage environment and needs. The specific steps are as follows: S401: Use the API provided by the operating system to obtain device status information, including device type and screen size information; S402: Acquire real-time position and motion status through the device's sensors; S403: Obtain historical user data to understand user preferences and recent layout requirements; S404: Call the corresponding API and sensor interface to obtain the required information data; S405: Store the collected context information in the database; S406: Clean and format the collected context information, convert data types and perform unit conversions; S407: Combines the user's natural language input with NLP to understand the user's intent and needs; S408: Extract features from contextual information and user intent representation; For contextual information, the information is transformed into numerical and categorical features; For user intent, extract keywords, phrases, and semantic vectors; S409: Assign weights to different contextual information and user intents based on preset rules and machine learning models; S410: Use a feature concatenation fusion strategy to fuse contextual information features and user intent features; S411: Take features as input and integrate them 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 the layout decision; use the trained model to predict the fused features and output a layout optimization suggestion and decision that integrates user intent and contextual information; S413: Transform the fused features and prediction results into a user request representation, which is a structured data object containing layout parameters, component selection, and typography rules.

5. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 4, characterized in that: The intelligent agent module selects GUI component elements for layout and arrangement based on the instruction parameters generated by the NLP module and the information provided by the context-aware module, or optimizes existing pages and component elements; the specific steps are as follows: S501: Receives instruction parameters generated by the NLP module and information provided by the context-aware module; S502: Load all available component elements from the predefined GUI component library, including buttons, text boxes, drop-down lists, and picture boxes; S503: Classify components according to their function and purpose; S504: Map user intent and context information to specific GUI component requirements; S505: Select component elements from the component library that match the user's needs; S506: Based on user input and context information, set initial properties for the selected component, including text content, color, and size; S507: Select the grid layout algorithm based on the complexity of the GUI and user preferences; S508: Generate multiple initial layout schemes using the selected algorithm, each scheme containing the initial positions and sizes of the components; S509: Set layout evaluation criteria, including the rationality of spacing between components, page aesthetics, and ease of user interaction; S510: Perform a quality assessment on each layout scheme and calculate the degree to which it meets the assessment criteria; S511: Based on the evaluation results, the layout scheme is optimized iteratively, the overall effect of the layout is improved by fine-tuning the position and size of components, and the layout is adaptively adjusted in combination with user context information; S512: Select the optimal layout from the optimized layout schemes as the final layout; S513: Based on the final layout scheme, automatically arrange the selected component elements on the page according to the specified position and size.

6. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 5, characterized in that: Based on the interactive feedback mechanism, users can fine-tune the generated interface through LUI, and the system can preview the adjustment effect in real time; the specific steps are as follows: S601: Users input adjustment commands through the language user interface; S602: The NLP module receives the user's natural language input, performs syntactic 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 system-recognizable instruction parameters, including component ID, operation type, target location, and size; S604: The intelligent agent module receives instruction parameters generated by the NLP module and prepares to adjust the interface layout; S605: The intelligent agent module adjusts and optimizes the actual layout on the interface in real time according to the command parameters, including moving components, adjusting their size, 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, allowing the user to see the effect of the adjustment immediately; S607: The user observes the real-time preview effect. If satisfied, the user confirms the new layout scheme, and the system saves it. If not satisfied, the user continues to input new adjustment commands through LUI and repeats the above steps until satisfied.

7. The method for optimizing GUI page element layout and typesetting based on artificial intelligence according to claim 6, characterized in that: Utilizing dynamic resource management strategies, the system monitors resource usage and changes in user needs in real time, dynamically adjusting layout and arrangement 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 on current and potential changes in user needs through user behavior data and interaction feedback; S703: Based on system resource usage and changes in user needs, assess whether the current resources meet the user's needs; if resources are scarce, optimize resource allocation, including reducing unnecessary data loading and compressing resource files; S704: Based on resource assessment results and the priority of user needs, the intelligent agent module dynamically adjusts the layout and typesetting strategy, 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 layout and typesetting schemes by combining real-time data and resource usage.

8. A GUI page element layout and typesetting system based on artificial intelligence, employing the GUI page element layout and typesetting optimization method as described in any one of claims 1-7, characterized in that: Including: The language user interface is used to provide a natural language interface for users to interact with the system, and to receive natural language commands and query conditions from users. The natural language processing module is used to parse the user's natural language input, extract key information, and generate precise instruction parameters; The context-aware module is used to collect user context information to provide auxiliary information for intelligent layout and typesetting.

9. The GUI page element layout and typesetting system based on artificial intelligence according to claim 8, characterized in that: It also includes: The intelligent agent module is used to automatically select GUI component elements for layout and arrangement based on the user's natural language input and context information, and to optimize existing pages and component elements; The interactive feedback optimization module provides a feedback mechanism for users to interact with the system, allowing users to fine-tune the layout and typography using natural language and preview the effects of the adjustments in real time.

10. The AI-based GUI page element layout and typesetting system according to claim 9, characterized in that: It also includes: The Large Language Model Fine-tuning Training Module is used to train and fine-tune existing large language models in the GUI knowledge domain, thereby improving their performance in GUI layout and typesetting tasks. The cross-device adaptability module ensures that the system can automatically adjust the layout and typography to adapt to different devices and screen sizes, providing a consistent user experience.

Images