Interface generation system based on large language model LLM

Through an interface generation system based on a large language model LLM, multi-level processing is used to generate interface codes that meet business needs, solving the problem of unreasonable interface code generation in the existing technology, and improving the usability and stability of interface content.

CN119645406AInactive Publication Date: 2025-03-18NANJING TUANDA TECHNOLOGY CO LTD

Patent Information

Application Number
CN202510174484.X
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-02-18
Publication Date
2025-03-18
Estimated Expiration
Not applicable · inactive patent

AI Technical Summary

Technical Problem

It is difficult for the prior art to generate a set of website code that meets business needs and has a reasonable structure based on limited interface description, resulting in a major shortcoming of the content availability of the generated front-end interface.

Method used

An interface generation system based on a large language model LLM is adopted to realize intelligent generation and real-time rendering of interface code through multi-level processing of user layer, data acquisition layer, parameter processing layer, model processing layer, code generation layer, interface rendering layer and monitoring layer.

Benefits of technology

The system can effectively overcome the shortcomings of the existing technology, generate interface codes that meet business needs, improve the usability and stability of interface content, and support real-time updates and rendering.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119645406A_ABST
    Figure CN119645406A_ABST
Patent Text Reader

Abstract

The invention relates to interface generation, in particular to an interface generation system based on a large language model (LLM), which comprises a data acquisition layer for performing data extraction and parameterized packaging on interface description data received by a user layer and converting the interface description data into a structured data set; the parameter processing layer is used for classifying the structured data set output by the data acquisition layer according to an input purpose, inserting a corresponding prompt template, automatically generating context variables required by each interface module in an interface generation process by AI, and carrying out association matching on each interface module and parameters thereof; the model processing layer summarizes the operation of each interface module, converts the operation into operation description, inserts the operation description into a corresponding prompt template, and selects the most suitable operation from the operation description according to the description of each interface module; according to the technical scheme, the defect that in the prior art, it is difficult to generate interface codes meeting service requirements on the basis of limited interface description can be effectively overcome.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to interface generation, and in particular to an interface generation system based on a large language model (LLM). Background Art

[0002] With the rise of AI technology, the conventional front-end interface code generation method currently on the market usually directly passes the interface description to the large language model LLM to generate the front-end interface code. This generation method has defects such as small code content and low stability, especially when facing interfaces that need to generate complex descriptions, these generation methods are often unable to cope with it. In addition, these generation methods cannot generate a set of website codes that meet business needs and have a reasonable structure based on limited interface descriptions, resulting in a large lack of content availability in the generated front-end interface. Summary of the invention

[0003] In view of the above-mentioned shortcomings of the prior art, the present invention provides an interface generation system based on a large language model (LLM), which can effectively overcome the defect of the prior art that it is difficult to generate interface codes that meet business requirements based on limited interface descriptions.

[0004] To achieve the above objectives, the present invention is implemented through the following technical solutions: The interface generation system based on the large language model LLM includes the user layer, data collection layer, parameter processing layer, model processing layer, code generation layer, interface rendering layer and monitoring layer; The user layer receives the interface description data submitted by the user through the front-end form; The data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set; The parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose and inserts the corresponding prompt template. AI automatically generates the context variables required by each interface module in the interface generation process and associates and matches each interface module and its parameters. The model processing layer summarizes the operations of each interface module and converts them into operation descriptions. The operation descriptions are inserted into the corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions based on the descriptions of each interface module. The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates using the configuration parameters to convert the operation requirements into corresponding interface components, and combines multiple interface components to generate complete interface codes; The interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user. It also maps user requirements to corresponding configuration parameters, updates and generates interface code in real time, and re-renders. The monitoring layer monitors and logs the entire interface generation process for exceptions, and quickly locates and responds to exceptions.

[0005] Preferably, the user layer receives the interface description data submitted by the user through the front-end form, including: Users submit interface description data including website name, theme description, content description and document file with sample data through the front-end form.

