Design draft generation method and device, equipment and medium

Abstract

The embodiment of the invention provides a design draft generation method and device, equipment and a medium. According to the scheme, the method comprises the steps that description information, input by a user, of a to-be-designed component is obtained; based on the description information, determining a reference design draft code corresponding to the component description matched with the description information from a preset component description database; based on the description information and the reference design manuscript code, generating a component design manuscript code of the to-be-designed component by utilizing a large language model; and converting the component design draft code into a component design draft of the to-be-designed component. According to the embodiment of the invention, the component design draft code of the to-be-designed component corresponding to the description information can be generated by using the large language model based on the description information of the user, and then the component design draft code can be converted into the component design draft of the to-be-designed component, so that the design efficiency of the design draft can be improved; and the design accuracy of the design draft can be improved.

Description

Technical Field

[0001] The embodiments of the present specification relate to the field of computer technology, and in particular to a design draft generation method, device, equipment and medium. Background Art

[0002] In actual applications, WEB, applications, applets, etc. usually need to develop and design various front-end pages to attract user attention and improve user experience.

[0003] For the specific process of front-end page development, it is usually necessary to design a design draft first, and then render and display the design draft. The design draft generally contains various components such as buttons, input boxes, drop-down menus, navigation bars, etc. When designing the component design draft in actual applications, designers need to manually select appropriate elements and manually combine and adjust these elements. However, as the requirements of front-end pages become increasingly complex, the existing design method of designers manually selecting elements for combination has become increasingly time-consuming and complicated. Summary of the invention

[0004] In view of this, an embodiment of this specification provides a design draft generation method. One or more embodiments of this specification also relate to a design draft generation device, a computing device, a computer-readable storage medium and a computer program to improve the design efficiency of the design draft.

[0005] According to a first aspect of an embodiment of this specification, a design draft generation method is provided, including: Obtaining description information of the component to be designed input by the user; Based on the description information, determining a reference design draft code corresponding to a component description matching the description information from a preset component description database; the component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description; Based on the description information and the reference design draft code, using a large language model to generate a component design draft code of the component to be designed; The component design draft code is converted into a component design draft of the component to be designed.

[0006] According to a second aspect of the embodiments of this specification, a design draft generating device is provided, including: An information acquisition module is configured to acquire description information of the component to be designed input by a user; A code determination module is configured to determine, based on the description information, a reference design draft code corresponding to a component description matching the description information from a preset component description database; the component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description; A code generation module is configured to generate a component design draft code of the component to be designed using a large language model based on the description information and the reference design draft code; The design draft conversion module is configured to convert the component design draft code into the component design draft of the component to be designed.

[0007] According to a third aspect of an embodiment of this specification, a computing device is provided, including: Memory and processor; The memory is used to store computer programs or instructions, and the processor is used to execute the computer programs or instructions. When the computer programs or instructions are executed by the processor, the steps of the above-mentioned design draft generation method are implemented.

[0008] According to a fourth aspect of the embodiments of this specification, a computer-readable storage medium is provided, which stores a computer program or instructions, and when the computer program or instructions are executed by a processor, the steps of the above-mentioned design draft generation method are implemented.

[0009] According to a fifth aspect of the embodiments of this specification, a computer product is provided, including a computer program or instructions, which implement the steps of the above-mentioned design draft generation method when executed by a processor.

[0010] At least one embodiment of this specification achieves the following beneficial effects: the embodiment of this specification can obtain the user's description information of the component to be designed, determine the reference design draft code that matches the description information based on the description information, generate the component design draft code of the component to be designed based on the description information and the reference design draft code using a large language model, and then convert the component design draft code to obtain the component design draft of the component to be designed. Based on the description information of the component to be designed input by the user, the implementation of this specification can obtain the component design draft of the component to be designed, and the design efficiency of the design draft is higher than the design method in which the user manually selects elements and manually combines and adjusts them.

[0011] On the other hand, the large language model generates component design draft code based on the reference design draft code corresponding to the component description that matches the description information. For the component to be designed corresponding to the description information, the component design draft code has a higher accuracy, thereby improving the design accuracy of the design draft. BRIEF DESCRIPTION OF THE DRAWINGS

[0012] Figure 1 It is a flow chart of a design draft generation method provided by an embodiment of this specification; Figure 2 It is a schematic diagram of part of the content of a structure tree provided by an embodiment of this specification; Figure 3 is a schematic diagram of a partial content of an adjusted structure tree provided by an embodiment of this specification; Figure 4 It is a schematic diagram of a rendering of a preset component design draft provided by an embodiment of this specification; Figure 5 It is a rendering corresponding to an HTML code provided in an embodiment of this specification; Figure 6 It is a structural schematic diagram of a design draft generating device provided by an embodiment of this specification; Figure 7 It is a structural block diagram of a computing device provided by an embodiment of this specification. DETAILED DESCRIPTION

[0013] Many specific details are described in the following description to facilitate a full understanding of this specification. However, this specification can be implemented in many other ways than those described herein, and those skilled in the art can make similar generalizations without violating the connotation of this specification, so this specification is not limited to the specific implementation disclosed below.

[0014] The terms used in one or more embodiments of this specification are only for the purpose of describing specific embodiments, and are not intended to limit one or more embodiments of this specification. The singular forms of "a", "said" and "the" used in one or more embodiments of this specification and the appended claims are also intended to include plural forms, unless the context clearly indicates other meanings. It should also be understood that the term "and / or" used in one or more embodiments of this specification refers to and includes any or all possible combinations of one or more associated listed items.

[0015] It should be understood that although the terms first, second, etc. may be used to describe various information in one or more embodiments of this specification, this information should not be limited to these terms. These terms are only used to distinguish the same type of information from each other. For example, without departing from the scope of one or more embodiments of this specification, the first may also be referred to as the second, and similarly, the second may also be referred to as the first. Depending on the context, the word "if" as used herein may be interpreted as "at the time of" or "when" or "in response to determining".

[0016] In addition, it should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in one or more embodiments of this specification are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions, and provide corresponding operation entrances for users to choose to authorize or refuse.

[0017] First, the terms involved in one or more embodiments of this specification are explained.

[0018] Design Draft: refers to the design draft of the front-end page. The design draft is a visual file created by the designer for the product design during the product development process. The design draft shows the product's appearance design in detail, such as color, font, graphics, and interface layout. In addition, the design draft also describes the product's related functions, such as how to interact with users.

[0019] Component: refers to an independent functional unit in a design system. Components can include Card Component, Button Component, Input Component, Dropdown Menu Component, and Navigation Bar Component, etc. These components are the key parts of the user's interaction with the front-end page.

[0020] Element: The basic part that makes up a component, such as icons, text, images, illustrations, symbols, etc.

[0021] Design draft code: refers to the code obtained by converting the design draft using a programming language. In actual applications, the design draft needs to be converted into design draft code to complete the front-end page design.

[0022] Design Draft Rendering: refers to the image obtained by rendering the design draft through rendering technology. For example, the design draft can be rendered into a design draft rendering through the design platform. The design draft rendering is the final effect picture presented to the user.

[0023] Structure tree: a model used to describe and organize the hierarchical relationship of the content in the design. The structure tree shows all the contents in the design from the top to the bottom in hierarchical order, such as components, elements, etc. The structure tree of the design appears in the form of a tree diagram, in which each node represents a specific content in the design, and the connecting lines between the nodes represent the hierarchy and relationship between the contents.

[0024] HTML (Hyper Text Mark-up Language); a standard markup language for creating web pages. Often used to design user interfaces for web pages, web applications, and mobile applications.

