CN-122018875-A - Prototype page design method, electronic equipment and storage medium

CN122018875ACN 122018875 ACN122018875 ACN 122018875ACN-122018875-A

Abstract

The application relates to the technical field of artificial intelligence, and discloses a prototype page design method, electronic equipment and a storage medium. The method comprises the steps of obtaining a target design theme, associating different knowledge bases with the design theme, creating a target project file containing the knowledge base associated with the target design theme, sending design requirements to an AI Agent, enabling the AI Agent to call a corresponding artificial intelligent model by utilizing the knowledge base in the target project file according to the design requirements, generating a plurality of subtasks to be executed and executing each subtask to modify the project source code in the target project file, and constructing a script according to the project source code in the target project file after the subtasks are all completed to be executed so as to display a target prototype page generated based on target HTML codes in a user interaction interface. A prototype page of high interaction and high fidelity is automatically generated by utilizing artificial intelligence.

Inventors

FANG JIAWEI
ZHAO LIANG

Assignees

上海携宁计算机科技股份有限公司

Dates

Publication Date: 20260512
Application Date: 20251231

Claims (10)

1. A method for designing a prototype page, comprising: Acquiring target design topics selected from preset design topics by a user in a user interaction interface, wherein each preset design topic is associated with different knowledge bases, and each knowledge base at least comprises a project source code and a prototype page design strategy; creating a target project file containing the knowledge base associated with the target design topic; Acquiring design requirements input by a user on the user interaction interface; Sending the design requirement to an AI Agent, and enabling the AI Agent to call a corresponding artificial intelligent model by utilizing the knowledge base in the target project file according to the design requirement, generating a plurality of subtasks to be executed and executing each subtask so as to modify the project source code in the target project file; after the subtasks are all completed to be executed, a script is constructed according to the project source codes in the target project file, target HTML codes are generated, and a target prototype page generated based on the target HTML codes is displayed on the user interaction interface.
2. The method of claim 1, wherein the prototype page design policy comprises one or a combination of prototype design base component reference paradigm, prototype design authority policy, prototype design policy, design style of prototype design page.
3. The method of claim 1, wherein the design requirements include a first natural language or a second natural language, wherein the first natural language is a requirement description of the original page which is not generated and is input in a new dialogue, and the second natural language is a requirement description of the original page which is input in a history dialogue or a reset dialogue and is modified.
4. The prototype page design method in accordance with claim 1, wherein the design requirement comprises a presentation requirement, and the presentation requirement comprises a multi-page presentation requirement or a single-page presentation requirement; the step of constructing a script according to the project source code in the target project file to generate target HTML code comprises the following steps: Under the condition that the display requirement is the multi-page display requirement, constructing a multi-page script according to the project source codes in the target project file to generate HTML codes of all prototype pages corresponding to the project source codes as the target HTML codes, wherein the multi-page display requirement is triggered by a derivation component of the user interaction interface; under the condition that the display requirement is the single-page display requirement, constructing a single-page script according to the item source code in the target item file so as to generate an HTML code of a single prototype page as the target HTML code; The displaying, on the user interaction interface, a target prototype page generated based on the target HTML code, including: and under the condition that the display requirement is the single-page display requirement, the target prototype page generated based on the target HTML code is displayed on a single page in a preview area of the user interaction interface.
5. The prototype page design method as claimed in claim 1, wherein said sending the design requirement to an AI Agent comprises: And sending the design requirement and the item identification of the target item file to an AI Agent, and enabling the AI Agent to utilize the knowledge base in the received target item file indicated by the item identification to call a corresponding artificial intelligent model according to the design requirement, so as to generate and execute each subtask to modify the item source code in the received target item file indicated by the item identification.
6. The prototype page design method in accordance with claim 1, wherein the design requirement further comprises auxiliary data; The auxiliary data comprises one or a combination of pictures, documents and/or files uploaded through an input control of the user interaction interface, the project source codes associated with a reference control of the user interaction interface and the historical input associated with a multiplexing control of the user interaction interface.
7. The method of designing a prototype page according to any one of claims 1 to 6, further comprising: Based on SSE protocol, establishing communication connection with AI Agent; Receiving streaming text data returned by the AI Agent in the process of responding to the design requirement through the communication connection; Displaying real-time task progress information on the user interaction interface according to the streaming text data after the streaming text data is received, wherein the real-time task progress information comprises one or a combination of currently executing task content, next task content to be executed, whether the design of a prototype page is completed, information indicating the thinking process of an artificial intelligent model and information of an MCP tool to be used; And disconnecting the communication connection after determining that each subtask is completed to be executed according to the streaming text data.
8. The method of designing a prototype page according to any one of claims 1 to 6, further comprising one or a combination of the following steps: Receiving a mode request initiated by a user on the user interaction interface, constructing a script according to the mode request and the corresponding project source code, and generating an HTML code which is suitable for a prototype page display area corresponding to a terminal type indicated by the mode request, wherein the terminal type comprises a webpage end or a mobile end; Receiving a source code access request initiated by a user on the user interaction interface, and displaying the item source code in a corresponding item file on the user interaction interface according to the source code access request so as to allow the user to view, modify and/or download the displayed item source code; Receiving a rollback request initiated by a user on the user interaction interface, and displaying a task execution record of an AI Agent associated with a corresponding project file on the user interaction interface according to the rollback request; And receiving a screen capturing request initiated by a user on the user interaction interface, generating PNG data corresponding to a prototype page currently displayed on the user interaction interface according to the screen capturing request, and returning the PNG data to the user.
9. An electronic device, comprising: at least one processor, and A memory communicatively coupled to the at least one processor, wherein, The memory stores instructions executable by the at least one processor to enable the at least one processor to perform the prototype page design method of any one of claims 1 to 8.
10. A computer-readable storage medium storing a computer program, wherein the computer program, when executed by a processor, implements the prototype page design method according to any one of claims 1 to 8.