[0006] Preferably, the data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set, including: Extract sample data from the document files uploaded by users through the SheetJS library and convert it into JSON format sample data to ensure that the data can be correctly identified and subsequently processed; The remaining data in the interface description data except the document file is structured and merged with the JSON format sample data to be converted into a structured data set.

[0007] Preferably, the parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose, and inserts the corresponding prompt template, and the AI ​​automatically generates the context variables required by each interface module in the interface generation process, and associates and matches each interface module and its parameters, including: The structured data sets output by the data collection layer are classified according to the input purpose, including basic website information, theme description, and interaction requirements, so as to provide clear structural support for subsequent generation; Insert the classified data into the predefined prompt template to ensure that the data accurately corresponds to the functional requirements of each interface module, thereby reducing the error rate and improving processing efficiency; AI automatically generates the context variables required by each interface module in the interface generation process based on the context in the prompt template and the interface generation requirements, ensuring the accuracy and consistency of the interface generation process; Use context association technology to accurately match the variables required by each interface module, ensure the high correlation between each interface module and its parameters, and meet different interface customization requirements; The associated data is stored in a structured database to facilitate subsequent quick calls and updates, thereby improving the efficiency of interface generation and updates.

[0008] Preferably, the model processing layer summarizes the operations of each interface module and converts them into operation descriptions, inserts the operation descriptions into corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions according to the descriptions of each interface module, including: Summarize the operations of each interface module and convert them into operation descriptions including operation type, object, and conditions to provide a clear operation framework for AI and ensure that appropriate operations are selected later; Insert the operation description into the predefined prompt template to ensure that each operation has sufficient context information to provide sufficient context support for AI and ensure the subsequent selection of the appropriate operation; AI selects the most suitable operation from the operation description according to the description of each interface module. Through AI's intelligent selection, it ensures that the output operation meets the functional requirements of each interface module, thereby improving the accuracy of code generation.

[0009] Preferably, the code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates with the configuration parameters to convert the operation requirements into corresponding interface components, including: Classify the operations output by the model processing layer into page structure operations, style setting operations, interactive logic operations, and rendering configuration operations, retrieve the templates required for the corresponding operations, and extract relevant configuration parameters from the structured data set; Map the extracted configuration parameters to the placeholders in the template and replace the default values ​​in the placeholders according to the operation requirements so that the template fully reflects the user needs; The replaced placeholder is converted into a corresponding interface component. The function of the interface component is determined by the configuration parameters. The system adjusts the functional properties of the interface component in real time according to the configuration parameters. The system flexibly adjusts the functions and styles of interface components according to user needs, ensuring that interface elements are highly adaptable to different user needs while retaining the functional implementation expected by users.

[0010] Preferably, the code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates with the configuration parameters to convert the operation requirements into corresponding interface components, and then includes: Generate corresponding data according to the structural requirements of the content module and the sample data in JSON format in the structured data set; Verify the generated data with the existing data in the knowledge base. If similar data is found in the knowledge base, the generated data will be used as valid data. Otherwise, the generated data will be considered invalid and regenerated. Among them, valid data that has passed verification is stored in the knowledge base, which further enriches and improves the content of the knowledge base and enhances the system's data management capabilities.

[0011] Preferably, the code generation layer combines multiple interface components to generate complete interface code, including: Extract code snippets including page structure, style settings, interaction logic and rendering configuration of each interface module from the template according to user needs; Perform parameter replacement on the extracted code snippets and replace the placeholders in the template with actual configuration values, so that the generated code fully reflects user needs; Combine the replaced code snippets in an orderly manner based on the logical association rules, and splice the code snippets into a complete interface code according to the overall logic of the interface; After verification, the spliced ​​interface code generates a complete interface file to ensure adaptability and scalability in different demand scenarios, providing a stable and efficient implementation path for the final generated interface; When splicing the interface code, check the interfaces and dependencies between the interface modules to ensure the compatibility of the code in terms of function and structure and avoid interface problems caused by logical conflicts.