[0025] Large Language Model (LLM): refers to a deep learning model that is pre-trained on a large corpus using autoregression in the field of natural language processing (NLP). It can understand and generate natural language text. The large language model can predict the next word or sentence by learning the statistical laws and semantic information of natural language text. As the input data set and parameter space continue to expand, the capabilities of the large language model will also expand accordingly. It can be applied to a variety of fields such as machine learning, machine translation, speech recognition, and image processing.

[0026] In this specification, a design draft generation method is provided. This specification also relates to a design draft generation device, a computing device, a computer-readable storage medium and a computer program product, which are described in detail one by one in the following embodiments.

[0027] See also Figure 1 , Figure 1 This is a flowchart of a method for generating a design draft provided by an embodiment of this specification. From a program perspective, the execution subject of the process can be a program installed on a server or a design platform. From a hardware perspective, the execution subject of the process can be a server or a design platform that can perform design draft design. The method can specifically include the following steps.

[0028] Step 102: Obtain description information of the component to be designed input by the user.

[0029] In the embodiment of this specification, the user may input description information of the component to be designed to the server or design platform, etc., so that the server or design platform obtains the description information of the component to be designed.

[0030] Optionally, the component to be designed may be a component that a user needs to design, such as a card component, a button component, an input box component, a drop-down menu component, or a navigation bar component.

[0031] In the embodiments of this specification, the description information may be used to input into a large language model to instruct the large language model to generate a component design draft code of the component to be designed corresponding to the description information.

[0032] As an implementation method, the description information may include at least one of appearance information, shape information, layout information, content information, function information, and information on how to interact with users of the component to be designed. For example, if the component to be designed is a button component, the description information may be "a black circle containing a saved text label. When the user clicks the saved text label, the content in the current page is saved."

[0033] In order to simplify the description information and improve its effectiveness, the description information may optionally include the component name of the component to be designed and the element name of each element in the component to be designed. For example, if the component to be designed is a card component, the description information may be "a card including an image, a title, an avatar, and a like icon".

[0034] As an implementation method, the description information may also include design specifications and design requirements for the component to be designed, etc. Thus, the large language model may be instructed to generate component design draft code that meets the design specifications and design requirements, thereby improving the effectiveness of the component design draft finally generated.

[0035] Step 104: Based on the description information, determine a reference design draft code corresponding to a component description matching the description information from a preset component description database; the component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description.

[0036] In practical applications, a component description database may be pre-set, and the component data description database may include existing preset design draft codes and preset component descriptions corresponding to the existing preset design draft codes.

[0037] Specifically, you can first obtain the component design draft rendering and the design draft code corresponding to the component design draft rendering. For example, you can obtain the component design draft rendering and the design draft code corresponding to the component design draft rendering from an existing code database. Alternatively, you can parse the existing component design draft in the component design platform to obtain the existing design draft code; render the existing design draft code to obtain the design draft rendering, and so on. After that, based on the design draft rendering, you can use a network model or manual to generate a component description of the component corresponding to the design draft rendering. Then, the obtained component design draft code and component description are associated and stored as a set of data, and a component data description library containing the set of data can be obtained.

[0038] In the embodiment of this specification, the component description database may include a set of data, which may include a preset component description and a preset design draft code corresponding to the preset component description. Optionally, the component description database may also include multiple sets of data, etc.

[0039] In actual applications, a component description matching the description information may be first determined from a component description database, and then a reference design draft code corresponding to the component description matching the description information may be determined based on the component description matching the description information.

[0040] In an embodiment of the present specification, the description information input by the user may be description information corresponding to a preset component description in a component description database. This is to facilitate determining a component description that matches the description information from the component description database. For example, the preset component description may include at least one of the component's appearance information, shape information, layout information, content information, functional information, and information on how to interact with the user. The description information input by the user may include at least one of the appearance information, shape information, layout information, content information, functional information, and information on how to interact with the user of the component to be designed. Alternatively, the preset component description may include the component name and the element names of each element in the component, etc. The description information input by the user may include the component name of the component to be designed and the names of each element in the component to be designed, etc.

[0041] Optionally, the preset design draft code in the component description database can be used for reference by the large language model to generate the component design draft code of the component to be designed corresponding to the description information. Therefore, in order to enable the large language model to generate the component design draft code that meets the preset design specification, the preset design draft code in the component description database can be a design draft that meets the preset design specification.

[0042] In practical applications, a reference design draft code corresponding to a component description matching the description information can be determined from a preset component description database using a network model or similarity algorithm. Optionally, the reference design draft code obtained can be one section of design draft code or multiple sections of design draft code, which is not limited here.

[0043] As an implementation manner, the preset design draft code in the component description database may be at least one of HTML code, CSS (Cascading Style Sheets) code and JavaScript code.

[0044] Step 106: Based on the description information and the reference design draft code, a component design draft code of the component to be designed is generated using a large language model.

[0045] In the embodiments of this specification, the large language model may be a model of the GPT series, such as GPT-3.5, GPT-4, and GPT-4o, etc. The large language model may also be a model of other series, such as the Tongyi Qianwen model, the Ant Bailing large model, etc., which are not limited here.

[0046] In actual applications, the description information and the reference design draft code may be spliced ​​into prompt words for inputting into the large language model to instruct the large language model to generate the component design draft code of the component to be designed corresponding to the description information.

[0047] Specifically, the prompt word can be obtained based on the prompt word template. The prompt word template may include a part for filling in the description information and a part for filling in the reference design draft code. For example, a specific prompt word template may be "reference design draft code 1, reference design draft code 2...reference design draft code n, the above are reference design draft codes that can be referenced. Please refer to the above reference design draft code to perform code design for "{user-desc}". The "reference design draft code 1, reference design draft code 2...reference design draft code n" in the above prompt word template are used to fill in each reference design draft code, for example, it can be used to fill in n sections of reference design draft code; {user-desc} is used to fill in the description information. In actual applications, the prompt word template may also include information for instructing the large language model to refer to the reference design draft code to generate a component design draft code corresponding to the description information, such as "the above are reference design draft codes that can be referenced. Please refer to the above reference design draft code to perform code design for "{user-desc}"" in the above prompt word template.

[0048] In the embodiment of this specification, the prompt word obtained based on the prompt word template may include description information, reference design draft code, and information for instructing the large language model to refer to the reference design draft code to generate a component design draft code corresponding to the description information.

[0049] Step 108: Convert the component design draft code into a component design draft of the component to be designed.

[0050] In the embodiment of this specification, the component design draft code can be first converted into the basic layer of the component design draft of the component to be designed, and then the component design draft of the component to be designed is generated based on the basic layer of the component design draft of the component to be designed.

[0051] The design draft is composed of multiple basic layers, such as background layer, text layer, image layer, etc. In the embodiment of this specification, the code conversion software can be used to convert the component design draft code into each basic layer of the component design draft. Then, based on the component design platform, each basic layer can be combined into a component design draft of the component to be designed.

[0052] In actual applications, designers can fine-tune the generated component design draft according to their own usage requirements, or they can use it directly. Specifically, the component design draft can be used to design the front-end page design draft and then build the front-end page.

[0053] The embodiment of the present specification can obtain a component design draft of the component to be designed based on the description information of the component to be designed input by the user, thereby avoiding manual operations of manually selecting elements and manually combining and adjusting them, and improving the design efficiency of the design draft.

[0054] Moreover, the component design draft code of the component to be designed can be generated by the large language model based on the reference design draft code corresponding to the component description that matches the description information. The reference design draft code is targeted at the description information input by the user. Therefore, for the component to be designed corresponding to the description information, the component design draft code has high accuracy, so that a highly accurate component design draft can be generated based on the component design draft code.

