Web prototype generation method, system, device and medium
By combining WP-API encapsulation with a large language model, Web prototypes are generated, which solves the time-consuming and labor-intensive problems of existing technologies and achieves efficient Web prototype generation and optimization, suitable for individuals and enterprises.
Patent Information
- Application Number
- CN202410769709.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2024-06-14
- Publication Date
- 2025-09-30
- Estimated Expiration
- 2044-06-14
AI Technical Summary
Existing Web prototype generation methods consume a lot of time and effort, resulting in low efficiency, and large language models have the problem of generating false or erroneous information.
The current page data is filled through the virtual tree structure data TPage in the WP-API package, API parameters are extracted, and the large language model is used to perform multiple rounds of iterations to generate the API call path, and finally a web prototype is generated.
It shortens the Web prototype generation process, improves generation efficiency, and can be optimized multiple times according to user needs. It is suitable for individuals and enterprises with limited resources and can complete prototype generation without a professional team.
Smart Images

Figure CN119474579B_ABST
Abstract
Description
Technical Field
[0001] The present invention belongs to the field of computer software, relates to prototype generation technology, and specifically relates to a Web prototype generation method, system, device and medium. Background Art
[0002] A prototype is a preliminary version built during the system development process, used to demonstrate the system's design, functionality, and concepts. It's a common strategy in software development and product design, aimed at quickly showcasing a product's core features for testing, evaluation, and further iterative development. In practice, many fields require the rapid construction of prototype systems to validate ideas and concepts. For example, a web prototype is a prototype model designed specifically for web applications and services. It's used to showcase and test the layout, design, functionality, and user experience of a website or web application in the early stages of the web application and service design and development process.
[0003] However, existing methods for generating Web prototypes require a lot of time and effort. Taking the Internet product development process as an example, the process of generating Web prototypes is as follows: first, project requirements are collected. Then, designers use hand-drawn sketches to create preliminary design plans. Then, professional prototyping tools are used to create prototypes. Finally, the prototypes are modified and optimized through multiple iterations until the prototype achieves the desired effect. This process of building Web prototypes takes a long time and is inefficient.
[0004] Although in recent years, with the rapid development of artificial intelligence technology, large language models (LLMs) have provided new ideas for prototype system generation solutions and can improve prototype generation efficiency, current large language models also have some limitations. For example, there is a "hallucination" problem, that is, large models may generate seemingly reasonable but actually false, fabricated or outdated information, or erroneous and unstable code. Summary of the Invention
[0005] In order to solve the problem that the Web prototype generation method in the prior art consumes a lot of time and energy, resulting in low efficiency of Web prototype generation, the present invention designs a Web prototype generation method, which includes:
[0006] S1. Fill the virtual tree structure data TPage in the WP-API package according to the input web page requirement text and the current page data of the web page to obtain the current virtual tree structure data TPage;
[0007] S2. Extracting API parameters based on the current virtual tree structure data TPage;
[0008] S3, inputting the API document, the API parameters, and the current page data into a large language model, and performing multiple rounds of iterations to generate an API call path;
[0009] S4. Generate a Web prototype according to the API call path.
[0010] Furthermore, in the above step S1, the virtual tree structure data TPage in the WP-API package is filled according to the input web page requirement text and the current page data of the web page to obtain the current virtual tree structure data TPage, including:
[0011] S11. Parse the input web page requirement text to obtain each target element and its related content in the web page to be developed;
[0012] S12, real-time monitoring of the web page to be developed, and extraction of current page data;
[0013] S13. Based on the current page data and each target element and its related content, the virtual tree structure data TPage stored in the globally shared WP-API package is filled to obtain current virtual tree structure data TPage, wherein the current virtual tree structure data TPage includes a node corresponding to each target element, and the node includes the target element's own ID, item type, and element attributes, as well as the node's child nodes.
[0014] Furthermore, in the above S11, the target element includes a basic element, a container element and a complex element, and the relevant content of the target element includes an operation type and an attribute value, and the operation type includes any one of deletion, addition and modification.
[0015] Furthermore, in the above step S2, extracting the API parameters based on the current virtual tree structure data TPage includes:
[0016] S21, obtaining relevant information of each node in the current virtual tree structure data TPage, wherein the relevant information includes the target element's own ID, operation type, attribute value, child node ID, and parent node ID corresponding to each node;
[0017] S22. Extract and obtain API parameters based on the relevant information of each node.
[0018] Furthermore, in the above step S3, the API document, the API parameters, and the current page data are input into the large language model, and multiple rounds of iterations are performed to generate the API call path, including:
[0019] S31. Create an API document, which includes an API name, an API description, and parameter descriptions.
[0020] S32: Input the API document, API parameters, and current page data into a large language model, and generate multiple optional API call paths by prompting engineering guidelines;
[0021] S33. Extract a checklist from the web page requirement text, evaluate and score each optional API call path according to the checklist, and select the optional API call path with a score greater than or equal to a set threshold as the API call path, wherein the checklist includes an operation type, a target element type, and a target element attribute.
[0022] Furthermore, in the above step S3, the step of inputting the API document and the API parameters into a large language model and performing multiple rounds of iterations to generate an API call path further includes:
[0023] S34, determining the number of the API call paths;
[0024] S341: If the number of the API call path is 1, use the API call path as the final API call path.
[0025] S342: If the number of the API call paths is greater than or equal to 2, select the API call path with the least number of API calls as the final API call path.
[0026] In an optional embodiment, the above-mentioned Web prototype generation method further includes:
[0027] S5. Parse the input supplementary requirement text to obtain each new target element and its related content in the web page to be developed;
[0028] According to each of the new target elements and their related contents, the current virtual tree structure data TPage is updated, and the Web prototype is optimized using the updated virtual tree structure data TPage.
[0029] The present invention also designs a Web prototype generation system, which includes a user interaction window, a WP-API module, an API parameter extraction module, a WP-API call generation module, a WP-API implementation module and a Web prototype display interface.
[0030] Wherein, the user interaction window is used to input the requirement text and API document, wherein the requirement text includes the Web page requirement text and the supplementary requirement text;
[0031] The WP-API module is used to fill the virtual tree structure data TPage in the WP-API package according to the input web page requirement text and the current page data of the web page, and obtain the current virtual tree structure data TPage;
[0032] The API parameter extraction module is used to extract API parameters based on the current virtual tree structure data TPage;
[0033] The WP-API call generation module is used to input the API document, the API parameters and the current page data into the large language model, and perform multiple rounds of iterations to generate the API call path;
[0034] The WP-API implementation module is used to generate a Web prototype based on the API call path;
[0035] The Web prototype display interface is used to display the Web prototype.
[0036] The present invention also provides a computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, the computer device implements any of the aforementioned Web prototype generation methods, thereby resolving the problem in the prior art that Web prototype generation methods require a large amount of time and effort, resulting in low Web prototype generation efficiency.
[0037] The present invention also provides a computer-readable storage medium storing a computer program for executing any of the above-mentioned Web prototype generation methods, so as to solve the problem in the prior art that the Web prototype generation methods require a lot of time and effort, resulting in low efficiency of Web prototype generation.
[0038] Compared with the prior art, the beneficial effects achieved by at least one of the above-mentioned technical solutions adopted in the embodiments of this specification include at least the following: the Web prototype generation method of the present invention first fills the virtual tree structure data TPage in the WP-API package according to the requirement text and the current page data to obtain the current virtual tree structure data TPage, and extracts API parameters from the current virtual tree structure data TPage; secondly, the API call path is iteratively generated using a large language model based on the established API document, the extracted API parameters, and the current page data; finally, a Web prototype is generated and displayed based on the API call path. The method of the present invention can shorten the Web prototype generation process and improve generation efficiency.
[0039] At the same time, by inputting supplementary requirement texts multiple times, the current virtual tree structure data TPage can be continuously updated, thereby achieving multiple optimization and improvements to the Web prototype until a Web page effect that satisfies the user is obtained.
[0040] Furthermore, the method of the present invention is suitable for relatively simple user needs. For project teams that need to improve labor efficiency, the method of the present invention can be used to generate Web prototypes, which can improve processes, increase efficiency, and greatly save labor costs.
[0041] In addition, this method can also be used by enterprises and individuals with limited resources. When they have relevant needs, they can complete prototype generation without a professional team. It is a zero-threshold, high-efficiency prototype system generation platform, which is of great significance to relevant enterprises and individuals. BRIEF DESCRIPTION OF THE DRAWINGS
[0042] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the following briefly introduces the drawings required for use in the embodiments. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without any creative work.
[0043] Figure 1 A flowchart of a Web prototype generation method disclosed in an embodiment of the present invention;
[0044] Figure 2 A schematic diagram of generating an API call path through multiple rounds of iterations in an embodiment of the present invention;
[0045] Figure 3 A schematic diagram of a Web prototype generation system disclosed in an embodiment of the present invention;
[0046] Figure 4 A schematic diagram of a computer device disclosed in an embodiment of the present invention;
[0047] Among them, 301, user interaction window; 302, WP-API module; 303, API parameter extraction module; 304, WP-API call generation module; 305, WP-API implementation module; 306, Web prototype display interface; 401, memory; 402, processor. DETAILED DESCRIPTION
[0048] The embodiments of the present application are described in detail below with reference to the accompanying drawings.
[0049] The following describes the embodiments of the present application through specific examples, and those skilled in the art can easily understand other advantages and effects of the present application from the contents disclosed in this specification. Obviously, the described embodiments are only a part of the embodiments of the present application, rather than all the embodiments. The present application can also be implemented or applied through other different specific embodiments, and the details in this specification can also be modified or changed in various ways based on different viewpoints and applications without departing from the spirit of the present application. It should be noted that, in the absence of conflict, the features of the following embodiments and embodiments can be combined with each other. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without making creative work are within the scope of protection of this application.
[0050] The present invention provides a Web prototype generation method, which involves two aspects: Web prototype API (application program interface) encapsulation and API (application program interface) combination call based on a large language model. The Web prototype generation method is described in detail below through specific embodiments. Figure 1 As shown, the Web prototype generation method includes the following steps:
[0051] S1. Fill the virtual tree structure data TPage in the WP-API package according to the input web page requirement text and the current page data of the web page to obtain the current virtual tree structure data TPage;
[0052] S2. Extracting API parameters based on the current virtual tree structure data TPage;
[0053] S3, inputting the API document, the API parameters, and the current page data into a large language model, and performing multiple rounds of iterations to generate an API call path;
[0054] S4. Generate a Web prototype according to the API call path.
[0055] Before the implementation of step S1, the API (Application Programming Interface) provides unified access specifications and standards to the outside world, effectively ensuring the normal operation of the system and the correct transmission of data. This is a common method used in large-scale model projects. To meet the needs of Web prototyping, the present invention encapsulates a set of WP-API (WebPrototype API) interfaces suitable for the field of Web prototyping. This WP-API encapsulation is constructed by combining front-end technology and practical experience in Web development. It is flexible, efficient, and easy to use, and can provide convenient tools and powerful functions for subsequent processes. At the same time, this WP-API encapsulation not only has good scalability and compatibility, but also meets requirements such as web page loading speed and performance optimization, ensuring smooth operation of the Web and achieving optimal results.
[0056] When the WP-API is encapsulated during design, it is a series of operational instructions related to the Web prototype page. It can perform operations such as adding, deleting, and modifying attributes of target elements on the Web prototype page to be developed. For addition and deletion operations, the target of the operation is the entire target element; modification operations are considered to act on the specific attributes and content of the target element. Therefore, APIs can be divided into three types: adding elements, modifying attributes, and deleting elements. Because the API needs to be called in conjunction with real-time page data, recording and acquiring page data is essential to achieving the full functionality of the API. In actual use, the HTML DOM standard developed by the W3C (World Wide Web Consortium) is currently widely used. Although it can meet the above requirements, it also has obvious shortcomings. For example, the data recorded by the DOM is too complex for the API. To address this, the WP-API package in this embodiment of the present invention incorporates a layer of virtual tree-structured data (TPage) to record and monitor current page changes in real time. TPage uses TNodes as nodes, which are abstract representations of target elements used by the API. Each TNode instance records information such as the target element's ID, type, props, and child nodes. This virtual tree-structured data (TPage) allows for the most concise display and recording of API parameter information.
[0057] Furthermore, the designed WP-API can be encapsulated and stored in a globally shared store. When the API adds a target element, the system will dynamically render the corresponding modern front-end framework (such as Vue, React), such as the Vue component entering the actual web page, and at the same time add the corresponding node to TPage and start monitoring. After that, the changes to the API will only act on TPage, and each node in TPage will be monitored to complete the update of the corresponding target element.
[0058] When the above step S1 is specifically implemented, the virtual tree structure data TPage in the WP-API package is filled according to the input web page requirement text and the current page data of the web page to obtain the current virtual tree structure data TPage, including:
[0059] S11. Parse the input web page requirement text to obtain each target element and its related content in the web page to be developed.
[0060] During implementation, to meet the fundamental requirements of web prototyping while streamlining the build process and reusing common elements, the API needs to provide a diverse and extensible set of target elements as operation targets. These target elements include basic elements, container elements, and complex elements, and operation types include deletion, addition, and modification. Basic elements include images, text, buttons, and so on; container elements include headers, footers, sidebars, main containers, simple containers, and grids; and complex elements, also known as specific components, include menus, carousels, and cards. The relevant content of the target elements includes operation types and attribute values. Operation types include adding, deleting, and modifying attributes of the target element. Attribute values are common attribute values set for basic elements such as text, such as font size, color, and margins. Specific attributes provided for container elements or complex elements, such as the MenuData attribute set for the Menu component, represent the content and structure of the menu. By setting the properties of component elements, APIs can customize and adjust their appearance and functions to quickly realize customized requirements.
[0061] S12. Monitor the web page to be developed in real time and extract the current page data.
[0062] During implementation, due to the particularities of progressive, interactive web prototyping, APIs cannot be used independently and must be invoked in conjunction with real-time, current page data. For example, when adding a target element—a button—you must specify the location to add it; when modifying a paragraph of text, you must locate the target text element. An API is like a key; it must find the door to function. These are the parameters that the API must fill in. For an API that adds a target element, the API parameters must include the parent element ID, the reference sibling element name ID, the target element ID, and optional element creation options. For an API that modifies an attribute, the parameters must include the target element ID and the new value of the modified attribute. For an API that deletes an element, the target element ID must be provided.
[0063] S13. Based on the current page data and each target element and its related content, the virtual tree structure data TPage stored in the globally shared WP-API package is filled to obtain current virtual tree structure data TPage, wherein the current virtual tree structure data TPage includes a node corresponding to each target element, and the node includes the target element's own ID, item type, and element attributes, as well as the node's child nodes.
[0064] In this embodiment of the present invention, the virtual tree structure data TPage in the WP-API package can be used to record and monitor changes in the web page to be developed. This allows the information required by the API to be displayed and recorded in a most concise manner by the virtual tree structure data TPage, and allows the API parameters to be extracted. In the specific implementation of step S2, extracting the API parameters based on the current virtual tree structure data TPage includes:
[0065] S21, obtaining relevant information of each node in the current virtual tree structure data TPage, wherein the relevant information includes the target element's own ID, operation type, attribute value, child node ID, and parent node ID corresponding to each node;
[0066] S22. Extract and obtain API parameters based on the relevant information of each node.
[0067] When the above step S3 is implemented, the API document, the API parameters, and the current page data are input into the large language model, and multiple rounds of iterations are performed to generate the API call path, specifically including:
[0068] S31. Create an API document, which includes an API name, an API description, and parameter descriptions.
[0069] S32: Input the API document and API parameters into the large language model, and generate multiple optional API call paths by prompting engineering guidelines.
[0070] Generally speaking, large language models perform extremely well in natural language processing, possessing powerful understanding and reasoning capabilities, and can serve as a bridge connecting unstructured natural language and structured application data. However, due to the complexity and large scale of large language models, the results they generate are not always correct and accurate. For example, when providing APIs to large language models for invocation, false, hallucinatory knowledge may appear, affecting the normal operation of the system. Therefore, in an embodiment of the present invention, constraints are imposed through prompt engineering. This prompt engineering is low-cost and flexible, and does not require additional training or large amounts of data. It can serve as a "soft constraint" to guide the large language model in generating API call paths, thereby improving the large model's ability to call APIs under multi-source input.
[0071] S33. Extract a checklist from the web page requirement text, evaluate and score each optional API call path according to the checklist, and select the optional API call path with a score greater than or equal to a set threshold as the API call path, wherein the checklist includes an operation type, a target element type, and a target element attribute.
[0072] In specific implementations, to further ensure that the large language model generates the expected effect of API combination calls, the present invention also uses the above-mentioned steps S32 and S33 and the following step S34 to perform multiple rounds of iterations to optimize the generation process. In the first round, a variety of candidates are obtained. Then, in the second round, each path is evaluated and verified based on the original user needs to screen qualified candidates. Finally, if two or more paths are screened in the second round, the optimal path is selected in the third round as the final API call path.
[0073] Furthermore, in the above step S3, the step of inputting the API document, the API parameters, and the current page data into a large language model and performing multiple rounds of iterations to generate an API call path further includes:
[0074] S34, determining the number of the API call paths;
[0075] S341: If there is only one API call path, use it as the final API call path.
[0076] S342: If the number of the API call paths is ≥ 2, select the API call path with the least number of API calls as the final API call path.
[0077] When the above steps S32 to S34 are specifically implemented, refer to Figure 2 As shown, first, the requirement content, current page data, and API documentation are collected and added to the prompt template of the large language model to perform the first round of large model generation (gen1). Since there may be multiple implementation methods for a user requirement, the prompt of gen1 requires the large model to generate multiple pathLists for different optional API call paths. Secondly, the large language model returns a list of pathLists that implement the requirement based on gen1. After obtaining the available list of pathLists, it is necessary to perform necessary verification on each optional API call path in these list of pathLists to determine whether it meets the requirements. During the verification, the necessary verification rules are extracted from the original user requirement, and the method list (pathList) is verified one by one to obtain the second round of large model generation (gen2). After generating the rule list (ruleList), gen2 will check each optional API call path (path) in the list (pathList). The inspection content includes operation type, operation object type, and object attributes. Each inspection part is scored according to the different operation types. A threshold can be set to 0.6, and paths with a score below 0.6 are selected as available API call paths. Finally, the number of API call paths obtained after the second round of screening is determined. If there is only one, it is used as the final API call path. If there are two or more, they are screened again based on the number of calls, and the API call path with the fewest calls is selected as the final API call path. Through this multiple-round iterative process, the quality and effectiveness of the API call paths can be optimized, thereby better meeting requirements and improving overall system performance.
[0078] In an optional embodiment, the above-mentioned Web prototype generation method further includes:
[0079] S5. Parse the input supplementary requirement text to obtain each new target element and its related content in the Web page to be developed; update the current virtual tree structure data TPage based on each new target element and its related content, and optimize the Web prototype using the updated virtual tree structure data TPage.
[0080] Based on the same inventive concept, a Web prototype generation system is also provided in an embodiment of the present invention, as described in the following embodiments. Since the principle of solving the problem by the Web prototype generation system is similar to that of the Web prototype generation method in the above-mentioned embodiment, the implementation of the system can refer to the implementation of the above-mentioned Web prototype generation method, and the repeated parts will not be repeated. As used below, the term "unit" or "module" can be a combination of software and / or hardware that implements the predetermined function. Although the device described in the following embodiments is preferably implemented in software, the implementation of hardware, or a combination of software and hardware, is also possible and conceived.
[0081] Figure 3 This is a structural diagram of a Web prototype generation system according to an embodiment of the present invention. Figure 3 As shown, the Web prototype generation system includes a user interaction window 301, a WP-API module 302, an API parameter extraction module 303, a WP-API call generation module 304, a WP-API implementation module 305 and a Web prototype display interface 306. The structure is described below.
[0082] The user interaction window 301 is a dialog window for users to input requirement text and API documents. The requirement text includes Web page requirement text and supplementary requirement text.
[0083] The WP-API module 302 is used to fill the virtual tree structure data TPage in the WP-API package according to the input Web page requirement text and the current page data of the Web page, and obtain the current virtual tree structure data TPage.
[0084] The API parameter extraction module 303 is configured to extract API parameters based on the current virtual tree structure data TPage.
[0085] The WP-API call generation module 304 is used to input the API document, the API parameters and the current page data into the large language model, and perform multiple rounds of iterations to generate an API call path.
[0086] The WP-API implementation module 305 is used to generate a Web prototype according to the API call path.
[0087] The Web prototype display interface 306 is used to display the Web prototype.
[0088] The user interaction window 301, WP-API module 302, API parameter extraction module 303, WP-API implementation module 305, and Web prototype display interface 306 are all located at the system front end. The WP-API call generation module 304 is located at the system back end. The system back end is also provided with a large language model access module. The large language model access module is used to receive the API document, the API parameters, and the current page data output by the system front end. When the system back end receives a generation request, it responds and outputs the API document, the API parameters, and the current page data to the WP-API call generation module 304 to generate an API call path. The API call path is then returned to the WP-API implementation module 305 for Web prototype generation, and the generated Web prototype is displayed through the Web prototype display interface 306.
[0089] The embodiments of the present invention achieve the following technical effects: the Web prototype generation method of the present invention first fills the virtual tree structure data TPage in the WP-API package according to the requirement text and the current page data to obtain the current virtual tree structure data TPage, and extracts API parameters from the current virtual tree structure data TPage; secondly, a large language model is used to iteratively generate an API call path based on the established API document, the extracted API parameters, and the current page data; finally, a Web prototype is generated and displayed based on the API call path. The method of the present invention can shorten the Web prototype generation process and improve generation efficiency.
[0090] At the same time, by inputting supplementary requirement texts multiple times, the current virtual tree structure data TPage can be continuously updated, thereby achieving multiple optimization and improvements to the Web prototype until a Web page effect that satisfies the user is obtained.
[0091] Furthermore, the method of the present invention is suitable for relatively simple user needs. For project teams that need to improve labor efficiency, the method of the present invention can be used to generate Web prototypes, which can improve processes, increase efficiency, and greatly save labor costs.
[0092] In addition, this method can also be used by enterprises and individuals with limited resources. When they have relevant needs, they can complete prototype generation without a professional team. It is a zero-threshold, high-efficiency prototype system generation platform, which is of great significance to relevant enterprises and individuals.
[0093] In this embodiment, a computer device is provided, such as Figure 4As shown, it includes a memory 401, a processor 402 and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, any of the above-mentioned Web prototype generation methods is implemented.
[0094] Specifically, the computer device may be a computer terminal, a server or a similar computing device.
[0095] In this embodiment, a computer-readable storage medium is provided, wherein the computer-readable storage medium stores a computer program for executing any of the above-mentioned Web prototype generation methods.
[0096] Specifically, computer-readable storage media include permanent and non-permanent, removable and non-removable media that can store information by any method or technology. The information can be computer-readable instructions, data structures, program modules or other data. Examples of computer-readable storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, compact disc read-only memory (CD-ROM), digital versatile disc (DVD) or other optical storage, magnetic cassettes, tape disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device. As defined herein, computer-readable storage media does not include transitory computer-readable media (transitory media), such as modulated data signals and carrier waves.
[0097] Obviously, those skilled in the art should understand that the various modules or steps of the above-mentioned embodiments of the present invention can be implemented using a general-purpose computing device, they can be concentrated on a single computing device, or distributed across a network composed of multiple computing devices. Alternatively, they can be implemented using program code executable by the computing device, so that they can be stored in a storage device and executed by the computing device. In some cases, the steps shown or described can be performed in a different order than herein, or they can be made into separate integrated circuit modules, or multiple modules or steps can be made into a single integrated circuit module for implementation. Thus, the embodiments of the present invention are not limited to any specific combination of hardware and software.
[0098] The foregoing description is merely a preferred embodiment of the present invention and is not intended to limit the present invention. Those skilled in the art will readily appreciate that various modifications and variations of the present invention are possible. Any modifications, equivalent substitutions, or improvements made within the spirit and principles of the present invention are intended to be within the scope of protection of the present invention.
Claims
1. A Web prototype generation method, characterized in that: include: Filling virtual tree structure data TPage in a WP-API package according to input web page requirement text and current page data of the web page to obtain current virtual tree structure data TPage, including: parsing the input web page requirement text to obtain each target element and its related content in the web page to be developed; monitoring the web page to be developed in real time and extracting current page data; filling virtual tree structure data TPage stored in a globally shared WP-API package according to the current page data and each target element and its related content to obtain current virtual tree structure data TPage, wherein the current virtual tree structure data TPage includes a node corresponding to each target element, the node including the target element's own ID, item type, and element attributes, as well as child nodes of the node; Extracting API parameters based on the current virtual tree structure data TPage, including: obtaining relevant information of each node in the current virtual tree structure data TPage, the relevant information including the target element's own ID, operation type, attribute value, child node ID, and parent node ID corresponding to each node; extracting API parameters based on the relevant information of each node; Inputting the API document, the API parameters, and the current page data into a large language model, and performing multiple rounds of iterations to generate an API call path, including: establishing an API document, the API document including an API name, an API description, and a parameter description; inputting the API document, the API parameters, and the current page data into the large language model, and generating multiple API optional call paths by prompting engineering guidelines; extracting a checklist from the Web page requirement text, evaluating and scoring each of the API optional call paths according to the checklist, and selecting the API optional call path with a score ≥ a set threshold as the API call path, wherein the checklist includes an operation type, a target element type, and a target element attribute; Generate a web prototype according to the API call path.
2. The Web prototype generation method according to claim 1, characterized in that: The target element includes a basic element, a container element and a complex element. The relevant content of the target element includes an operation type and an attribute value. The operation type includes any one of deletion, addition and modification.
3. The Web prototype generation method according to claim 1, characterized in that: Also includes: Determining the number of API call paths; If the number of the API call path is 1, the API call path is used as the final API call path; If the number of the API call paths is ≥2, the API call path with the least number of API calls is selected as the final API call path.
4. The Web prototype generation method according to claim 1, characterized in that: Also includes: Parse the input supplementary requirement text to obtain each new target element and its related content in the web page to be developed; According to each of the new target elements and their related contents, the current virtual tree structure data TPage is updated, and the Web prototype is optimized using the updated virtual tree structure data TPage.
5. A Web prototype generation system, characterized in that: For implementing the method according to any one of claims 1 to 4, the system comprises: A user interaction window, wherein the user interaction window is used to input a requirement text and an API document, wherein the requirement text includes a web page requirement text and a supplementary requirement text; The WP-API module is used to fill the virtual tree structure data TPage in the WP-API package according to the input web page requirement text and the current page data of the web page, and obtain the current virtual tree structure data TPage; An API parameter extraction module, the API parameter extraction module is used to extract API parameters according to the current virtual tree structure data TPage; A WP-API call generation module, wherein the WP-API call generation module is used to input the API document, the API parameters, and the current page data into a large language model, and perform multiple rounds of iterations to generate an API call path; A WP-API implementation module, wherein the WP-API implementation module is used to generate a Web prototype according to the API call path; The web prototype display interface is used to display the web prototype.
6. A computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: When the processor executes the computer program, the Web prototype generation method according to any one of claims 1 to 4 is implemented.
7. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program for executing the Web prototype generation method according to any one of claims 1 to 4.
Citation Information
Patent Citations
Web tree component automatic generation method and device, electronic equipment and storage medium
CN115756463A
Page generation method and device, electronic equipment and storage medium
CN117435106A