[0012] Preferably, the interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user, and at the same time maps the user requirements to corresponding configuration parameters, updates and generates the interface code in real time, and re-renders, including: The interface code output by the code generation layer is rendered into a visual page in real time through the ifame tag and displayed to the user so that the user can intuitively view the generated interface effect; When users adjust the layout, functions and properties of interface components through graphical editing tools, user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for users, ensuring that the adjustments to the interface components can be quickly reflected in the actual code while maintaining the accuracy of the code. When a user edits an interface component separately through an independent editing module, the user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for the user. It supports independent module adjustments and code regeneration to avoid unnecessary impact on the overall interface, while making interface generation flexible and scalable.

[0013] Preferably, the monitoring layer performs abnormal monitoring and log recording on the entire interface generation process, and quickly locates and responds to the abnormality, including: By establishing an exception monitoring mechanism, the entire interface generation process is monitored for exceptions and abnormal situations are continuously recorded; Any exceptions that occur during the interface generation process will be captured and intelligently recorded in the log file for subsequent analysis and problem solving; When an exception occurs, the fuse mechanism will be triggered, and the operation that triggered the exception will be replaced with a second-class operation of the same type that meets the requirements. The operation that triggered the exception will be temporarily moved from the operation library to the exception library for subsequent adjustment and optimization. After modification, it can be moved back to the operation library. Use log analysis technology to quickly locate and respond to anomalies.

[0014] Compared with the prior art, the interface generation system based on the large language model LLM provided by the present invention has the following beneficial effects: 1) Functional interface generation based on limited interface description: The system intelligently expands the limited interface description provided by the user. Even if the user only enters a website name, the system can generate a complete set of functional interface codes related to the website name, covering multiple modules and pages required by the website; 2) Dynamic replacement of configuration parameters: By establishing a dynamic replacement mechanism for configuration parameters, the system can manipulate the style of modules and replace the content of modules, thus realizing dynamic configuration of interface modules and personalized generation of interface content; 3) Model behavior specification: The system proposes a model behavior expansion and specification mechanism, which encapsulates the code layer operation into a behavior, describes the behavior, and finally provides the description to the large language model (LLM). This mechanism can divide the responsibilities of the model and the system, leaving the code operations that require stability to the system, while leaving the abstract and creative content to AI, greatly improving the usability of the code and the stability of the structure; 4) Extract data from Excel documents and generate sample data for content modules based on the data: The system automatically extracts Excel data uploaded by users and maps it to predefined content modules to generate sample data that meets the requirements. This process improves the accuracy, consistency and efficiency of data processing, reduces the complexity of manual intervention, and ensures the stability and scalability of module data. 5) Data generation and verification based on content structure: The system automatically generates corresponding data according to the structural requirements of the content module, and compares and verifies it with the existing data in the knowledge base. In this way, the system continuously enriches and improves the content of the knowledge base, and improves the accuracy and intelligence of data management and application; 6) Modular generation and assembly: The system breaks down the interface into small modules, generates module content separately while ensuring that each module is related, and dynamically replaces each module through configuration parameters to form a usable front-end interface code. This approach ensures the richness of the generated interface content. 7) Visual editing of generated interface: It provides the echo of generated interface content, renders the generated interface into the system window, and provides users with graphical editing tools to support secondary modification of the interface. At the same time, a certain interface component can be edited separately through an independent editing module to achieve advanced customization of the generated interface. BRIEF DESCRIPTION OF THE DRAWINGS

[0015] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings required for use in the embodiments or the prior art descriptions are briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention, and for ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0016] Figure 1 It is a system schematic diagram of the present invention; Figure 2 This is a schematic diagram of the workflow of the data acquisition layer in the present invention; Figure 3 It is a schematic diagram of the working process of the parameter processing layer in the present invention; Figure 4 It is a schematic diagram of the workflow of the model processing layer in the present invention; Figure 5 This is a schematic diagram of the workflow of the code generation layer in the present invention; Figure 6 This is a schematic diagram of the workflow of the interface rendering layer in the present invention; Figure 7 Schematic diagram of the working process of the monitoring layer in the present invention. DETAILED DESCRIPTION