[0055] based on Figure 1 The method, the examples of this specification also provide some specific implementation plans of the method, which are described below.

[0056] In the embodiment of this specification, the preset design draft code can be obtained by parsing the existing preset component design draft. Then, the preset design draft code and the preset component description of the component corresponding to the existing preset component design draft can be stored in association to obtain a component description database. Optionally, before determining the reference design draft code corresponding to the component description matching the description information from the preset component description database based on the description information, the method can also include: Get the preset component design draft.

[0057] The preset component design draft is parsed to obtain a preset design draft code corresponding to the preset component design draft.

[0058] Obtain a preset component description of a component corresponding to the preset component design draft.

[0059] The preset design draft code and the preset component description are stored in association with each other to obtain the component description database.

[0060] In practical applications, the preset component design draft may be a design draft located in a component design platform. The preset component design draft located in the component design platform may be obtained based on an opening operation of the preset component design draft in the component design platform.

[0061] In the embodiment of this specification, the preset design draft code corresponding to the preset component design draft may be an HTML code. The preset component design draft may be parsed to obtain the HTML code corresponding to the preset component design draft. Optionally, the preset component design draft is parsed to obtain the preset design draft code corresponding to the preset component design draft. Specifically, it may include: Generate a structure tree corresponding to the preset component design draft; each node in the structure tree represents each element in the component corresponding to the preset component design draft; Based on each node in the structure tree, generate HTML tags corresponding to each element and attributes of each HTML tag; Based on the HTML tags and the attributes of each of the HTML tags, the HTML code corresponding to the preset component design draft is obtained.

[0062] In the embodiments of this specification, the structure tree corresponding to the component design draft is a model used to describe the hierarchical relationship of the component content. The structure tree of the component design draft appears in the form of a tree diagram, in which each node represents a specific element of the component, and the connecting lines between the nodes represent the hierarchy and relationship between the elements.

[0063] In actual applications, a structure tree corresponding to a preset component design draft can be generated based on the component design platform. Figure 2 Schematic diagram of part of the structure tree provided by one embodiment of this specification. Figure 2 As shown, Figure 2 It represents a schematic diagram of the structure tree corresponding to the design draft of a card component, where Card represents the card component node, Content represents the content, like_nums represents the number of likes, heart represents the heart-shaped icon, Frame represents the card frame, titles represents the title, rectangle represents the shape of the card is a rectangle, etc.

[0064] Optionally, the structure tree can be adjusted based on the component design platform. For example, the structure tree can be adaptively adjusted based on the "automatic layout" function in the component design platform to adjust the positional relationship between each node and each element in the structure tree, so that the adjusted structure tree layout can expand or shrink its size as needed to fill the available space of the page where the structure tree is located in the best way. Figure 3 FIG. 1 is a schematic diagram of a partial content of an adjusted structure tree provided by an embodiment of this specification. Figure 3 As shown, the card component nodes in the adjusted structure tree can be displayed in the adjusted form.

[0065] As a specific implementation, each node of the structure tree may be parsed based on the component design platform to obtain HTML tags corresponding to each element in the component corresponding to the preset component design draft and the attributes of each HTML tag.

[0066] In actual applications, HTML code contains a variety of HTML tags. Different HTML tags are used to describe different parts of the page. Based on the content of each HTML tag, you can build various parts of the page. For example, for Tags can describe images on a page, based on Tags can construct images in the page; for Tags can describe hyperlinks in pages, based on Tags can construct hyperlinks in pages, etc. In addition, HTML tags can also contain attributes, which are used to provide additional information about HTML tags. For example The src attribute of the tag can be used to specify the source of the image, for example, a URL (Uniform Resource Locator). The href attribute of the tag can be used to specify the URL of the hyperlink target. The value of the href attribute can be any valid document relative or absolute URL.

[0067] Specifically, the non-leaf nodes in the structure tree, except for icons and illustrations, can be converted to Label. The tag represents a block-level element, which is used to group and layout components on a page. Figure 3 The "titles" node in is converted to Label.

[0068] You can convert illustration nodes and image nodes to Tags. Figure 3 The "heart" node in is converted to Tags. Alternatively, you can use tools that provide image placeholders such as "https: / / placehold.co / " The src attribute of the tag and set it specifically The tags correspond to the width and height of illustrations and images.

[0069] You can convert icon nodes to represent italic text. Tag. You can parse the name of the icon corresponding to the icon node, for example, you can use {icon-name} to represent it. Furthermore, you can use icon libraries such as Font Awesome to fill The class attribute of the tag. The class attribute is a global attribute that can be applied to any HTML tag and is used to specify one or more class names of the HTML tag. The filled class attribute can be <i class=""fas" fa-play”> , where fas and fa-play are two specific class names.

[0070] The labels of the rounded corners, borders, and filled nodes can be represented based on the Tailwind CSS framework, and the CSS properties of the labels of the rounded corners, borders, and filled nodes can be set.

[0071] Furthermore, you can convert the "automatic layout" in the component design platform to a flex layout and set the flex attribute of each tag. Flex layout is the abbreviation of Flexible Box. Flex layout allows nodes to expand or shrink their size as needed to fill the available space in the best way. The flex attribute can represent the size of each node in the component design platform.

[0072] In actual applications, codes can be used to represent each node in the structure tree. However, the codes are generally cumbersome and difficult to understand. In order to facilitate the processing of the structure tree, the nodes in the structure tree can be labeled in advance before generating the HTML tags corresponding to each element and the attributes of each HTML tag. The labeling can be a name conversion of the name of the node in the structure tree. For example, for the icon node in the structure tree, the name of the icon node can be modified to "Icon#{icon-name}", where "{icon-name}" represents the icon node before modification, and "Icon" represents the modified content of the icon node. For example, for Figure 3 In "Iocn#heart", "heart" in "Iocn#heart" indicates the heart icon node before modification, and "Icon" in "Iocn#heart" indicates the modified content of the heart icon node. For another example, for an illustration node, you can add the prefix "Illustration#" before its original name, and so on.

[0073] Furthermore, HTML code may be written based on the generated HTML tags corresponding to each element and the attributes of each HTML tag, so that the HTML code corresponding to the preset component design draft may be obtained.

[0074] Figure 4 Schematic diagram of a preset component design draft rendering provided by an embodiment of this specification. Figure 4 As shown, Figure 4 The preset component design draft rendering in the can be obtained by rendering the preset component design draft, and the preset component design draft can be Figure 2 Corresponding card component design draft. Figure 5 This is a rendering corresponding to an HTML code provided by an embodiment of this specification. Figure 5 As shown, Figure 5 The rendering in the figure is obtained by converting the HTML code corresponding to the card component design draft. Figure 5 The part represented by "175×233" is the result of rendering the image placeholder in the HTML code of the card component design. "175×233" can represent the image placeholder corresponding to Figure 4 The size of the image in the Figure 5 The "heart-shaped icon" in the figure is obtained by rendering the relevant code of the heart-shaped icon node in the HTML code of the card component design draft; Figure 5 The avatar icon on the left side of "Understand" is obtained by rendering the avatar icon node related code in the HTML code of the card component design draft.

[0075] In order to improve the accuracy and acquisition efficiency of the preset component description, in the embodiments of this specification, a large language model can be used to obtain the preset component description. Optionally, the obtaining of the preset component description of the component corresponding to the preset component design draft may specifically include: Generate a component design draft rendering corresponding to the preset component design draft.

[0076] Based on the component design draft rendering, a second prompt word for inputting a second language model is constructed; the second prompt word is used to instruct the second language model to generate a preset component description for the component design draft rendering.

