CN-121579007-B - UI (user interface) automatic generation method and system based on natural language description

CN121579007BCN 121579007 BCN121579007 BCN 121579007BCN-121579007-B

Abstract

The automatic UI interface generation method and system based on natural language description comprise the steps of receiving a natural language demand description text, conducting guided complementation on fuzzy description in the demand description text, outputting a standardized demand text, conducting semantic analysis on the standardized demand text, locating functional association nodes of UI components and data fields in the text, correcting analysis deviation through a domain knowledge graph to obtain key information comprising component parameters, field verification rules and component priorities, retrieving a design specification library comprising a scene visual standard and a dynamic layout algorithm, and a component library comprising a parameterization configuration function, conducting component matching and parameter adjustment on the basis of the key information and the design specification library and the component library to obtain a target component, generating a front end code or a low code blueprint of the target component, and conducting rendering to obtain the UI interface. In the invention, the problems of low efficiency of demand transmission, high development threshold and difficult multi-terminal adaptation existing at present are solved.

Inventors

CUI XUN
ZHANG YUNPENG

Assignees

北京北纬三十度网络科技有限公司

Dates

Publication Date: 20260512
Application Date: 20251219

Claims (8)

1. The UI interface automatic generation method based on the natural language description is characterized by comprising the following steps of: Receiving a natural language demand description text, performing guided complement on fuzzy description in the demand description text, and outputting a standardized demand text comprising a UI component, data fields and interaction logic; carrying out semantic analysis on the standardized demand text, positioning functional association nodes of UI components and data fields in the text, and correcting analysis deviation through a domain knowledge graph to obtain key information comprising component parameters, field verification rules and component priorities; invoking a design specification library comprising scene vision standards and dynamic layout algorithms and a component library comprising parameterized configuration functions; The method comprises the steps of screening logically matched candidate components from a component library based on the type of the components, the priority of the components and the use scene analyzed in the key information, carrying out component parameter adjustment on the candidate components based on a scene visual standard and a dynamic layout algorithm in the design specification library to obtain the target components, calling a code template corresponding to the target components in the component library, embedding the adjusted component parameters into the code template to generate a front-end code or a low-code blueprint of the target components, wherein, for the front-end code template, a parameter placeholder in the code template is automatically replaced, and a performance optimization mark is embedded; rendering the front-end code or the low-code blueprint to obtain a UI interface; The method comprises the steps of collecting multi-source data and associated environment information input to a UI interface to form a multi-dimensional data set to be desensitized, inputting the multi-dimensional data set to be desensitized into an enhanced lightweight sensitive data identification model to output sensitive data types, sensitive grades and confidence levels, taking SqueezeNet as a basic framework of the model, adding a service attribute-sensitive characteristic association learning submodule except a dynamic channel pruning module by a characteristic extraction layer, binding a service scene and sensitive characteristics through attention weights, utilizing a cross-scene sensitive data sample to finely adjust model parameters before an output layer except a convolution layer and a Sigmoid space attention mechanism, presetting sensitive grade basic thresholds, correcting the sensitive grade basic thresholds in real time by combining user login authority grades and data transmission network types, carrying out differential desensitization on sensitive data of different sensitive grades if the model output confidence level reaches the corrected thresholds, calling a domain rule engine, and checking whether the desensitized data still meets the core service function of the UI interface.
2. The method for automatically generating a UI interface based on a natural language description according to claim 1, wherein receiving a natural language requirement description text, performing guided completion on a fuzzy description in the requirement description text, outputting a standardized requirement text including a UI component, a data field, and an interactive logic, comprises: Receiving a natural language demand description text input by a user, extracting keywords in the demand description text, comparing the keywords with a preset fuzzy description feature library, and identifying fuzzy description fragments related to UI component types, data field association relations and interaction logic triggering conditions in the demand description text; aiming at the fuzzy description fragments, generating guided complement prompts of corresponding scenes; And receiving feedback information of the user on the guided completion prompt, fusing the feedback information with the natural language requirement description text, carrying out structural arrangement, and outputting a standardized requirement text comprising a UI component, a data field and interaction logic.
3. The automatic UI interface generating method based on natural language description according to claim 1, wherein the performing semantic analysis on the standardized demand text, positioning functional association nodes of UI components and data fields in the text, correcting analysis deviation through a domain knowledge graph, obtaining key information including component parameters, field verification rules, and component priorities, includes: Segmenting the standardized demand text into a UI component description section, a data field description section and an interactive logic description section, converting each segmented text code into a vector, and constructing a semantic feature space; The method comprises the steps that a bidirectional attention mechanism is utilized in a semantic feature space, cross attention calculation is conducted on a UI component description section and a data field description section, functional association nodes of the UI component and the data field in a standardized demand text are located through bidirectional attention weight superposition, and association strength is marked; comparing the functional association node with a mapping relation in a pre-constructed UI domain knowledge graph, and correcting analysis deviation to obtain a corrected analysis result, wherein the UI domain knowledge graph comprises a plurality of groups of mapping relations among component parameters, field verification rules and component priorities; And carrying out structural extraction on the corrected analysis result to obtain key information comprising component parameters, field verification rules and component priorities.
4. The automatic UI interface generation method based on natural language description according to claim 1, wherein when component parameters of candidate components are adjusted, the values are automatically assigned according to the scene visual standard for the component style parameters, the adaptive values are calculated through a dynamic layout algorithm for the component layout parameters, and the optimal values are determined by combining field data amounts in key information for the component function parameters.
5. The automatic UI interface generating method based on natural language description according to claim 1, wherein rendering the front-end code or the low-code blueprint to obtain a UI interface comprises: Aiming at the front-end code, packaging HTML, CSS, JS/TS files and associated dependencies into a resource package capable of being directly loaded through a resource packaging tool, analyzing the embedded performance optimization mark, determining the resource loading priority, rendering the resource package according to the rendering environment corresponding to the use field Jing Jiazai of the UI interface and the resource loading priority, and generating a preview interface; Aiming at the low-code blueprint, converting a visual configuration item in the low-code blueprint into a rendering instruction which can be identified by a platform through an analysis engine of the low-code platform, and establishing a mapping relation between the visual configuration item and a rendering result; Verifying the loading integrity of the preview interface node and verifying the adaptation effect through the equipment compatibility testing framework; After verification is passed, a natural language interaction adjustment entry is generated, a natural language adjustment instruction input by a user is received, the adjustment instruction is analyzed and converted into a corresponding interface style and layout modification instruction, a rendering result is updated in real time, and finally a functional UI interface capable of being directly operated is obtained.
6. The method for automatically generating a UI interface based on a natural language description according to claim 5, wherein rendering the resource package according to the resource loading priority, generating a preview interface, comprises: the PC end calls a browser kernel rendering module, sequentially renders DOM nodes and patterns in the resource package according to the resource loading priority, and generates a preview interface; the mobile terminal converts the format of the resource package through the adaptation engine, calls a native application rendering interface, renders the resource package after format conversion according to the resource loading priority, and generates a preview interface.
7. The method for automatically generating a UI interface based on natural language description according to claim 1, wherein after performing component parameter adjustment on the candidate component to obtain the target component, further comprising: extracting user historical operation data and terminal equipment parameters from the key information, and determining terminal equipment performance according to the terminal equipment parameters; Analyzing the matching degree of the performance of the terminal equipment and the resource consumption of the target component through a gradient lifting algorithm, and adjusting the resource consumption of the target component according to the matching degree; the layout priority of the target component is adjusted in combination with the user history operation data.
8. An automatic UI interface generation system based on natural language description, comprising: The receiving unit is used for receiving the natural language demand description text, carrying out guided complementation on the fuzzy description in the demand description text, and outputting standardized demand text comprising a UI component, data fields and interaction logic; The analysis unit is used for carrying out semantic analysis on the standardized demand text, positioning functional association nodes of the UI components and the data fields in the text, and correcting analysis deviation through the domain knowledge graph to obtain key information comprising component parameters, field verification rules and component priorities; The calling unit is used for calling a design specification library comprising a scene visual standard and a dynamic layout algorithm and a component library comprising a parameterized configuration function; The generating unit is used for carrying out component matching and parameter adjustment on the basis of the key information, the design specification library and the component library to obtain a target component and generating a front end code or a low code blueprint of the target component, and comprises the steps of screening logically matched candidate components from the component library on the basis of the component type, the component priority and the use scene analyzed in the key information, carrying out component parameter adjustment on the candidate components on the basis of a scene visual standard and a dynamic layout algorithm in the design specification library to obtain the target component, calling a code template corresponding to the target component in the component library, embedding the adjusted component parameter into the code template to generate the front end code or the low code blueprint of the target component, automatically replacing a parameter placeholder in the code template for the front end code template and embedding a performance optimization mark, and mapping the component parameter into a visual configuration item of a low code platform for the low code blueprint template; the rendering unit is used for rendering the front-end code or the low-code blueprint to obtain a UI interface; The method comprises the steps of collecting multi-source data and associated environment information input to a UI interface to form a multi-dimensional data set to be desensitized, inputting the multi-dimensional data set to be desensitized into an enhanced lightweight sensitive data identification model to output sensitive data types, sensitive grades and confidence levels, taking SqueezeNet as a basic framework of the model, adding a service attribute-sensitive characteristic association learning submodule except a dynamic channel pruning module by a characteristic extraction layer, binding a service scene and sensitive characteristics through attention weights, utilizing a cross-scene sensitive data sample to finely adjust model parameters before an output layer except a convolution layer and a Sigmoid space attention mechanism, presetting sensitive grade basic thresholds, correcting the sensitive grade basic thresholds in real time by combining user login authority grades and data transmission network types, carrying out differential desensitization on sensitive data of different sensitive grades if the model output confidence level reaches the corrected thresholds, calling a domain rule engine, and checking whether the desensitized data still meets the core service function of the UI interface.