[0017] In order to make the purpose, technical solution and advantages of the embodiments of the present invention clearer, the technical solution in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the described embodiments are part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0018] Interface generation system based on large language model LLM, such as Figure 1As shown, it includes user layer, data acquisition layer, parameter processing layer, model processing layer, code generation layer, interface rendering layer and monitoring layer; The user layer receives the interface description data submitted by the user through the front-end form; The data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set; The parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose and inserts the corresponding prompt template. AI automatically generates the context variables required by each interface module in the interface generation process and associates and matches each interface module and its parameters. The model processing layer summarizes the operations of each interface module and converts them into operation descriptions. The operation descriptions are inserted into the corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions based on the descriptions of each interface module. The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates using the configuration parameters to convert the operation requirements into corresponding interface components, and combines multiple interface components to generate complete interface codes; The interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user. It also maps user requirements to corresponding configuration parameters, updates and generates interface code in real time, and re-renders. The monitoring layer monitors and logs the entire interface generation process for exceptions, and quickly locates and responds to exceptions.

[0019] ① The user layer receives the interface description data submitted by the user through the front-end form, including: Users submit interface description data including website name, theme description, content description and document file (Excel file) with sample data through the front-end form.

[0020] ② If Figure 2 As shown, the data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set, including: Extract sample data from the document files uploaded by users through the SheetJS library and convert it into JSON format sample data to ensure that the data can be correctly identified and subsequently processed; The remaining data in the interface description data except the document file is structured and merged with the JSON format sample data to be converted into a structured data set.

[0021] ③ Such as Figure 3As shown, the parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose, and inserts the corresponding prompt template. The AI ​​(i.e., inputting the large language model LLM for processing) automatically generates the context variables required by each interface module in the interface generation process, and associates and matches each interface module and its parameters, including: The structured data sets output by the data collection layer are classified according to the input purpose, including basic website information, theme description, and interaction requirements, so as to provide clear structural support for subsequent generation; Insert the classified data into the predefined prompt template to ensure that the data accurately corresponds to the functional requirements of each interface module, thereby reducing the error rate and improving processing efficiency; AI automatically generates the context variables required by each interface module in the interface generation process based on the context in the prompt template and the interface generation requirements, ensuring the accuracy and consistency of the interface generation process; Use context association technology to accurately match the variables required by each interface module, ensure the high correlation between each interface module and its parameters, and meet different interface customization requirements; The associated data is stored in a structured database to facilitate subsequent quick calls and updates, thereby improving the efficiency of interface generation and updates.

[0022] ④ Such as Figure 4 As shown in the figure, the model processing layer summarizes the operations of each interface module and converts them into operation descriptions, inserts the operation descriptions into the corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions according to the descriptions of each interface module, including: Summarize the operations of each interface module and convert them into operation descriptions including operation type, object, and conditions to provide a clear operation framework for AI and ensure that appropriate operations are selected later; Insert the operation description into the predefined prompt template to ensure that each operation has sufficient context information to provide sufficient context support for AI and ensure the subsequent selection of the appropriate operation; AI selects the most suitable operation from the operation description according to the description of each interface module. Through AI's intelligent selection, it ensures that the output operation meets the functional requirements of each interface module, thereby improving the accuracy of code generation.

[0023] ⑤ If Figure 5 As shown in the figure, 1) the code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the template using the configuration parameters to convert the operation requirements into corresponding interface components, including: Classify the operations output by the model processing layer into page structure operations, style setting operations, interactive logic operations, and rendering configuration operations, retrieve the templates required for the corresponding operations, and extract relevant configuration parameters from the structured data set; Map the extracted configuration parameters to the placeholders in the template and replace the default values ​​in the placeholders according to the operation requirements so that the template fully reflects the user needs; The replaced placeholder is converted into a corresponding interface component. The function of the interface component is determined by the configuration parameters. The system adjusts the functional properties of the interface component in real time according to the configuration parameters. The system flexibly adjusts the functions and styles of interface components according to user needs, ensuring that interface elements are highly adaptable to different user needs while retaining the functional implementation expected by users.