[0077] The second prompt word is input into the second largest language model to obtain the preset component description generated by the second largest language model.

[0078] In actual applications, a component design draft rendering corresponding to a preset component design draft can be generated based on the component design platform. For example, the preset component design draft can be exported from the component design platform to obtain a component design draft rendering.

[0079] In the embodiment of this specification, the second largest language model can be used to generate a preset component description based on the preset component design draft rendering. For example, the second prompt word of the second largest language model can be constructed based on the preset component design draft rendering. The second prompt word can include the preset component design draft rendering and information for instructing the second largest language model to generate a preset component description corresponding to the preset component design draft rendering. For example, a specific second prompt word can be " Preset component design draft rendering img This is a design draft rendering of a component. Ignoring the specific style and layout in the picture, please describe the content of this component in one sentence."

[0080] In the second prompt word, "preset component design draft rendering img" can represent the preset component design draft rendering provided by the user. Figure 4 is a schematic diagram of a preset component design draft rendering provided by an embodiment of this specification, such as Figure 4 As shown, Figure 4 It can represent a specific card component design draft rendering. "This is a component design draft rendering. Ignore the specific style and layout in the figure. Please describe the content of this component in one sentence." can represent information used to instruct the second largest language model to generate a preset component description corresponding to the preset component design draft rendering.

[0081] For the second prompt word, the second largest language model may output "a card including an image, a title, an avatar, and a like icon". Then, "a card including an image, a title, an avatar, and a like icon" may be used as the component description corresponding to the preset component design draft rendering provided by the user.

[0082] In the embodiments of this specification, the second language model can also be used to generate a description of the preset component based on the HTML code corresponding to the preset component design draft. For example, the second prompt word of the second language model can be constructed based on the HTML code corresponding to the preset component design draft. The second prompt word can include the HTML code corresponding to the preset component design draft and information for instructing the second language model to generate the preset component description corresponding to the HTML code. For example, a specific second prompt word can be " HTML Code This is the HTML code of a component. Please describe the content of the component corresponding to this HTML code in one sentence."

[0083] In the second prompt word, "HTML code" may represent the HTML code corresponding to the preset component design draft provided by the user. "This is the HTML code of a component. Please describe the content of the component corresponding to this HTML code in one sentence" may represent information for instructing the second language model to generate a preset component description corresponding to the preset component design draft rendering.

[0084] For the second prompt word, the second largest language model may also output "a card including an image, a title, an avatar, and a like icon". The content output by the large language model may then be used as a preset component description.

[0085] Since the large language model is a natural language processing model based on deep learning, it is better at text processing. HTML code is data in text form, so compared with generating a preset component description based on a preset component design draft rendering, the preset component description can be generated more accurately based on the HTML code corresponding to the preset component design draft. On the other hand, the large language model requires more computing resources for image processing, so compared with the preset component design draft rendering, the preset component description can be generated more efficiently based on the HTML code corresponding to the preset component design draft.

[0086] In order to improve the accuracy of the preset component description generated by the large language model, in a specific embodiment, the preset component description can also be generated using the second largest language model based on the component design draft rendering and the HTML code corresponding to the preset component design draft. Optionally, the second prompt word for inputting the second largest language model based on the component design draft rendering can specifically include: Based on the component design draft rendering and the preset design draft code corresponding to the preset component design draft, a second prompt word for inputting the second largest language model is constructed.

[0087] Specifically, the component design draft rendering and the preset design draft code corresponding to the preset component design draft can be spliced ​​together, such as placing the component design draft rendering before the preset design draft code corresponding to the preset component design draft, or placing the preset design draft code corresponding to the preset component design draft before the component design draft rendering, etc., to construct the second prompt word. The second prompt word may include the component design draft rendering, the preset design draft code corresponding to the preset component design draft, and information for instructing the second largest language model to generate a description of the preset component corresponding to the component design draft rendering and / or the preset component design draft.

[0088] In the embodiments of this specification, the second largest language model may be a model of the GPT series, such as GPT-3.5, GPT-4, and GPT-4o, etc. The large language model may also be a model of other series, such as the Tongyi Qianwen model, the Ant Bailing large model, etc., which are not limited here.

[0089] As an implementation method, the preset component description can also be obtained manually. For example, a component design draft rendering corresponding to the preset component design draft can be generated first, and then the preset component description corresponding to the component design draft rendering can be obtained manually.

[0090] As an implementation method, a pre-trained network model can also be used to obtain a preset component description. For example, a component design draft rendering corresponding to the preset component design draft can be generated first, and then the pre-trained network model can be used to obtain the preset component description corresponding to the component design draft rendering. Specifically, the pre-trained network model can be a model that outputs a component description corresponding to the component design draft rendering based on the component design draft rendering. The pre-trained network model can be trained based on a training sample that includes a component design draft rendering and a component description corresponding to the component design draft rendering.

[0091] In the embodiments of this specification, the component description database can also be constructed based on an existing code database. Specifically, the existing code database may include a component design draft rendering and a preset design draft code corresponding to the component design draft rendering. Based on the component design draft rendering in the existing code database, the preset component description of the component corresponding to the component design draft rendering can be generated by using at least one of the second largest language model, artificial or pre-trained network model mentioned above. Afterwards, the obtained preset component description and the preset design draft code in the existing code database can be associated and stored to obtain a component description database.

[0092] In practical applications, when determining the reference design draft code from the component description database, the component description matching the description information may be determined first, and then the reference design draft code may be determined based on the determined component description. Optionally, determining the reference design draft code corresponding to the component description matching the description information from a preset component description database based on the description information may specifically include: Based on the description information, a component description matching the description information is determined from a preset component description database.

[0093] A reference design draft code corresponding to the component description is determined from a preset component description database.

[0094] As an implementation method, in order to improve the efficiency of determining the component description, a large language model may be used to determine the component description. Optionally, the component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description. Based on the description information, determining a component description matching the description information from a preset component description database may specifically include: A plurality of preset component descriptions in the component description database is obtained.

[0095] The multiple preset component descriptions are concatenated with the description information to obtain a third prompt word for inputting a third language model; the third prompt word is used to instruct the third language model to filter component descriptions that match the description information from the multiple preset component descriptions.

[0096] The third prompt word is input into the third language model to obtain a component description determined by the third language model and matching the description information.

[0097] In the embodiment of the present specification, the component description database may include multiple groups of data. Any of the multiple groups of data may include a preset component description and a preset design draft code corresponding to the preset component description. Acquiring multiple preset component descriptions in the component description database may be acquiring all preset component descriptions in the component description database, or may be acquiring some preset component descriptions in the component description database, wherein the some preset component descriptions may be at least one preset component description.

[0098] In the embodiments of this specification, multiple preset component descriptions and description information can be spliced ​​together, such as placing multiple preset component descriptions before description information, or placing description information before multiple preset component description information, etc., to obtain a third prompt word. The third prompt word may include multiple preset component descriptions, description information, and information for instructing the third large language model to filter component descriptions that match the description information from multiple preset component descriptions. Optionally, the third prompt word may also include information for indicating the number of component descriptions generated by the large language model. A specific third prompt word may be " Component description 1, component description 2, component description 3...component description n. The above are the component descriptions in the database. Now, I am designing a new component. Please refer to "a card containing an image, a title, an avatar, and a like icon" and select no more than 10 component descriptions that can be used as reference from the database.

[0099] The multiple preset component descriptions may be n component descriptions. "A card, including an image, a title, an avatar, and a like icon" indicates description information, "select no more than 10 component descriptions that can be used for reference from the database" indicates information for instructing the third largest language model to select component descriptions that match the description information from multiple preset component descriptions, and "no more than 10" indicates the number of component descriptions generated by the large language model.