Description

UI (user interface) automatic generation method and system based on natural language description Technical Field The invention relates to the technical field of text data processing, in particular to a UI (user interface) automatic generation method and system based on natural language description. Background With the rapid development of the software industry, a User Interface (UI) is used as a core carrier of man-machine interaction, and the development efficiency and the standardization degree of the UI directly influence the iteration speed of a product. In the current UI development process, a product manager or business personnel usually outputs UI requirements in natural language (such as documents and oral descriptions), but a front-end engineer needs to convert the natural language requirements into technical code logic, in the process, development results are inconsistent with expectations easily caused by understanding deviation of the requirements, and the development period is greatly prolonged by multiple times of communication and confirmation. Especially when the requirements include complex interaction logic (e.g., component linkages, data screening rules), the cost of demand alignment across roles further increases. The development of the UI interface requires front-end engineers to master HTML, CSS, JS/TS programming languages, component libraries (such as Element UI and ANT DESIGN), design specifications (such as MATERIAL DESIGN and enterprise custom specifications) and application skills, and forms a technical barrier for non-technical background products/business personnel. Meanwhile, a large number of conventional UI scenes (such as query pages and data display forms of a background management system) have repeated development work, and engineers need to repeatedly write similar codes, so that labor cost is wasted, and the problems of non-uniform interface style and compatibility are easily caused by manual coding difference. In the existing development mode, engineers are required to independently adjust layout, style and interaction logic aiming at different devices in multi-terminal (PC terminal, mobile terminal and tablet terminal) UI adaptation, and if a unified dynamic layout algorithm and a design standard support of a sub-scene are lacked, the problems of interface dislocation, abnormal functions (such as overflow of a table column of the mobile terminal, response delay of a PC terminal component) and the like are easy to occur. In the prior art, although a low-code platform can reduce UI development difficulty, a user still needs to manually drag components and configuration parameters through a visual interface, the UI can not be automatically generated directly based on natural language requirements, and part of AI auxiliary tools can only realize code generation of single components (such as buttons and input boxes) and can not identify component association relations and data field verification rules in requirements, so that the automatic generation requirements of complete UI interfaces are difficult to meet. In summary, the current UI interface development flow has the problems of low efficiency of demand transfer, high development threshold, more repeated labor, difficult multi-terminal adaptation, and the like. Disclosure of Invention The invention mainly aims to provide a UI (user interface) automatic generation method and system based on natural language description, and aims to solve the problems of low demand transfer efficiency, high development threshold and difficult multi-terminal adaptation in the current UI development process. In order to achieve the above object, the present invention provides an automatic UI interface generating method based on natural language description, comprising the following steps: Receiving a natural language demand description text, performing guided complement on fuzzy description in the demand description text, and outputting a standardized demand text comprising a UI component, data fields and interaction logic; carrying out semantic analysis on the standardized demand text, positioning functional association nodes of UI components and data fields in the text, and correcting analysis deviation through a domain knowledge graph to obtain key information comprising component parameters, field verification rules and component priorities; invoking a design specification library comprising scene vision standards and dynamic layout algorithms and a component library comprising parameterized configuration functions; Performing component matching and parameter adjustment on the basis of the key information, a design specification library and a component library to obtain a target component, and generating a front-end code or a low-code blueprint of the target component; and rendering the front-end code or the low-code blueprint to obtain a UI interface. Further, receiving a natural language requirement description text, performing guid