[0024] The above technical solution establishes a dynamic replacement mechanism for configuration parameters that converts abstract operation requirements into specific interface component functions. The system extracts relevant configuration parameters from a structured data set and maps the extracted configuration parameters to placeholders in the template. By dynamically replacing the placeholders in the template, the operation requirements are converted into interface components with corresponding functions. This mechanism flexibly selects and replaces placeholders according to user needs, realizes the style and behavior customization of various interface elements, and ensures high adaptability and functional realization under different user needs.

[0025] 2) The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and uses the configuration parameters to dynamically replace the placeholders in the template to convert the operation requirements into corresponding interface components, including: Generate corresponding data according to the structural requirements of the content module and the sample data in JSON format in the structured data set; Verify the generated data with the existing data in the knowledge base. If similar data is found in the knowledge base, the generated data will be used as valid data. Otherwise, the generated data will be considered invalid and regenerated. Among them, valid data that has passed verification is stored in the knowledge base, which further enriches and improves the content of the knowledge base and enhances the system's data management capabilities.

[0026] 3) The code generation layer combines multiple interface components to generate complete interface code, including: Extract code snippets including page structure, style settings, interaction logic and rendering configuration of each interface module from the template according to user needs; Perform parameter replacement on the extracted code snippets and replace the placeholders in the template with actual configuration values, so that the generated code fully reflects user needs; Combine the replaced code snippets in an orderly manner based on the logical association rules, and splice the code snippets into a complete interface code according to the overall logic of the interface; After verification, the spliced ​​interface code generates a complete interface file to ensure adaptability and scalability in different demand scenarios, providing a stable and efficient implementation path for the final generated interface; When splicing the interface code, check the interfaces and dependencies between the interface modules to ensure the compatibility of the code in terms of function and structure and avoid interface problems caused by logical conflicts.

[0027] The above technical solution combines multiple interface components to generate complete interface code based on precise assembly logic. According to user needs, the system extracts code snippets including page structure, style settings, interaction logic and rendering configuration of each interface module from the template, and combines them in an orderly manner through parameter replacement and logical association. The assembly of each code snippet not only depends on the configuration, but also needs to be connected with the code snippets of other interface modules to ensure the compatibility and consistency of the final generated interface. This mechanism ensures that the generated interface code is highly adaptable and scalable.

[0028] ⑥ Such as Figure 6 As shown, the interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user. At the same time, it maps the user requirements to the corresponding configuration parameters, updates and generates the interface code in real time, and re-renders it, including: The interface code output by the code generation layer is rendered into a visual page in real time through the ifame tag and displayed to the user so that the user can intuitively view the generated interface effect; When users adjust the layout, functions and properties of interface components through graphical editing tools, user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for users, ensuring that the adjustments to the interface components can be quickly reflected in the actual code while maintaining the accuracy of the code. When a user edits an interface component separately through an independent editing module, the user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for the user. It supports independent module adjustments and code regeneration to avoid unnecessary impact on the overall interface, while making interface generation flexible and scalable.

[0029] ⑦ Such as Figure 7 As shown in the figure, the monitoring layer monitors and logs the entire interface generation process for exceptions, and quickly locates and responds to exceptions, including: By establishing an exception monitoring mechanism, the entire interface generation process is monitored for exceptions and abnormal situations are continuously recorded; Any exceptions that occur during the interface generation process will be captured and intelligently recorded in the log file for subsequent analysis and problem solving; When an exception occurs, the fuse mechanism will be triggered, and the operation that triggered the exception will be replaced with a second-class operation of the same type that meets the requirements. The operation that triggered the exception will be temporarily moved from the operation library to the exception library for subsequent adjustment and optimization. After modification, it can be moved back to the operation library. Use log analysis technology to quickly locate and respond to anomalies.