[0100] Further, the third prompt word can be input into the third largest language model to obtain a component description determined by the third largest language model and matching the description information. Optionally, the third largest language model can be the same large language model as the second largest language model, or the third largest language model can be a large language model different from the second largest language model, which is not limited here.

[0101] In practical applications, the large language model has a maximum context length limit. The maximum context length refers to the maximum number of characters or tokens that the large language model can process at one time. If the prompt word input to the large language model exceeds the maximum context length of the large language model, it will affect the data processing quality of the large language model, or cause the large language model to be unable to output information. Therefore, it is necessary to input prompt words that meet the maximum context length of the large language model into the large language model. Optionally, the acquisition of multiple preset component descriptions in the component description database may specifically include: It is determined whether the data volume of the preset component description included in the component description database is greater than a preset data volume threshold; the preset data volume threshold corresponds to the maximum context length that can be processed by the third largest language model at a single time.

[0102] If the data volume of the preset component description included in the component description database is greater than the preset data volume threshold, a first data volume of preset component description is selected from the component description database; the first data volume is less than or equal to the preset data volume threshold.

[0103] In the embodiment of this specification, the data amount of the preset component description may refer to the number of characters in the preset component description.

[0104] The preset data volume threshold corresponds to the maximum context length that the third largest language model can process at one time, which can indicate that the preset data volume threshold can be set based on the maximum context length that the third largest language model can process at one time. For example, the preset data volume threshold can be less than the maximum context length. Or the preset data volume threshold can be equal to the maximum context length, etc.

[0105] Optionally, if the amount of data of the preset component description included in the component description database is greater than the preset data amount threshold, the preset component description of the first data amount that is less than or equal to the preset data amount threshold can be selected, so that a prompt word that meets the maximum context length of the large language model can be constructed to ensure the performance of the large language model.

[0106] Optionally, if the data volume of the preset component description included in the component description database is less than or equal to a preset data volume threshold, all preset component descriptions in the component data description database may be obtained, and the preset component descriptions and the description information may be concatenated into a third prompt word.

[0107] In practical applications, in order to improve the accuracy of the obtained component description, the preset component descriptions in the component description database can be spliced ​​into prompt words in batches. The large language model can output component descriptions multiple times, so that the final component description can be determined based on the component descriptions output multiple times by the large language model. Optionally, the component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description. Based on the description information, determining the component description that matches the description information from the preset component description database can specifically include: Divide multiple preset component descriptions in the component description database to obtain multiple preset component descriptions; the data volume of any one of the multiple preset component descriptions is less than or equal to a preset data volume threshold; the preset data volume threshold corresponds to the maximum context length that can be processed by the third largest language model at a single time.

[0108] For each of the multiple preset component descriptions, the following steps are performed respectively: concatenating a preset component description with the description information to obtain a third prompt word corresponding to the preset component description and used to input the third largest language model; the third prompt word is used to instruct the third largest language model to determine a component description matching the description information from the preset component description; and inputting the third prompt word into the third largest language model to obtain a single component description corresponding to the preset component description output by the third largest language model.

[0109] The single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined to obtain a component description matching the description information.

[0110] In the embodiments of this specification, any preset component description may include one preset component description or multiple preset component descriptions.

[0111] In practical applications, the reference design draft code corresponding to the component description can be determined based on the component description, so that the reference design draft code can be constructed into a prompt word for inputting the first language model to instruct the first language model to refer to the reference design draft code to generate the component design draft code of the component to be designed corresponding to the description information. If the number of component descriptions obtained by combining a single component description is too large, too many reference design draft codes will be obtained, so that the constructed first prompt word may exceed the maximum context length that the first language model can process at a time, affecting the generation effect of the component design draft code. Therefore, component descriptions within a preset number threshold range can be obtained. Optionally, the single component descriptions corresponding to each of the multiple preset component descriptions are combined to obtain a component description that matches the description information, which may specifically include: The single component descriptions respectively corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined to obtain a component description set.

[0112] It is determined whether the number of component descriptions included in the component description set is greater than a preset number threshold.

[0113] If the number of component descriptions included in the component description set is greater than the preset number threshold, component descriptions less than or equal to the preset number threshold are determined from the component description set.

[0114] The single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined, and each single component description is placed in the same storage location, such as the same folder, etc., so as to obtain a component description set.

[0115] If the number of component descriptions in the component description set is greater than a preset number threshold, component descriptions less than or equal to the preset number threshold can be selected. For example, the method of determining component descriptions that match the description information from a preset component description database can be referred to in the previous text, and a large language model can be used to determine component descriptions less than or equal to the preset number threshold from the component description set. Or, using similarity algorithms such as cosine similarity algorithms, Jaccard similarity algorithms, text matching algorithms based on deep learning, etc., component descriptions less than or equal to the preset number threshold that have the highest degree of similarity with the description information can be selected from the component description set. Alternatively, component descriptions less than or equal to the preset number threshold can be randomly selected from the component description set, and so on.

[0116] Optionally, if the number of component descriptions contained in the component description set is less than or equal to a preset number threshold, all component descriptions in the component description set can be used to determine the reference design draft code corresponding to all the component descriptions, and then the large language model can be used to generate the component design draft code of the component to be designed.

[0117] In the embodiment of this specification, in addition to using the third language model to determine the component description that matches the description information, a similarity algorithm can also be used to determine the component description that matches the description information. Optionally, based on the description information, determining the component description that matches the description information from a preset component description database can specifically include: Based on the description information, a component description having a degree of similarity with the description information greater than or equal to a preset similarity threshold is determined from a preset component description database using a similarity algorithm.

[0118] Optionally, the similarity algorithm used may be an algorithm for calculating similarities between texts, such as a cosine similarity algorithm, a Jaccard similarity algorithm, a text matching algorithm based on deep learning, and the like.

[0119] As an implementation mode, in order to simplify the description information input by the user, the preset component description in the component database may include the component name and the element name of each element in the component. In this way, the user can input the component name of the component to be designed and the element name of each element in the component to be designed. Then, a preset component description matching the component name and element name input by the user can be determined from the component database. Optionally, the description information includes the component name of the component to be designed and the element name of each element in the component to be designed. The determination of the component description matching the description information from the preset component description database based on the description information may specifically include: Based on the description information, a component description matching the component name and the element name is determined from a preset component description database.

[0120] Optionally, the aforementioned large language model may be used to determine the component description that matches the component name and the element name. The aforementioned similarity algorithm may also be used to determine the component description that matches the component name and the element name. This is not limited here.

[0121] In practical applications, based on the index of the component description that matches the description information, a reference design draft code corresponding to the component description that matches the description information can be obtained from a component description database. Optionally, based on the description information, determining the reference design draft code corresponding to the component description that matches the description information from a preset component description database can specifically include: Based on the description information, an index of a component description matching the description information is determined from a preset component description database.

[0122] Based on the index, a reference design draft code corresponding to the index is obtained from a preset component description database.

[0123] Optionally, the preset component description may include an index, which includes a correspondence between the preset component and a preset design draft code corresponding to the preset component.

[0124] In practical applications, the third language model may be used to determine the index of the component description matching the description information. For example, the third prompt word may include information for indicating the index of the component description matching the description information determined by the third language model.