Description

Prototype page design method, electronic equipment and storage medium Technical Field The present application relates to the field of artificial intelligence technologies, and in particular, to a prototype page design method, an electronic device, and a storage medium. Background Prototype design is a process of building a product model that can simulate the appearance, functionality, and interactive behavior of the final version of the product. With the development of artificial intelligence (ARTIFICIAL INTELLIGENCE, AI) technology, a solution for automatically designing and generating prototype pages by using an artificial intelligence model in a manner of generating contents (ARTIFICIAL INTELLIGENCE GENERATED Content, AIGC) through artificial intelligence has appeared, so as to reduce the threshold of prototype design and meet the requirements of common users (such as demand analysts and the like) who do not have the related prototype code development tools. However, the prototype page generated by the artificial intelligent model has poor interactivity and low fidelity. Disclosure of Invention The application provides a prototype page design method, electronic equipment and a storage medium, which automatically generate a prototype page with high interaction and high fidelity by utilizing artificial intelligence. The first aspect of the application provides a design method of a prototype page, which comprises the steps of obtaining target design topics selected by a user from preset design topics in a user interaction interface, associating different knowledge bases with each preset design topic, creating a target project file containing the knowledge bases associated with the target design topics, obtaining design requirements input by the user in the user interaction interface, sending the design requirements to an AI Agent, enabling the AI Agent to call a corresponding artificial intelligent model according to the design requirements by utilizing the knowledge bases in the target project file, generating a plurality of subtasks to be executed, executing each subtask to modify the project source codes in the target project file, building a script according to the project source codes in the target project file after all the subtasks are completed, generating target HTML codes, and displaying the target prototype page generated based on the target HTML codes in the user interaction interface. The second aspect of the application also provides an electronic device comprising at least one processor and a memory in communication with the at least one processor, wherein the memory stores instructions executable by the at least one processor, the instructions being executable by the at least one processor to enable the at least one processor to perform the prototype page design method provided by the application. The third aspect of the present application also provides a computer readable storage medium storing a computer program which, when executed by a processor, implements the prototype page design method provided by the present application. The technical scheme provided by the application has at least the following advantages: Before invoking an artificial intelligent model, firstly creating a target project file containing a knowledge base related to a target design theme, wherein the knowledge base contains project source codes and prototype page design strategies, so that the artificial intelligent model can utilize the prototype page design strategies according to design requirements to modify the project source codes to complete the design of the prototype page, after acquiring the design requirements of a user, an AI Agent invokes the corresponding artificial intelligent model by utilizing the knowledge base to generate a plurality of subtasks to be executed and execute each subtask, repeatedly modifying the project source codes by splitting the complex design requirements of the user into a plurality of refined single requirements and repeatedly interacting with the artificial intelligent model, and further supporting the modification operation of the project source codes with more complexity, more fineness and more diversity within the context window limit of the artificial intelligent model, thereby realizing the design of the prototype page with high interaction and high fidelity through repeated and repeated modification of the project source codes. Drawings One or more embodiments are illustrated by way of example and not limitation in the figures of the accompanying drawings, in which like references indicate similar elements, and in which the figures of the drawings are not to be taken in a limiting sense, unless otherwise indicated. FIG. 1 is a flow chart of a method of designing a prototype page according to an embodiment of the present application; FIG. 2 is a partial interactive flow chart of a prototype page design method provided in another embodiment of the present application; FI