[0030] The above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit the same. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that the technical solutions described in the aforementioned embodiments may still be modified, or some of the technical features may be replaced by equivalents. Such modifications or replacements will not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present invention.

Claims

1. An interface generation system based on a large language model (LLM), characterized by: It includes user layer, data collection layer, parameter processing layer, model processing layer, code generation layer, interface rendering layer and monitoring layer; The user layer receives the interface description data submitted by the user through the front-end form; The data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set; The parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose and inserts the corresponding prompt template. AI automatically generates the context variables required by each interface module in the interface generation process and associates and matches each interface module and its parameters. The model processing layer summarizes the operations of each interface module and converts them into operation descriptions. The operation descriptions are inserted into the corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions based on the descriptions of each interface module. The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates using the configuration parameters to convert the operation requirements into corresponding interface components, and combines multiple interface components to generate complete interface codes; The interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user. It also maps user requirements to corresponding configuration parameters, updates and generates interface code in real time, and re-renders. The monitoring layer monitors and logs the entire interface generation process for exceptions, and quickly locates and responds to exceptions.

2. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The user layer receives the interface description data submitted by the user through the front-end form, including: Users submit interface description data including website name, theme description, content description and document file with sample data through the front-end form.

3. The interface generation system based on the large language model (LLM) according to claim 2, characterized in that: The data collection layer extracts and parameterizes the interface description data received by the user layer, and converts the interface description data into a structured data set, including: Extract sample data from the document files uploaded by users through the SheetJS library and convert it into JSON format sample data to ensure that the data can be correctly identified and subsequently processed; The remaining data in the interface description data except the document file is structured and merged with the JSON format sample data to be converted into a structured data set.

4. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The parameter processing layer classifies the structured data set output by the data collection layer according to the input purpose, and inserts the corresponding prompt template. The AI ​​automatically generates the context variables required by each interface module in the interface generation process, and associates and matches each interface module and its parameters, including: The structured data sets output by the data collection layer are classified according to the input purpose, including basic website information, theme description, and interaction requirements, so as to provide clear structural support for subsequent generation; Insert the classified data into the predefined prompt template to ensure that the data accurately corresponds to the functional requirements of each interface module, thereby reducing the error rate and improving processing efficiency; AI automatically generates the context variables required by each interface module in the interface generation process based on the context in the prompt template and the interface generation requirements, ensuring the accuracy and consistency of the interface generation process; Use context association technology to accurately match the variables required by each interface module, ensure the high correlation between each interface module and its parameters, and meet different interface customization requirements; The associated data is stored in a structured database to facilitate subsequent quick calls and updates, thereby improving the efficiency of interface generation and updates.

5. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The model processing layer summarizes the operations of each interface module and converts them into operation descriptions, inserts the operation descriptions into the corresponding prompt templates, and AI selects the most suitable operation from the operation descriptions according to the descriptions of each interface module, including: Summarize the operations of each interface module and convert them into operation descriptions including operation type, object, and conditions to provide a clear operation framework for AI and ensure that appropriate operations are selected later; Insert the operation description into the predefined prompt template to ensure that each operation has sufficient context information to provide sufficient context support for AI and ensure the subsequent selection of the appropriate operation; AI selects the most suitable operation from the operation description according to the description of each interface module. Through AI's intelligent selection, it ensures that the output operation meets the functional requirements of each interface module, thereby improving the accuracy of code generation.

6. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates using the configuration parameters to convert the operation requirements into corresponding interface components, including: Classify the operations output by the model processing layer into page structure operations, style setting operations, interactive logic operations, and rendering configuration operations, retrieve the templates required for the corresponding operations, and extract relevant configuration parameters from the structured data set; Map the extracted configuration parameters to the placeholders in the template and replace the default values ​​in the placeholders according to the operation requirements so that the template fully reflects the user needs; The replaced placeholder is converted into a corresponding interface component. The function of the interface component is determined by the configuration parameters. The system adjusts the functional properties of the interface component in real time according to the configuration parameters. The system flexibly adjusts the functions and styles of interface components according to user needs, ensuring that interface elements are highly adaptable to different user needs while retaining the functional implementation expected by users.

7. The interface generation system based on the large language model (LLM) according to claim 6, characterized in that: The code generation layer classifies the operations output by the model processing layer, retrieves the templates required for the corresponding operations, extracts relevant configuration parameters from the structured data set, and dynamically replaces the placeholders in the templates with the configuration parameters to convert the operation requirements into corresponding interface components, including: Generate corresponding data according to the structural requirements of the content module and the sample data in JSON format in the structured data set; Verify the generated data with the existing data in the knowledge base. If similar data is found in the knowledge base, the generated data will be used as valid data. Otherwise, the generated data will be considered invalid and regenerated. Among them, valid data that has passed verification is stored in the knowledge base, which further enriches and improves the content of the knowledge base and enhances the system's data management capabilities.

8. The interface generation system based on the large language model (LLM) according to claim 7, characterized in that: The code generation layer combines multiple interface components to generate complete interface code, including: Extract code snippets including page structure, style settings, interaction logic and rendering configuration of each interface module from the template according to user needs; Perform parameter replacement on the extracted code snippets and replace the placeholders in the template with actual configuration values, so that the generated code fully reflects user needs; Combine the replaced code snippets in an orderly manner based on the logical association rules, and splice the code snippets into a complete interface code according to the overall logic of the interface; After verification, the spliced ​​interface code generates a complete interface file to ensure adaptability and scalability in different demand scenarios, providing a stable and efficient implementation path for the final generated interface; When splicing the interface code, check the interfaces and dependencies between the interface modules to ensure the compatibility of the code in terms of function and structure and avoid interface problems caused by logical conflicts.

9. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The interface rendering layer renders the interface code output by the code generation layer in real time and displays it to the user, and maps the user requirements to corresponding configuration parameters, updates and generates the interface code in real time, and re-renders, including: The interface code output by the code generation layer is rendered into a visual page in real time through the ifame tag and displayed to the user so that the user can intuitively view the generated interface effect; When users adjust the layout, functions and properties of interface components through graphical editing tools, user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for users, ensuring that the adjustments to the interface components can be quickly reflected in the actual code while maintaining the accuracy of the code. When a user edits an interface component individually through an independent editing module, the user operations are captured in real time and these adjustments are mapped to corresponding configuration parameters. The system regenerates the interface code in real time according to the updated configuration parameters and renders it for the user. It supports independent module adjustments and code regeneration to avoid unnecessary impact on the overall interface, while making interface generation flexible and scalable.

10. The interface generation system based on the large language model (LLM) according to claim 1, characterized in that: The monitoring layer monitors and logs the entire interface generation process for exceptions, and quickly locates and responds to exceptions, including: By establishing an exception monitoring mechanism, the entire interface generation process is monitored for exceptions and abnormal situations are continuously recorded; Any exceptions that occur during the interface generation process will be captured and intelligently recorded in the log file for subsequent analysis and problem solving; When an exception occurs, the fuse mechanism will be triggered, and the operation that triggered the exception will be replaced with a second-class operation of the same type that meets the requirements. The operation that triggered the exception will be temporarily moved from the operation library to the exception library for subsequent adjustment and optimization. After modification, it can be moved back to the operation library. Use log analysis technology to quickly locate and respond to anomalies.

Citation Information

Patent Citations

  • Method and device for generating specific layout webpage by using language model tree

    CN117369771A

Cited By

  • Application program generation method and device applied to low-code platform, readable storage medium and program product

    CN121116301A

  • Interactive interface generation method and system, computer equipment and medium

    CN121704841A