[0125] In order to enable the large language model to generate a component design draft code that meets the preset design specifications of the component to be designed, thereby obtaining a component design draft that meets the design specifications, the reference design draft code in the embodiment of this specification may be a design draft code that meets the preset design specifications. Optionally, based on the description information, determining the reference design draft code corresponding to the component description matching the description information from a preset component description database may specifically include: Based on the description information, a reference design draft code that complies with a preset design specification and corresponds to a component description that matches the description information is determined from a preset component description database.

[0126] The generating the component design draft code of the component to be designed by using the large language model based on the description information and the reference design draft code may specifically include: Based on the description information and the reference design draft code, a large language model is used to generate a component design draft code of the component to be designed that meets the preset design specification.

[0127] In the embodiment of the present specification, the reference design draft code corresponding to the component description that matches the description information determined from the component description database may be a reference design draft code that meets the preset design specification. Thus, the large language model can refer to these reference design draft codes that meet the preset design specification to generate a component design draft code that meets the preset design specification. This avoids errors such as non-compliance with component design specifications that occur during manual design, improves the design accuracy of the component design draft code, and thus can improve the design accuracy of the design draft.

[0128] In the embodiment of this specification, the component design draft code of the component to be designed corresponding to the description information can be generated based on the reference design draft code corresponding to the component description that matches the description information. Optionally, the component design draft code of the component to be designed is generated using a large language model based on the description information and the reference design draft code, which may specifically include: The description information and the reference design draft code are concatenated to obtain a first prompt word for inputting a first large language model; the first prompt word is used to instruct the first large language model to generate the component design draft code corresponding to the description information with reference to the reference design draft code.

[0129] The first prompt word is input into the first large language model to obtain the component design draft code generated by the first large language model.

[0130] When splicing the description information and the reference design draft code, the description information may be placed before the reference design draft code, or the reference design draft code may be placed after the description information, etc.

[0131] The first prompt word may include description information, reference design draft code, and information for instructing the first language model to generate component design draft code corresponding to the description information with reference to the reference design draft code. A specific first prompt word may be "reference design draft code 1, reference design draft code 2...reference design draft code n. The above are reference design draft codes for reference. Please refer to the above reference design draft code to design the code for "a card containing an image, title, avatar, and like icon". Please strictly follow the style of the reference provided, including color, font weight, font size, line spacing, padding, margins, and corner radius. The design should be unique and creative, with similar complexity and beauty to the provided reference."

[0132] Among them, reference design draft code n can represent n sections of reference design draft code, and "a card, including an image, a title, an avatar, and a like icon" can represent description information. "The above is a reference design draft code that can be used for reference. Please refer to the above reference design draft code and design the code for "a card, including an image, a title, an avatar, and a like icon"" can represent information used to instruct the first language model to refer to the reference design draft code to generate a component design draft code corresponding to the description information.

[0133] Optionally, the first prompt may also include design requirement information. For example, the first prompt includes "Please strictly follow the style of the reference provided, including color, font weight, font size, line spacing, padding, margins, and corner radius. The design should be unique and creative, with similar complexity and beauty to the reference provided."

[0134] The first language model may be the same model as the third language model, or the first language model may be a different model from the third language model, etc., which is not limited here.

[0135] In practical applications, the component design draft code may be converted to obtain the component design draft of the component to be designed. Optionally, the converting of the component design draft code into the component design draft of the component to be designed may specifically include: The component design draft code is converted into a basic layer of the component design draft of the component to be designed.

[0136] Based on the basic layer of the component design draft of the component to be designed, the component design draft of the component to be designed is generated.

[0137] In the present embodiment, the component design draft code can be converted into the basic layers of the component design draft by using the code conversion software. Then, the basic layers of the component design draft can be combined into the component design draft of the component to be designed based on the component design platform.

[0138] In actual applications, designers can fine-tune the generated component design draft according to their own needs, or they can use it directly.

[0139] Specifically, the component design draft can be used to design the front-end page design draft and then build the front-end page.

[0140] Corresponding to the above-mentioned design draft generation method embodiment, this specification also provides a design draft generation device embodiment, Figure 6 Schematic diagram of a design draft generation device provided by an embodiment of this specification. Figure 6 As shown, the device comprises: The information acquisition module 602 is configured to acquire description information of the component to be designed input by the user.

[0141] The code determination module 604 is configured to determine, based on the description information, a reference design draft code corresponding to a component description matching the description information from a preset component description database; the component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description.

[0142] The code generation module 606 is configured to generate the component design draft code of the component to be designed by using a large language model based on the description information and the reference design draft code.

[0143] The design draft conversion module 608 is configured to convert the component design draft code into a component design draft of the component to be designed.

[0144] Optionally, the code generation module 606 may be specifically configured as follows: The description information and the reference design draft code are concatenated to obtain a first prompt word for inputting a first large language model; the first prompt word is used to instruct the first large language model to generate the component design draft code corresponding to the description information with reference to the reference design draft code.

[0145] The first prompt word is input into the first large language model to obtain the component design draft code generated by the first large language model.

[0146] Optionally, the code determination module 604 may be specifically configured as follows: Based on the description information, a reference design draft code that complies with a preset design specification and corresponds to a component description that matches the description information is determined from a preset component description database.

[0147] The code generation module 606 may be specifically configured as follows: Based on the description information and the reference design draft code, a large language model is used to generate a component design draft code of the component to be designed that meets the preset design specification.

[0148] Optionally, the device may further include: The design draft acquisition module is configured to acquire the design draft of the preset component.

[0149] The design draft parsing module is configured to parse the preset component design draft to obtain the preset design draft code corresponding to the preset component design draft.

[0150] The preset component description acquisition module is configured to acquire the preset component description of the component corresponding to the preset component design draft.

[0151] The data storage module is configured to associate and store the preset design draft code and the preset component description to obtain the component description database.

[0152] Optionally, the preset design draft code is HTML code; the design draft parsing module may be specifically configured as follows: A structure tree corresponding to the preset component design draft is generated; each node in the structure tree represents each element in the component corresponding to the preset component design draft.

[0153] Based on each node in the structure tree, HTML tags corresponding to each element and attributes of each HTML tag are generated.

[0154] Based on the HTML tags and the attributes of each of the HTML tags, the HTML code corresponding to the preset component design draft is obtained.

[0155] Optionally, the preset component description acquisition module may be specifically configured as follows: Generate a component design draft rendering corresponding to the preset component design draft.

[0156] Based on the component design draft rendering, a second prompt word for inputting a second language model is constructed; the second prompt word is used to instruct the second language model to generate a preset component description for the component design draft rendering.

[0157] The second prompt word is input into the second largest language model to obtain the preset component description generated by the second largest language model.

[0158] Optionally, constructing a second prompt word for inputting a second language model based on the component design draft rendering may specifically include: Based on the component design draft rendering and the preset design draft code corresponding to the preset component design draft, a second prompt word for inputting the second largest language model is constructed.

[0159] Optionally, the code determination module 604 may be specifically configured as follows: Based on the description information, determining a component description matching the description information from a preset component description database; A reference design draft code corresponding to the component description is determined from a preset component description database.

[0160] Optionally, the component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description; and determining a component description matching the description information from a preset component description database based on the description information may specifically include: A plurality of preset component descriptions in the component description database is obtained.

[0161] The multiple preset component descriptions are concatenated with the description information to obtain a third prompt word for inputting a third language model; the third prompt word is used to instruct the third language model to filter component descriptions that match the description information from the multiple preset component descriptions.

[0162] The third prompt word is input into the third language model to obtain a component description determined by the third language model and matching the description information.

[0163] Optionally, the obtaining of multiple preset component descriptions in the component description database may specifically include: It is determined whether the data volume of the preset component description included in the component description database is greater than a preset data volume threshold; the preset data volume threshold corresponds to the maximum context length that can be processed by the third largest language model at a single time.

[0164] If the data volume of the preset component description included in the component description database is greater than the preset data volume threshold, a first data volume of preset component description is selected from the component description database; the first data volume is less than or equal to the preset data volume threshold.

[0165] Optionally, the component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description; and determining a component description matching the description information from a preset component description database based on the description information may specifically include: Divide multiple preset component descriptions in the component description database to obtain multiple preset component descriptions; the data volume of any one of the multiple preset component descriptions is less than or equal to a preset data volume threshold; the preset data volume threshold corresponds to the maximum context length that can be processed by the third largest language model at a single time.

[0166] For each of the multiple preset component descriptions, the following steps are performed respectively: concatenating a preset component description with the description information to obtain a third prompt word corresponding to the preset component description and used to input the third largest language model; the third prompt word is used to instruct the third largest language model to determine a component description matching the description information from the preset component description; and inputting the third prompt word into the third largest language model to obtain a single component description corresponding to the preset component description output by the third largest language model.

[0167] The single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined to obtain a component description matching the description information.

[0168] Optionally, combining the single component descriptions corresponding to the respective preset component descriptions in the multiple preset component descriptions to obtain a component description matching the description information may specifically include: The single component descriptions respectively corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined to obtain a component description set.

[0169] It is determined whether the number of component descriptions included in the component description set is greater than a preset number threshold.

[0170] If the number of component descriptions included in the component description set is greater than the preset number threshold, component descriptions less than or equal to the preset number threshold are determined from the component description set.

[0171] Optionally, determining, based on the description information, a component description matching the description information from a preset component description database may specifically include: Based on the description information, a component description having a degree of similarity with the description information greater than or equal to a preset similarity threshold is determined from a preset component description database using a similarity algorithm.

[0172] Optionally, the description information includes a component name of the component to be designed and an element name of each element in the component to be designed; and determining a component description matching the description information from a preset component description database based on the description information may specifically include: Based on the description information, a component description matching the component name and the element name is determined from a preset component description database.

[0173] Optionally, the code determination module 604 may be specifically configured as follows: Based on the description information, an index of a component description matching the description information is determined from a preset component description database.

[0174] Based on the index, a reference design draft code corresponding to the index is obtained from a preset component description database.

[0175] Optionally, the design draft conversion module 608 may be specifically configured as follows: The component design draft code is converted into a basic layer of the component design draft of the component to be designed.

[0176] Based on the basic layer of the component design draft of the component to be designed, the component design draft of the component to be designed is generated.

[0177] The above is a schematic scheme of a design draft generation device of this embodiment. It should be noted that the technical scheme of the design draft generation device and the technical scheme of the design draft generation method described above belong to the same concept, and the details not described in detail in the technical scheme of the design draft generation device can be found in the description of the technical scheme of the design draft generation method described above.

[0178] Figure 7 The block diagram of a computing device 700 according to an embodiment of the present specification is shown. The components of the computing device 700 include but are not limited to a memory 710 and a processor 720. The processor 720 is connected to the memory 710 via a bus 730, and the database 750 is used to store data.

[0179] The computing device 700 also includes an access device 740 that enables the computing device 700 to communicate via one or more networks 760. Examples of these networks include a public switched telephone network (PSTN), a local area network (LAN), a wide area network (WAN), a personal area network (PAN), or a combination of communication networks such as the Internet. The access device 540 may include one or more of any type of network interface (e.g., a network interface card (NIC)) that is wired or wireless, such as an IEEE 802.11 wireless local area network (WLAN) wireless interface, a world-wide interoperability for microwave access (Wi-MAX) interface, an Ethernet interface, a universal serial bus (USB) interface, a cellular network interface, a Bluetooth interface, and a near field communication (NFC).

[0180] In one embodiment of the present specification, the above components of the computing device 700 and Figure 7 Other components not shown in the figure may also be connected to each other, for example, via a bus. It should be understood that Figure 7 The computing device structure block diagram shown is only for the purpose of illustration, and is not intended to limit the scope of this specification. Those skilled in the art can add or replace other components as needed.

[0181] The computing device 700 may be any type of stationary or mobile computing device, including a mobile computer or mobile computing device (e.g., a tablet computer, a personal digital assistant, a laptop computer, a notebook computer, a netbook, etc.), a mobile phone (e.g., a smart phone), a wearable computing device (e.g., a smart watch, smart glasses, etc.), or other types of mobile devices, or a stationary computing device such as a desktop computer or a personal computer (PC). The computing device 700 may also be a mobile or stationary server.

[0182] Among them, the processor 720 is used to execute the following computer-executable instructions, which, when executed by the processor, implement the steps of the above-mentioned design draft generation method.

[0183] The above is a schematic scheme of a computing device of this embodiment. It should be noted that the technical scheme of the computing device and the technical scheme of the above-mentioned design draft generation method belong to the same concept, and the details not described in detail in the technical scheme of the computing device can be referred to the description of the technical scheme of the above-mentioned design draft generation method.

[0184] An embodiment of the present specification also provides a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, implement the steps of the above-mentioned design draft generation method.

[0185] The above is a schematic scheme of a computer-readable storage medium of this embodiment. It should be noted that the technical scheme of the storage medium and the technical scheme of the above-mentioned design draft generation method belong to the same concept, and the details not described in detail in the technical scheme of the storage medium can be referred to the description of the technical scheme of the above-mentioned design draft generation method.

[0186] An embodiment of the present specification also provides a computer program product, wherein when the computer program is executed in a computer, the computer is caused to execute the steps of the above-mentioned design draft generation method.

[0187] The above is a schematic scheme of a computer program of this embodiment. It should be noted that the technical scheme of the computer program and the technical scheme of the above-mentioned design draft generation method belong to the same concept, and the details not described in detail in the technical scheme of the computer program can be referred to the description of the technical scheme of the above-mentioned design draft generation method.

[0188] The above is a description of a specific embodiment of the specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the embodiments and still achieve the desired results. In addition, the processes depicted in the drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0189] The computer instructions include computer program codes, which may be in source code form, object code form, executable files or some intermediate forms, etc. The computer-readable medium may include: any entity or device capable of carrying the computer program code, recording medium, USB flash drive, mobile hard disk, magnetic disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electric carrier signal, telecommunication signal and software distribution medium, etc. It should be noted that the content contained in the computer-readable medium may be appropriately increased or decreased according to the requirements of patent practice. For example, in some regions, according to patent practice, computer-readable media do not include electric carrier signals and telecommunication signals.

[0190] It should be noted that, for the above-mentioned method embodiments, for the sake of simplicity of description, they are all expressed as a series of action combinations, but those skilled in the art should be aware that the embodiments of this specification are not limited by the order of the actions described, because according to the embodiments of this specification, some steps can be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in the specification are all preferred embodiments, and the actions and modules involved are not necessarily required by the embodiments of this specification.

[0191] In the above embodiments, the description of each embodiment has its own emphasis. For parts that are not described in detail in a certain embodiment, reference can be made to the relevant descriptions of other embodiments.

[0192] The preferred embodiments of this specification disclosed above are only used to help explain this specification. The optional embodiments do not describe all the details in detail, nor do they limit the invention to only the specific implementation methods described. Obviously, many modifications and changes can be made according to the content of the embodiments of this specification. This specification selects and specifically describes these embodiments in order to better explain the principles and practical applications of the embodiments of this specification, so that technicians in the relevant technical field can well understand and use this specification. This specification is only limited by the claims and their full scope and equivalents.

Claims

1. A design draft generation method, characterized in that: include: Obtaining description information of the component to be designed input by the user; Based on the description information, determining a reference design draft code corresponding to a component description matching the description information from a preset component description database; The component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description; Based on the description information and the reference design draft code, using a large language model to generate a component design draft code of the component to be designed; The component design draft code is converted into a component design draft of the component to be designed.

2. The method according to claim 1, characterized in that The generating the component design draft code of the component to be designed by using the large language model based on the description information and the reference design draft code specifically includes: The description information and the reference design draft code are concatenated to obtain a first prompt word for inputting a first large language model; the first prompt word is used to instruct the first large language model to generate the component design draft code corresponding to the description information with reference to the reference design draft code; The first prompt word is input into the first large language model to obtain the component design draft code generated by the first large language model.

3. The method according to claim 1, characterized in that The determining, based on the description information, from a preset component description database, a reference design draft code corresponding to a component description matching the description information specifically includes: Based on the description information, determining from a preset component description database a reference design draft code that corresponds to a component description that matches the description information and complies with a preset design specification; The generating the component design draft code of the component to be designed by using the large language model based on the description information and the reference design draft code specifically includes: Based on the description information and the reference design draft code, a large language model is used to generate a component design draft code of the component to be designed that meets the preset design specification.

4. The method according to claim 1, characterized in that: Before determining, based on the description information, from a preset component description database, a reference design draft code corresponding to the component description matching the description information, the method further includes: Get the design draft of the preset component; Parsing the preset component design draft to obtain a preset design draft code corresponding to the preset component design draft; Obtaining a preset component description of a component corresponding to the preset component design draft; The preset design draft code and the preset component description are stored in association with each other to obtain the component description database.

5. The method according to claim 4, characterized in that The preset design draft code is HTML code; The step of parsing the preset component design draft to obtain the preset design draft code corresponding to the preset component design draft specifically includes: Generate a structure tree corresponding to the preset component design draft; each node in the structure tree represents each element in the component corresponding to the preset component design draft; Based on each node in the structure tree, generate HTML tags corresponding to each element and attributes of each HTML tag; Based on the HTML tags and the attributes of each of the HTML tags, the HTML code corresponding to the preset component design draft is obtained.

6. The method according to claim 4, characterized in that The obtaining of the preset component description of the component corresponding to the preset component design draft specifically includes: Generate a component design draft rendering corresponding to the preset component design draft; Based on the component design draft rendering, construct a second prompt word for inputting into a second language model; the second prompt word is used to instruct the second language model to generate a preset component description for the component design draft rendering; The second prompt word is input into the second largest language model to obtain the preset component description generated by the second largest language model.

7. The method according to claim 6, characterized in that The step of constructing a second prompt word for inputting a second language model based on the component design draft rendering specifically includes: Based on the component design draft rendering and the preset design draft code corresponding to the preset component design draft, a second prompt word for inputting the second largest language model is constructed.

8. The method according to claim 1, characterized in that The determining, based on the description information, from a preset component description database, a reference design draft code corresponding to a component description matching the description information specifically includes: Based on the description information, determining a component description matching the description information from a preset component description database; A reference design draft code corresponding to the component description is determined from a preset component description database.

9. The method according to claim 8, characterized in that The component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description; based on the description information, determining a component description matching the description information from the preset component description database specifically includes: Obtain multiple preset component descriptions from the component description database; splicing the plurality of preset component descriptions with the description information to obtain a third prompt word for inputting a third language model; the third prompt word is used to instruct the third language model to filter component descriptions that match the description information from the plurality of preset component descriptions; The third prompt word is input into the third language model to obtain a component description determined by the third language model and matching the description information.

10. The method according to claim 9, characterized in that The obtaining of the plurality of preset component descriptions in the component description database specifically includes: Determining whether the amount of data of the preset component description included in the component description database is greater than a preset data amount threshold; the preset data amount threshold corresponds to the maximum context length that can be processed by the third language model at a single time; If the data volume of the preset component descriptions included in the component description database is greater than the preset data volume threshold, a first data volume of preset component descriptions is selected from the component description database; the first data volume is less than or equal to the preset data volume threshold.

11. The method according to claim 8, characterized in that The component description database includes multiple groups of data; any group of data in the multiple groups of data includes a preset component description; based on the description information, determining a component description matching the description information from the preset component description database specifically includes: Dividing the plurality of preset component descriptions in the component description database to obtain a plurality of preset component descriptions; the data volume of any one of the plurality of preset component descriptions is less than or equal to a preset data volume threshold; the preset data volume threshold corresponds to a maximum context length that can be processed at a single time by the third largest language model; For each of the plurality of preset component descriptions, the following steps are respectively performed: concatenating a preset component description with the description information to obtain a third prompt word corresponding to the preset component description and used for inputting the third largest language model; the third prompt word is used to instruct the third largest language model to determine a component description matching the description information from the preset component description; and the third prompt word is input into the third largest language model to obtain a single component description corresponding to the preset component description output by the third largest language model; The single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions are combined to obtain a component description matching the description information.

12. The method according to claim 11, characterized in that The combining of the single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions to obtain a component description matching the description information specifically includes: Combining the single component descriptions corresponding to the respective preset component descriptions in the plurality of preset component descriptions to obtain a component description set; Determining whether the number of component descriptions included in the component description set is greater than a preset number threshold; If the number of component descriptions included in the component description set is greater than the preset number threshold, component descriptions less than or equal to the preset number threshold are determined from the component description set.

13. The method according to claim 8, characterized in that The determining, based on the description information, a component description matching the description information from a preset component description database specifically includes: Based on the description information, a component description having a degree of similarity with the description information greater than or equal to a preset similarity threshold is determined from a preset component description database using a similarity algorithm.

14. The method according to claim 8, characterized in that The description information includes the component name of the component to be designed and the element name of each element in the component to be designed; the determining, based on the description information, a component description matching the description information from a preset component description database specifically includes: Based on the description information, a component description matching the component name and the element name is determined from a preset component description database.

15. The method according to claim 1, characterized in that The determining, based on the description information, from a preset component description database, a reference design draft code corresponding to a component description matching the description information specifically includes: Based on the description information, determining an index of a component description matching the description information from a preset component description database; Based on the index, a reference design draft code corresponding to the index is obtained from a preset component description database.

16. The method according to claim 1, characterized in that The converting the component design draft code into the component design draft of the component to be designed specifically includes: Converting the component design draft code into a base layer of the component design draft of the component to be designed; Based on the basic layer of the component design draft of the component to be designed, the component design draft of the component to be designed is generated.

17. A design draft generating device, characterized in that: include: An information acquisition module is configured to acquire description information of the component to be designed input by a user; A code determination module is configured to determine, based on the description information, from a preset component description database a reference design draft code corresponding to a component description matching the description information; The component description database includes at least one set of data, the set of data including a preset component description and a preset design draft code corresponding to the preset component description; A code generation module is configured to generate a component design draft code of the component to be designed using a large language model based on the description information and the reference design draft code; The design draft conversion module is configured to convert the component design draft code into the component design draft of the component to be designed.

18. A computing device, characterized in that include: Memory and processor; The memory is used to store computer programs or instructions, and the processor is used to execute the computer programs or instructions. When the computer programs or instructions are executed by the processor, the steps of the design draft generation method described in any one of claims 1 to 16 are implemented.

19. A computer-readable storage medium, characterized in that: It stores a computer program or instruction, which, when executed by a processor, implements the steps of the design draft generation method described in any one of claims 1 to 16.

20. A computer program product, characterized in that It includes a computer program or instructions, which, when executed by a processor, implements the steps of the design draft generation method described in any one of claims 1 to 16.

Images