Method, apparatus and computer device for generating user interface information, and storage medium

By decoupling the aesthetic structure and material content of the user interface, and using structural cue words in a preset sample library to guide the generation of user interface information from a large model, the problem of difficulty in generating UI information in existing technologies to balance standardization and flexibility at low cost is solved, thus achieving efficient and flexible UI generation.

CN122173088APending Publication Date: 2026-06-09CHONGQING ANT CONSUMER FINANCE CO LTD
View PDF 4 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
CHONGQING ANT CONSUMER FINANCE CO LTD
Filing Date
2026-05-07
Publication Date
2026-06-09

AI Technical Summary

Technical Problem

Existing technologies struggle to generate user interface information that conforms to aesthetic standards and possesses the flexibility and creativity to adapt to dynamic content at low cost while ensuring high standardization.

Method used

By decoupling the aesthetic structure and content of the page, and using high-quality structural cue words from a pre-set sample library to guide the large model in generating user interface information, the expensive training or fine-tuning of the basic large model is avoided, thus enabling content creation within a defined high-quality aesthetic framework.

Benefits of technology

While ensuring a rigorous structure, it possesses the flexibility to meet actual needs, the output UI information conforms to aesthetic standards, and it can quickly adapt to layout style adjustments in different application scenarios.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122173088A_ABST
    Figure CN122173088A_ABST
Patent Text Reader

Abstract

The specification discloses a user interface information generation method and device, computer equipment and a storage medium. The method is applied to the field of computer technology and includes the following steps: obtaining design requirement information related to user interface design; extracting interface styles and material content according to the design requirement information; retrieving sample structure prompt words matching the interface styles from a preset sample library with high quality, wherein the preset sample library stores structure prompt words corresponding to various different interface styles; generating target prompt words corresponding to the design requirement information according to the sample structure prompt words and the material content; and inputting the target prompt words into a preset large model to output user interface information adapted to the design requirement information. The method can generate UI information that meets aesthetic standards and has flexibility and certain creative ability to adapt to dynamic content at a low cost.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This specification relates to the field of computer technology, and in particular to a method, apparatus, computer device, and storage medium for generating user interface information. Background Technology

[0002] With the rapid development of artificial intelligence (AI) technology, especially the continuous breakthroughs in large language model capabilities, its applications have penetrated into various industries. In the fields of software engineering and front-end development, using AI models to assist or even automatically generate user interface (UI) code has become an important technological direction for improving R&D efficiency and reducing repetitive work.

[0003] Currently, many related technologies attempt to directly utilize general-purpose large language models to generate UI code based on natural language descriptions, aiming to achieve rapid UI design and development. However, this approach struggles to achieve low-cost, flexible generation while maintaining high standards. Therefore, how to generate UI information that conforms to aesthetic standards while also possessing the flexibility to adapt to dynamic content and a certain degree of creativity at a lower cost has become a pressing technical problem to be solved. Summary of the Invention

[0004] This specification provides a method, apparatus, computer device, and storage medium for generating user interface information. This method can generate UI information that conforms to aesthetic standards, adapts to dynamic content, and possesses a certain degree of creativity at a low cost.

[0005] In a first aspect, a method for generating user interface information is provided, comprising: acquiring design requirement information related to user interface design; extracting interface styles and material content based on the design requirement information; retrieving sample structural prompts matching the interface styles from a preset sample library, wherein the preset sample library stores structural prompts corresponding to various different interface styles; generating target prompts corresponding to the design requirement information based on the sample structural prompts and the material content; inputting the target prompts into a preset large model, and outputting user interface information adapted to the design requirement information.

[0006] In conjunction with the first aspect, in some possible implementations, the preset sample library also stores preset keywords corresponding to structural prompt words; retrieving sample structural prompt words that match the interface style from the preset sample library includes: determining the target keyword corresponding to the interface style; matching the target keyword with the preset keywords stored in the preset sample library, and using the structural prompt words corresponding to the preset keywords that successfully match the target keyword as sample structural prompt words that match the interface style.

[0007] In conjunction with the first aspect, in some possible implementations, the step of matching the target keyword with preset keywords stored in the preset sample library, and using the structural prompt words corresponding to the preset keywords that successfully match the target keyword as sample structural prompt words that match the interface style, includes: matching the target keyword with each preset keyword stored in the preset sample library to obtain the matching degree between the target keyword and each preset keyword stored in the preset sample library; using the K preset keywords whose matching degree with the target keyword is in the top K positions as preset keywords that successfully match the target keyword, where K is an integer greater than or equal to 1; and using the structural prompt words corresponding to the K preset keywords as sample structural prompt words that match the interface style.

[0008] In conjunction with the first aspect, in some possible implementations, the preset sample library is obtained by: acquiring sample user interfaces with multiple different interface styles, wherein the quality of the sample user interfaces is higher than a preset quality threshold; for each interface style of sample user interface, generating structural prompts corresponding to the interface style iteratively based on the sample user interface, and storing the generated structural prompts as structural prompts corresponding to the interface style in the preset sample library if the generated structural prompts can reconstruct the sample user interface.

[0009] In conjunction with the first aspect, in some possible implementations, generating target prompts corresponding to the design requirement information based on the sample structure prompts and the material content includes: generating reference content prompts based on the material content; and combining the reference content prompts and the sample structure prompts to generate target prompts corresponding to the design requirement information.

[0010] In conjunction with the first aspect, in some possible implementations, the target prompt word is used to instruct the large model to refer to the interface style described by the sample structure prompt word, fill the material content described by the reference content prompt word into the interface style, and adapt the interface style and the material content.

[0011] In conjunction with the first aspect, in some possible implementations, the user interface information is user interface code or a rendered user interface; the step of inputting the target prompt word into a preset large model and outputting user interface information adapted to the design requirement information includes: inputting the target prompt word into a preset large model and outputting user interface code or a rendered user interface adapted to the design requirement information.

[0012] Secondly, a device for generating user interface information is provided, comprising: an acquisition module for acquiring design requirement information related to user interface design; an extraction module for extracting interface styles and material content based on the design requirement information; a retrieval module for retrieving sample structural prompts matching the interface styles from a preset sample library, wherein the preset sample library stores structural prompts corresponding to various different interface styles; a prompt generation module for generating target prompts corresponding to the design requirement information based on the sample structural prompts and the material content; and an output module for inputting the target prompts into a preset large model and outputting user interface information adapted to the design requirement information.

[0013] Thirdly, a computer device is provided, the computer device including one or more processors and one or more memories, the one or more memories storing at least one computer program, the computer program being loaded and executed by the one or more processors to implement the above-described method for generating user interface information.

[0014] Fourthly, a computer-readable storage medium is provided, wherein at least one computer program is stored in the computer-readable storage medium, the computer program being loaded and executed by a processor to implement the above-described method for generating user interface information.

[0015] Fifthly, a computer program product or computer program is provided, the computer program product or computer program including program code stored in a computer-readable storage medium, a processor of a computer device reading the program code from the computer-readable storage medium, the processor executing the program code, causing the computer device to perform the above-described method for generating user interface information.

[0016] The technical solution provided in the embodiments of this specification first obtains design requirement information related to user interface design. By extracting interface styles and material content, the structure and content are decoupled, allowing subsequent steps to handle both standardization and flexibility requirements separately. Secondly, sample structure prompts are retrieved from a preset sample library. This library typically stores high-quality structure prompts corresponding to different interface styles, ensuring that the output UI information conforms to aesthetic standards at the skeleton level and solving the problem of arbitrary structure in general models. Next, target prompts are generated based on the sample structure prompts and material content, dynamically integrating the standardized skeleton with specific content. This allows the large model to intelligently adapt to variable content within a defined high-quality framework, maintaining flexibility to meet actual needs while ensuring structural rigor. Finally, the target prompts are input into the preset large model, utilizing its powerful code generation capabilities to synthesize the final UI information under strong constraints. This process of generating UI information does not require expensive training or fine-tuning of the basic large model. By retrieving sample structure prompts, the generation capabilities of the general large model can be effectively constrained and guided to specific interface styles, ensuring that the output UI information conforms to aesthetic standards at the skeleton level. Meanwhile, since the sample library can be added, deleted, or modified at any time, the adjustment of layout style under different application scenarios can be quickly completed by updating the sample library, which has the standard controllability of traditional templates and the flexible adaptability of AI native methods. Attached Figure Description

[0017] To more clearly illustrate the technical solutions in the embodiments of this specification, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of this specification. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0018] Figure 1 This is a schematic diagram of the implementation environment of a method for generating user interface information provided in the embodiments of this specification; Figure 2 This is a schematic flowchart illustrating a method for generating user interface information provided in the embodiments of this specification; Figure 3 This is a block diagram illustrating the implementation principle of a method for generating user interface information provided in the embodiments of this specification. Figure 4 This is a schematic diagram of the structure of a user interface information generation device provided in the embodiments of this specification; Figure 5 This is a schematic diagram of the structure of a terminal provided in an embodiment of this specification; Figure 6 This is a schematic diagram of the structure of a server provided in the embodiments of this specification. Detailed Implementation

[0019] To make the objectives, technical solutions, and advantages of this specification clearer, the embodiments of this specification will be further described in detail below with reference to the accompanying drawings.

[0020] In this manual, the terms "first," "second," etc., are used to distinguish identical or similar items with essentially the same function. It should be understood that there is no logical or temporal dependency between "first," "second," and "nth," nor are there any restrictions on quantity or execution order.

[0021] In the specific embodiments of this application, any data related to the object, such as data involved in the use of the application, is required. When the embodiments of this application are applied to specific products or technologies, permission or consent from the object is required, and the collection, use, and processing of the relevant data must comply with the relevant laws, regulations, and standards of the relevant countries and regions. In other words, if any of the aforementioned object-related data is involved in the embodiments of this application, this data must be obtained with the object's authorization and consent, and in accordance with the relevant laws, regulations, and standards of the country and region.

[0022] To make the objectives, technical solutions, and advantages of this application clearer, the technical solutions of the embodiments of this application and the technical effects produced by the technical solutions of this application will be described below with reference to the accompanying drawings and through the description of several exemplary embodiments. It should be noted that the following embodiments can be referred to, borrowed from, or combined with each other, and the same terms, similar features, and similar implementation steps in different embodiments will not be described again.

[0023] With the rapid development of artificial intelligence (AI) technology, especially the continuous breakthroughs in large language model capabilities, its applications have penetrated into various industries. In the fields of software engineering and front-end development, utilizing AI models to assist or even automatically generate user interface (UI) code has become an important technological direction for improving R&D efficiency and reducing repetitive work. Currently, related technologies commonly attempt to directly utilize general-purpose large language models to generate UI code based on natural language descriptions, aiming to achieve rapid UI design and development.

[0024] This application, through research, finds that current methods for automatically generating UI code using AI models (especially large language models) primarily rely on the following three technical approaches: 1. Direct Generation from a General-Purpose Model: Natural language descriptions of requirements are directly input into a general-purpose model that has not undergone specific training, and the model generates complete UI code. This method heavily relies on the model's pre-trained knowledge, resulting in highly flexible output that can respond to diverse text and simple layout changes.

[0025] 2. Fine-tuning: For design specifications specific to a particular scenario, a large number of corresponding UI code samples are collected. The basic large model is then fine-tuned with full or efficient parameter adjustments to obtain a proprietary model. This method aims to allow the model to learn from the data and internalize specific aesthetic styles and code structures.

[0026] 3. Hard-coded template engine: Template files with fixed interface styles and themes are pre-written manually by developers. Material content (such as text and images) is injected into the predetermined positions of the template as variables, thereby generating the final page.

[0027] However, in practical applications, especially in scenarios with stringent requirements for visual quality and development efficiency (such as e-commerce promotions and brand marketing), all three technical approaches have certain shortcomings and cannot achieve a good balance between standardization, flexibility, and economy. Regarding the above technical path 1: Since the general model lacks a deep understanding of specific design languages ​​(such as spacing systems, color systems, font levels, and component variations), the generated page code often has unclear structural semantics and arbitrary style rules, exhibiting a distinct AI flavor—that is, loose layout, inconsistent style, and rough details. It cannot directly meet the high-quality online publishing standards and requires a lot of manual work for secondary adjustments, which goes against the original intention of improving efficiency.

[0028] While full-scale model fine-tuning can improve the standardization of output, it is costly, involving the collection of a large amount of high-quality paired data, computational resource consumption, and training and debugging time. More importantly, when the design style needs to iterate rapidly to keep up with market trends (for example, when the theme of a major promotion changes from "tech-savvy" to "warm and cozy"), the original fine-tuned model may immediately become invalid, requiring data to be prepared and the training process to be repeated. This results in poor agility and an inability to adapt to rapidly changing design requirements.

[0029] Regarding the third technical approach mentioned above: template engines can ensure that the output conforms to design specifications, but they are essentially static, fill-in-the-blank generation tools. They cannot intelligently adjust the interface style based on the length, characteristics, or semantics of the input content (e.g., automatically wrapping lines based on title length, dynamically adjusting card arrangement based on the number of products), resulting in a frequent disconnect between content and form. Furthermore, this method lacks AI's ability to assist in creative aspects such as layout, composition, and visual expression.

[0030] In summary, the relevant technologies suffer from the following problems: general-purpose models and fine-tuning models struggle to achieve flexible generation at low cost while maintaining high standardization, while hard-coded template engines sacrifice flexibility for standardization. Therefore, how to generate UI information that conforms to aesthetic standards while also possessing the flexibility to adapt to dynamic content and a certain degree of creativity at a lower cost has become an urgent technical problem to be solved.

[0031] To at least address the aforementioned technical problems, this application proposes a UI information generation method based on Few-shot engineering. This method decouples the aesthetic structure of the page from the content, and guides a large model to create content within a defined, high-quality aesthetic framework through dynamic retrieval and fusion mechanisms. This achieves a balance between standardization and flexibility in a low-cost manner without requiring model retraining.

[0032] The implementation environment of the embodiments in this specification will be described below.

[0033] Figure 1 This is a schematic diagram illustrating the implementation environment of a method for generating user interface information provided in the embodiments of this specification. See also... Figure 1 The implementation environment may include user equipment 110 and a generation platform 120. User equipment 110 may be a terminal device such as a computer or mobile phone. Generation platform 120 may be an independent physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, content delivery network (CDN), and big data and artificial intelligence platforms.

[0034] The technical solutions provided in the embodiments of this specification can be applied in the scenario of UI information generation. The user inputs design requirement information related to UI design through the user device 110, and the user device 110 sends the design requirement information to the generation platform 120.

[0035] After receiving the design requirement information, the generation platform 120 processes it based on the technical solution of this application: It extracts the interface style and material content according to the design requirement information; it retrieves sample structure prompts matching the interface style from a preset sample library; it generates target prompts corresponding to the design requirement information based on the sample structure prompts and material content; it inputs the target prompts into a preset large model and outputs user interface (UI) information adapted to the design requirement information. Finally, the generation platform 120 sends the generated UI information adapted to the design requirement information to the user device 110, thus completing a full interaction process.

[0036] Figure 2 This is a schematic flowchart illustrating a method for generating user interface information provided in an embodiment of this specification. See also... Figure 2 Taking the execution entity as the generation platform as an example, the method includes the following steps.

[0037] Step 202: Obtain design requirements information related to user interface design.

[0038] Step 204: Extract interface styles and material content based on design requirements.

[0039] Step 206: Retrieve sample structural prompts that match the interface style from the preset sample library. The preset sample library stores structural prompts corresponding to various interface styles.

[0040] Step 208: Generate target prompts corresponding to the design requirements information based on the sample structure prompts and material content.

[0041] Step 210: Input the target prompts into the preset large model and output user interface information that matches the design requirements.

[0042] exist Figure 2 In the illustrated embodiment, design requirements related to user interface design are first obtained. By extracting interface styles and material content, the structure and content are decoupled, allowing subsequent steps to handle both standardization and flexibility requirements separately. Secondly, sample structure prompts are retrieved from a pre-set sample library. This library typically stores high-quality structure prompts corresponding to different interface styles, ensuring that the output UI information conforms to aesthetic standards at the skeleton level and resolving the issue of arbitrary structure in general models. Next, target prompts are generated based on the sample structure prompts and material content, dynamically fusing the standardized skeleton with specific content. This allows the large model to intelligently adapt to variable content within a defined high-quality framework, maintaining structural rigor while retaining flexibility to meet actual needs. Finally, the target prompts are input into the pre-set large model, utilizing its powerful code generation capabilities to synthesize the final UI information under strong constraints. This UI information generation process eliminates the need for expensive training or fine-tuning of the basic large model. By retrieving sample structure prompts, the generation capabilities of the general large model can be effectively constrained and guided to specific interface styles, ensuring that the output UI information conforms to aesthetic standards at the skeleton level. Meanwhile, since the sample library can be added, deleted, or modified at any time, the adjustment of layout style under different application scenarios can be quickly completed by updating the sample library, which has the standard controllability of traditional templates and the flexible adaptability of AI native methods.

[0043] The following is about Figure 2 The specific implementation methods of each step in the illustrated embodiment are explained below: In step 202, the generation platform obtains design requirement information related to the user interface (UI) design. This design requirement information refers to any form of information input from the user expressing their expectations for the appearance, content, functions, or style of the UI.

[0044] The design requirements information can be multimodal, including text, audio, sketch, etc.

[0045] For example, the platform can receive design requirements information input by users through their devices. Suppose the design requirements information is a piece of text, such as "Generate a high-end black and gold style landing page for a financial product, including a large display of the yield rate and a purchase button," entered by an operations staff member.

[0046] In step 204, the platform extracts interface styles and material content based on the design requirements. Interface styles are a comprehensive constraint on the overall presentation of the user interface (UI), determining how the UI "looks" and / or how the elements are organized.

[0047] For example, interface styles can include the layout structure and / or visual style of the interface. Layout structure refers to the spatial organization, arrangement, and hierarchical relationship of UI elements; it is the abstract skeleton of the UI, defining the page's block divisions (such as header, main content area, sidebar, and footer), the relative positions and flow direction between blocks, and the core layout grid, but does not involve any specific text, images, or data content. Visual style refers to the specific set of sensory attributes applied to the aforementioned layout skeleton; it is the skin and appearance of the UI, defining the overall color system (such as primary color, secondary color, and background color), font system (such as font family, font size hierarchy, and font weight), spatial scale (such as spacing, rounded corners, and border width), lighting effects (such as shadows and gradients), and the processing style of visual elements such as icons and images. For example, "high-end black and gold style" is a specific set of visual style rules. Material content refers to the specific content filled into the interface style "skeleton," including but not limited to text, images, videos, and the specific states of interactive controls.

[0048] Specifically, the generation platform analyzes the user's intent based on the design requirements information, identifies and separates which information describes the abstract organizational form of the UI (i.e., interface style) and which information describes the specific information entities to be presented (i.e. material content), thereby extracting the interface style and material content required by the user.

[0049] For example, given the design requirement of "generating a high-end black and gold style landing page for a financial product, including a large display of the yield rate and a purchase button," the extracted interface style includes: In terms of layout structure, the page type is a landing page, and the overall layout adopts a classic narrative structure geared towards conversion and brand promotion; a separate and visually high-level block is used specifically for centering and enlarging the display of a single core data point—this is a specific structural response to the "large text display" requirement; a prominently located core operation button is used—this is a structural response to the "purchase button" requirement. In terms of visual style, the theme is a high-end black and gold style. In terms of content, the main text is the financial product name, the core data includes a large yield rate, and the button name is "Purchase."

[0050] In step 206, the generation platform retrieves sample structural prompts from a preset sample library that match the interface styles extracted in step 204. The preset sample library stores structural prompts corresponding to various different interface styles. All structural prompts stored in the preset sample library correspond to high-quality interface styles.

[0051] Structural prompts are core data stored in the sample library. They are standardized, semantic descriptions of high-quality UI styles. When a structural prompt is input into a large model, the model can output UI information with that style. Structural prompts are detailed text instructions that guide the large model in generating UI information for specific layout pages; they are highly structured prompts. Because structural prompts are stored in a preset sample library, they can also be called sample structural prompts. Since the structural prompts in the preset sample library are all used as examples, they can also be called sample structural prompts. The sample library stores verified sample structural prompts with excellent typography and color schemes.

[0052] For example, the structural prompt for a product card interface style is: "Create a horizontally laid-out container with a fixed-width and height product image area on the left and a content area on the right. The content area has a main title at the top (large bold font), description text in the middle (small gray font), and price information (highlighted in color, large font size) and a right-aligned 'Buy' button at the bottom. The overall style follows minimalism, with subtle shadows and rounded corners." In some embodiments, the preset sample library is obtained by: acquiring sample user interfaces with multiple different interface styles, wherein the quality of the sample user interfaces is higher than a preset quality threshold; for each interface style of sample user interface, generating structural prompts corresponding to the interface style based on the sample user interface, and storing the generated structural prompts as structural prompts corresponding to the interface style in the preset sample library if the generated structural prompts can reconstruct the sample user interface.

[0053] This embodiment provides an automated and self-consistent method for constructing a pre-defined sample library. Through iterative generation and verification, structural prompts that can accurately guide UI generation are derived from high-quality sample user interfaces, ensuring that each structural prompt stored in the sample library has high reliability and reproducibility.

[0054] The aforementioned sample user interfaces refer to high-quality UI design examples used as learning models. These can take the form of online page screenshots that have undergone design review, high-fidelity design drafts, or UI interfaces that conform to best practices. The quality of the sample user interfaces exceeds a preset quality threshold, meaning that they meet professional standards for direct use in terms of visual aesthetics, layout standardization, and interaction logic. The iteratively generated structural prompts are prompts that accurately and structurally describe the interface style. They are comprehensive descriptive templates that include layout structure, key component composition, and visual style constraints. Their goal is to enable AI models to reliably reproduce user interfaces of equivalent quality.

[0055] Iterative generation and validation refers to an automated, iterative optimization process. Based on the analysis of the sample user interface (original sample), structural cue words are initially generated. Then, the structural cue words are immediately used to drive a generative large model to attempt to reconstruct the sample user interface (reconstruction result). The guiding effectiveness of the structural cue words is evaluated by comparing the difference between the reconstruction result and the original sample. The structural cue words are then repeatedly adjusted and optimized until a preset reconstruction standard is reached. The structural cue words that meet the reconstruction standard are stored in a preset sample library.

[0056] Specifically, for each interface style's sample user interface, the following closed-loop process is executed: First, a prompt generator is used to generate the structural prompt Prompt_v1 for the sample user interface. The generation is based on the identified layout grid, core component sequence, and significant visual features (such as main color and font family).

[0057] Then, Prompt_v1 is input into a benchmark large language model to generate UI code. The generated UI code is rendered into a UI interface (hereinafter referred to as the rendered interface) and compared with the sample user interface in multiple dimensions. Evaluation metrics may include: Layout similarity measures the overall consistency between the reconstructed interface and the sample user interface in the spatial location and size of key blocks. Key blocks are constituent units with clear functional semantics, visual independence, and layout importance; they are core components forming the page layout skeleton, such as navigation bar blocks or product / content card blocks. Specifically, a first bounding box of key blocks can be extracted from the reconstructed interface using an object detection model, and a second bounding box can be extracted from the sample user interface using the same model. The target distance between the center points of the first and second bounding boxes is calculated and normalized to obtain the positional similarity of the key blocks. The smaller the target distance, the higher the positional similarity; that is, target distance and positional similarity are negatively correlated. The area difference between the areas of the first and second bounding boxes is calculated and normalized to obtain the size similarity of the key blocks. The smaller the area difference, the higher the size similarity; that is, area difference and size similarity are negatively correlated. Finally, the above positional similarity and size similarity are weighted and summed to obtain the layout similarity. The weight coefficients corresponding to positional similarity and size similarity can be preset, but this embodiment does not impose specific limitations on this.

[0058] Component structure similarity measures the overall consistency between the restored interface and the sample user interface in terms of component type hierarchy and nested tree structure. Specifically, a first component tree is extracted from the code of the restored interface using a Document Object Model (DOM) parser, and a second component tree is extracted from the code of the sample user interface using the same DOM parser. Nodes in the component tree represent UI component types (such as buttons, cards, input boxes, image containers, etc.), and parent-child edges between nodes represent the nesting relationship between components. The minimum edit distance required to convert the first component tree to the second component tree is calculated. The minimum edit distance is the minimum number of basic operations required to convert the first component tree to the second component tree, including node insertion, deletion, and type renaming. This minimum edit distance is normalized to obtain the component structure similarity. The smaller the minimum edit distance, the higher the component structure similarity; that is, the minimum edit distance and component structure similarity are negatively correlated.

[0059] Visual style similarity measures the overall consistency in visual representation between the restored interface and the sample user interface. Specifically, a first color feature vector (e.g., the dominant hue distribution in RGB space) can be extracted from the restored interface using a color histogram or dominant color extraction algorithm, and a second color feature vector can be extracted from the sample user interface in the same way. The Euclidean distance between the first and second color feature vectors is calculated and normalized to obtain the color similarity. The smaller the Euclidean distance, the higher the color similarity; that is, the Euclidean distance is negatively correlated with color similarity. Simultaneously, a first font feature (including font size, font category, font weight, etc.) is extracted from the restored interface, and a second font feature is extracted from the sample user interface. Font size similarity, font category similarity, and font weight similarity are calculated and weighted summed to obtain the font similarity. Finally, the color similarity and font similarity are weighted and summed to obtain the visual style similarity. The weighting coefficients used in the weighted summation can be preset; this embodiment does not impose specific limitations on this.

[0060] A comprehensive fidelity score, Score_v1, is calculated based on layout similarity, component structure similarity, and visual style similarity. The values ​​for layout similarity, component structure similarity, and visual style similarity can all range from [0,1]. Then, based on preset weighting coefficients, these three values ​​are weighted and summed, and the result is used as the fidelity score. This fidelity score represents the degree of similarity between the fidelity interface generated based on the structural prompts and the sample user interface. The fact that the generated structural prompts can reconstruct the sample user interface means that the fidelity score between the fidelity interface generated based on the structural prompts and the sample user interface is greater than a preset threshold. This preset threshold can be set based on a preset fidelity standard; the higher the fidelity standard, the higher the preset threshold, and vice versa.

[0061] If Score_v1 reaches the preset threshold, Prompt_v1 is considered qualified, meaning that Prompt_v1 is considered to be able to reproduce the sample user interface, and Prompt_v1 is stored in the preset sample library as the structural prompt word corresponding to the interface style.

[0062] If Score_v1 fails to reach the preset threshold, the difference analysis between the UI interface rendered by the UI code generated based on Prompt_v1 and the original sample (i.e., the sample user interface) is used as feedback and input to the prompt word generator to guide it in generating an improved Prompt_v2. This process can be repeated multiple times until successful or the maximum number of iterations is reached (samples that fail to iterate can be marked and handled manually).

[0063] During the iteration process, if Score_vn reaches the preset threshold, Prompt_vn is considered qualified, that is, it is considered that Prompt_vn can restore the sample user interface, and Prompt_vn is stored in the preset sample library as the structural prompt word corresponding to the interface style.

[0064] For each structural cue word that can reconstruct the sample user interface, it is associated with and stored in relation to the corresponding interface style. Each interface style can be given its own name, and the sample library can store the correspondence between the names of the interface styles and the structural cue words.

[0065] In some embodiments, the preset sample library also stores preset keywords corresponding to structural prompts; retrieving sample structural prompts that match the interface style from the preset sample library includes: determining the target keyword corresponding to the interface style; matching the target keyword with the preset keywords stored in the preset sample library, and using the structural prompts corresponding to the preset keywords that successfully match the target keyword as sample structural prompts that match the interface style.

[0066] For example, to achieve efficient retrieval, a set of preset keywords can be pre-generated and associated with each structural prompt in the sample database. These preset keywords are tagged representations of the core features of the structural prompt and typically include: Layout keywords: such as horizontal layout, grid list, centered pop-up, and sticky button; Component keywords: such as image carousel, rating component, and tagged card; Style keywords: such as minimalism, frosted glass effect, industrial style, and black and gold luxury; Scene keywords: such as e-commerce product cards, financial data display, and news list items.

[0067] The retrieval process of extracting sample structure prompts that match the interface style from a pre-defined sample library is a mapping process from abstract requirements to specific samples. First, the interface style extracted in step 204 is analyzed, and key phrases that represent its core characteristics are extracted as target keywords. For example, for the interface style {layout type: landing page for financial products; visual style: high-end, black and gold}, the extracted target keywords might be: high-end, black and gold, financial management.

[0068] Then, the target keyword is matched with the preset keywords corresponding to all structural prompts in the sample library. The structural prompts corresponding to the preset keywords that successfully match the target keyword are used as sample structural prompts that match the interface style.

[0069] In some embodiments, the above-mentioned matching of the target keyword with preset keywords stored in the preset sample library, and using the structural prompt words corresponding to the preset keywords that successfully match the target keyword as sample structural prompt words that match the interface style, includes: matching the target keyword with the preset keywords stored in the preset sample library to obtain the matching degree between the target keyword and each preset keyword stored in the preset sample library; using the K preset keywords with the highest matching degree between the target keyword and the K preset keywords as preset keywords that successfully match the target keyword, where K is an integer greater than or equal to 1; and using the structural prompt words corresponding to the K preset keywords as sample structural prompt words that match the interface style.

[0070] The target keywords are a list of key phrases extracted from the interface style output in step 204, representing the core features of the current requirement. The preset keywords are a set of standardized labels pre-annotated to each structural prompt word in the sample library, describing its core features. The matching degree is a quantified score used to measure the semantic relevance or feature consistency between the target keywords and the preset keywords; a higher matching degree indicates that the features described by the two are more similar.

[0071] Specifically, let's assume the target keyword is denoted as T, and the preset keyword corresponding to the i-th structural prompt in the sample library is denoted as Pi. Calculate the matching degree Score(T, Pi) between the target keyword T and Pi in the sample library. For all preset keywords corresponding to structural prompts in the sample library, sort these preset keywords in descending order of matching degree with the target keyword to obtain the top K preset keywords. These K preset keywords are all considered as preset keywords that successfully match the target keyword. Finally, the structural prompts corresponding to these K preset keywords are all considered as sample structural prompts that match the interface style.

[0072] It is understandable that structural prompts are typically a text instruction, and there may be multiple corresponding preset keywords. That is, a structural prompt corresponds to a preset keyword set, which includes multiple preset keywords. Similarly, the number of target keywords corresponding to an interface style may also be multiple; that is, an interface style corresponds to a target keyword set, which includes multiple target keywords. Based on this, the target keyword set is matched with preset keyword sets stored in a preset sample library to obtain the matching degree between the target keyword set and each preset keyword set stored in the preset sample library. One preset keyword combination corresponds to one structural prompt. The K preset keyword sets with the highest matching degree to the target keyword set are considered as preset keyword sets that have successfully matched the target keyword. The K structural prompts corresponding to these K preset keyword sets are all considered as sample structural prompts that match the interface style.

[0073] For example, the target keyword set T = {T1, T2, ..., Tm}, and the preset keyword set Pi = {Pi1, Pi2, ...Pin} corresponding to the i-th structural prompt word in the sample library. Calculate the matching score Score(Tj, Pik) between the j-th target keyword Tj (j∈[1, m]) in the target keyword set T and the k-th preset keyword Pik (k∈[1, n]) in the i-th preset keyword set in the sample library. If Tj and Pik are completely identical in string or are predefined synonyms, a maximum base score (e.g., 1.0) is assigned. If there is no exact match, the vector cosine similarity between Tj and Pik is calculated using a lightweight semantic vector model (e.g., Sentence-BERT) as the matching score. This allows "data highlighting" to match preset keywords that are semantically similar but have different expressions, such as "key indicator prominence".

[0074] During the calculation, different weights can be assigned based on the keyword type. For example, keywords related to "layout structure" (such as "grid layout") typically have a higher matching weight than keywords related to "auxiliary style" (such as "minimalist"), to ensure priority in layout matching.

[0075] For each structural suggestion word in the sample library, summarize its overall matching status with all current target keywords. For a single structural suggestion word: iterate through each Pik in its preset keyword set Pi and find its highest matching score Max_Score(Pik, T) with the target keyword set T. This strategy means that as long as a preset keyword can match any target keyword, the structural suggestion word is considered to possess that feature. Take a weighted average or sum the highest matching scores obtained by all Pik words to obtain the overall matching score between the preset keyword set Pi and the target keyword set. The overall matching score comprehensively reflects the overall fit between the preset keyword set and the target keyword set of the structural suggestion word.

[0076] Using a similar approach, obtain a sorted list of all preset keyword sets ranked from highest to lowest overall match score. From this list, select the K preset keyword sets with the highest overall match scores. K is a configurable integer (typically 3-5).

[0077] The structural prompts corresponding to these K preset keyword sets are used as the sample structural prompts for this task. These sample structural prompts can also be called the sample structural prompt set, which includes multiple sample structural prompts.

[0078] In the above embodiments, unstructured aesthetic and layout requirements (target keywords) are associated with preset keywords in the sample library through matching. The ranking mechanism ensures that the most relevant sample structural prompts are selected first. The Top-K strategy balances precision and recall, providing both the most relevant structural prompt examples and a range of high-quality options for comprehensive reference by large models. Matching based on keywords (rather than the entire prompt) requires less computation and has a faster response time. The output Top-K sample structural prompts constitute a small number of high-quality examples (Few-shot) required for large model generation. These examples are highly relevant to the current requirements in terms of layout and style, enabling large models to create based on the most relevant design layouts, greatly improving the success rate of the generated results in terms of structural standardization and visual style consistency, and directly solving the "AI-like" problem.

[0079] In step 208, the generation platform generates target prompts corresponding to the design requirements based on the sample structure prompts and material content. The purpose of this step is to intelligently synthesize the aesthetic framework (sample structure prompts) retrieved in step 206 with the material content extracted in step 204, generating a target prompt that can drive the precise execution of a general-purpose large model. The target prompt can be understood as a complete structured instruction that integrates layout structure, visual style, and content to be filled.

[0080] Sample structure prompts are one or more high-quality structured prompt templates retrieved from a sample library. They define the layout structure and visual style of a UI, for example: "Construct a container with a vertical flow layout, containing a full-width hero area (for placing the main visual), a centered highlighted indicator area, and an action bar fixed at the bottom of the viewport (containing a main button). The overall style uses a dark background with gold borders and text highlights." Material content refers to specific information entities extracted from the design requirements, such as: {Core Indicator: Rate of Return; Button Text: Subscribe Now; Product Theme: Financial Plan}, etc. By merging the sample structure prompts and material content, a target prompt corresponding to the design requirements is obtained. This target prompt is used to instruct the preset large model to produce UI information that is both aesthetically pleasing and meets the design requirements.

[0081] In some embodiments, generating target prompts corresponding to design requirement information based on sample structure prompts and material content includes: generating reference content prompts based on material content; and combining reference content prompts and sample structure prompts to generate target prompts corresponding to design requirement information.

[0082] Specifically, the generation platform converts the source content into a clear content-filling instruction for the larger model, i.e., a reference content prompt. By generating the reference content prompt, the source content is instructive, clarifying its role and presentation intent in the front-end interface, preparing for precise integration with the structural framework. For example, the reference content prompt might be: "Please generate the following: 1. Display the product name, themed 'Stable Financial Management Plan,' in the main title position of the page. 2. Highlight the 'Rate of Return' data in the key indicator highlight area, using a large, eye-catching font. 3. Set the text 'Subscribe Now' on the main button in the bottom operation bar." Then, the generation platform combines the reference content prompts and sample structure prompts according to the preset instruction template to obtain a complete final prompt, i.e., the target prompt, with clear constraints and tasks.

[0083] In some embodiments, target prompts are used to indicate the interface style described by the large model reference sample structure prompts, the material content described by the reference content prompts is filled into the interface style, and the interface style and material content are adapted.

[0084] For example, when combining reference content prompts and sample structure prompts, the following combination logic can be used: Define roles and goals: First, clarify that the large model's task is UI development. Inject aesthetic constraints: Provide retrieved sample structure prompts as "design examples to reference," explicitly requiring the large model to imitate their layout structure and visual style. Inject content and creative space: Then provide reference content prompts as "specific material content to be filled," instructing the model to fill the content into the aforementioned framework. Establish generation rules: Clearly instruct the large model to adapt, for example, fine-tune spacing based on text length while maintaining the overall structure.

[0085] For example, the target prompt could be "Please refer to the layout structure of [Example 1] and [Example 2] (this is an aesthetic constraint), fill in and adapt the content of [User Needs] (this is creative expression)." Here, [Example 1] and [Example 2] are two different sample structure prompts, and [User Needs] can be understood as a reference content prompt.

[0086] For example, the target prompt could be: "You are a senior front-end engineer. Please generate UI code snippets according to the following requirements:" [Design Guidelines and Structural References] Please refer to the layout structure and visual style of Example 1 below: (Insert sample structure hints here, such as a description of 'black and gold style data cards') [Specific Content Materials] The specific content to be displayed is as follows: 1. Product Theme: 'Stable Financial Management Plan'. 2. Core Indicator: 'Rate of Return', which should be prominently displayed in the center of the page with the largest font size. 3. Main Button Text: 'Subscribe Now'.

[0087]

Generation Requirements

[0088] In step 210, the generation platform inputs the target prompt words into a preset large model and outputs user interface information that matches the design requirements.

[0089] The aforementioned pre-defined large model refers to commonly used general-purpose large models, which are general-purpose language models (such as basic versions of GPT-4, Claude, CodeLlama, etc.) that have not undergone full or instruction-based fine-tuning for UI design. Their core characteristics are code generation and natural language understanding capabilities, but they do not internalize design system specifications for specific UI design scenarios. User interface (UI) information refers to the final deliverable of this process, i.e., an executable or presentable UI carrier that meets design requirements.

[0090] The generation platform can submit target prompts to the large model via API calls or local deployment. The large model then directly outputs user interface information that matches the design requirements.

[0091] In some embodiments, the user interface information is user interface code or a rendered user interface; the above-mentioned inputting the target prompt word into a preset large model and outputting user interface information adapted to the design requirements includes: inputting the target prompt word into a preset large model and outputting user interface code or a rendered user interface adapted to the design requirements.

[0092] User interface (UI) code refers to the complete, inline or referenced front-end code, typically in Hyper Text Markup Language (HTML), Cascading Style Sheets (CSS), and optional JavaScript snippets. It is a deliverable that can be edited later. A rendered user interface refers to the visual result of the generated UI code being processed in real-time by a rendering engine. It is usually presented as an image or an interactive preview link, facilitating quick visual confirmation for non-technical roles (such as product or operations).

[0093] The generation platform can submit target prompts to the large model via API calls or local deployment, and the large model can directly generate UI code or rendered UI interfaces.

[0094] For example, in render output mode, after the large model generates UI code, the generation platform can automatically trigger a lightweight rendering process, rendering and generating images or preview pages using Uniform Resource Locators (URLs) as the rendered user interface. This mode is configurable and is typically enabled in end-to-end scenarios where a WYSIWYG (What You See Is What You Get) approach is required.

[0095] For example, the generation platform can perform basic validation on the UI code generated from the large model (such as whether key tags are closed and whether there are obvious syntax errors). If the generation quality is too low or fails, a retry can be triggered to instruct the large model to regenerate new UI code.

[0096] To further facilitate understanding of the embodiments of this application, the following description is provided in conjunction with... Figure 3 Further explanation is needed.

[0097] Figure 3 This is a schematic flowchart illustrating another method for generating user interface information provided in this application embodiment.

[0098] For example, such as Figure 3 As shown, the method for generating this user interface information includes: Step 301: Obtain design requirements information related to user interface design.

[0099] For example, the platform might obtain the following design requirements from operations personnel: "Generate a high-end black and gold style landing page for a financial product, including a large display of the yield rate and a purchase button."

[0100] Step 302: Based on the design requirements information, perform requirement intent analysis to obtain interface style and material content.

[0101] Step 303: Use the sample retrieval tool to retrieve sample structure prompts that match the interface style from the preset sample library.

[0102] This preset sample library can be called the Few-shot high-quality sample library, which stores verified structural cue words with excellent layout and color scheme, i.e., sample structural cue words. By analyzing target keywords such as "high-end", "black gold", and "financial management" through the sample retrieval tool, two verified structural cue word examples with excellent layout and color scheme were retrieved from the Few-shot high-quality sample library, namely [Example 1] and [Example 2].

[0103] Step 304: The prompt synthesizer combines Top-K sample structure prompts and material content that match the interface style retrieved from the preset sample library to generate target prompts.

[0104] The final prompt, or target prompt, is constructed as follows: "Please refer to the layout structure and visual style of [Sample 1] and [Sample 2] (this is an aesthetic constraint), and fill in and adapt the content of [User Requirements] (this is creative expression)."

[0105] Step 305: Input the target prompt words into the general large model and output high-quality UI code.

[0106] The general-purpose model generates code based on the skeletons of [Example 1] and [Example 2], which is equivalent to directly inputting aesthetic standards into the general-purpose model through a high-quality sample library of Few-shots. However, the copy and fine-tuning details are automatically filled in according to the current needs, producing UI code that is both beautiful and meets the requirements. This realizes the boundary definition of AI capabilities. In terms of structure and aesthetics, it is an "imitator" (ensuring high quality), while in terms of content and logic, it is a "creator" (ensuring low-cost development).

[0107] In this embodiment, precise aesthetic and structural constraints are provided through sample structure prompts, while the filling target is clearly defined through the material content. The standardization of the UI code output by the large model is directly inherited from the high-quality sample structure prompts referenced in the target prompts. The large model imitates these verified sample structure prompts, thereby fundamentally ensuring the professionalism of the generated UI code in terms of layout, naming, and style, eliminating AI-like effects and loose structural issues. During the generation of the large model, dynamic material content is adapted to the sample framework, and text length and element spacing are fine-tuned, thus retaining intelligent flexibility to meet specific design needs. The entire process does not require any parameter updates or fine-tuning of the computationally expensive large model. When requirements or design styles change, only the sample library needs to be updated to immediately adapt to the new style, achieving rapid iteration and deployment with near-zero marginal cost.

[0108] All the above-described optional implementation methods can be combined in any way to form optional embodiments of this specification, and will not be described in detail here.

[0109] Figure 4 This is a schematic diagram of the structure of a user interface information generation device provided in the embodiments of this specification. See also: Figure 4 The user interface information generation device 400 includes: Module 401 is used to acquire design requirement information related to user interface design; Extraction module 402 is used to extract interface styles and material content based on the design requirements information; The retrieval module 403 is used to retrieve sample structure prompt words that match the interface style from a preset sample library. The preset sample library stores structure prompt words corresponding to various different interface styles. The prompt word generation module 404 is used to generate target prompt words corresponding to the design requirement information based on the sample structure prompt words and the material content; The output module 405 is used to input the target prompt words into a preset large model and output user interface information that matches the design requirements information.

[0110] In one possible implementation, the preset sample library also stores preset keywords corresponding to structural prompts. The retrieval module is specifically used to determine the target keyword corresponding to the interface style; match the target keyword with the preset keywords stored in the preset sample library; and use the structural prompts corresponding to the preset keywords that successfully match the target keyword as sample structural prompts that match the interface style.

[0111] In one possible implementation, the retrieval module is specifically used to match the target keyword with each preset keyword stored in the preset sample library to obtain the matching degree between the target keyword and each preset keyword stored in the preset sample library; the K preset keywords with the highest matching degree with the target keyword are taken as preset keywords that have successfully matched the target keyword, where K is an integer greater than or equal to 1; and the structural prompt words corresponding to the K preset keywords are all taken as sample structural prompt words that match the interface style.

[0112] In one possible implementation, the above-mentioned generation device further includes: a preset sample library generation module, used to acquire sample user interfaces of various different interface styles, wherein the quality of the sample user interfaces is higher than a preset quality threshold; for each interface style of sample user interface, iteratively generating structural prompt words corresponding to the interface style based on the sample user interface, and storing the generated structural prompt words as structural prompt words corresponding to the interface style in the preset sample library if the generated structural prompt words can reconstruct the sample user interface.

[0113] In one possible implementation, the prompt word generation module is specifically used to generate reference content prompt words based on the material content; and to combine the reference content prompt words and the sample structure prompt words to generate target prompt words corresponding to the design requirement information.

[0114] In one possible implementation, the target prompt word is used to instruct the large model to refer to the interface style described by the sample structure prompt word, fill the material content described by the reference content prompt word into the interface style, and adapt the interface style and the material content.

[0115] In one possible implementation, the user interface information is user interface code or a rendered user interface; the step of inputting the target prompt word into a preset large model and outputting user interface information adapted to the design requirements information includes: inputting the target prompt word into a preset large model and outputting user interface code or a rendered user interface adapted to the design requirements information.

[0116] It should be noted that the user interface information generation apparatus provided in the above embodiments is only illustrated by the division of the above functional modules. In practical applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the computer device can be divided into different functional modules to complete all or part of the functions described above. In addition, the user interface information generation apparatus and the user interface information generation method embodiments provided in the above embodiments belong to the same concept, and their specific implementation process can be found in the method embodiments, which will not be repeated here.

[0117] This specification provides a computer device for performing the above-described method. This computer device can be implemented as a terminal or a server. The structure of a terminal will be described below: Figure 5 This is a schematic diagram of the structure of a terminal provided in an embodiment of this specification. The terminal 500 can be a smartphone, tablet computer, laptop computer, or desktop computer. The terminal 500 may also be referred to as user equipment, portable terminal, laptop terminal, desktop terminal, or other names.

[0118] Typically, terminal 500 includes one or more processors 501 and one or more memories 502.

[0119] Processor 501 may include one or more processing cores, such as a quad-core processor or an octa-core processor. Processor 501 may be implemented using at least one hardware form selected from DSP (Digital Signal Processing), FPGA (Field-Programmable Gate Array), and PLA (Programmable Logic Array). Processor 501 may also include a main processor and a coprocessor. The main processor, also known as a CPU (Central Processing Unit), is used to process data in the wake-up state; the coprocessor is a low-power processor used to process data in the standby state. In some embodiments, processor 501 may integrate a GPU (Graphics Processing Unit), which is responsible for rendering and drawing the content required to be displayed on the screen.

[0120] Memory 502 may include one or more computer-readable storage media, which may be non-transitory. Memory 502 may also include high-speed random access memory and non-volatile memory, such as one or more disk storage devices or flash memory devices. In some embodiments, the non-transitory computer-readable storage media in memory 502 are used to store at least one computer program, which is executed by processor 501 to implement the method for generating user interface information provided in the method embodiments of this specification.

[0121] In some embodiments, the terminal 500 may also optionally include a peripheral device interface 503 and at least one peripheral device. The processor 501, memory 502, and peripheral device interface 503 can be connected via a bus or signal line. Each peripheral device can be connected to the peripheral device interface 503 via a bus, signal line, or circuit board. Specifically, the peripheral device includes at least one of the following: a radio frequency circuit 504, a display screen 505, a camera assembly 506, an audio circuit 507, and a power supply 508.

[0122] Peripheral device interface 503 can be used to connect at least one I / O (Input / Output) related peripheral device to processor 501 and memory 502. In some embodiments, processor 501, memory 502 and peripheral device interface 503 are integrated on the same chip or circuit board; in some other embodiments, any one or two of processor 501, memory 502 and peripheral device interface 503 can be implemented on separate chips or circuit boards, which is not limited in this embodiment.

[0123] The radio frequency (RF) circuit 504 is used to receive and transmit RF (Radio Frequency) signals, also known as electromagnetic signals. The RF circuit 504 communicates with communication networks and other communication devices via electromagnetic signals. The RF circuit 504 converts electrical signals into electromagnetic signals for transmission, or converts received electromagnetic signals back into electrical signals. Optionally, the RF circuit 504 may include: an antenna system, an RF transceiver, one or more amplifiers, a tuner, an oscillator, a digital signal processor, a codec chipset, a user identity module card, etc.

[0124] Display screen 505 is used to display a user interface (UI). This UI may include graphics, text, icons, video, and any combination thereof. When display screen 505 is a touch display screen, it also has the ability to collect touch signals on or above its surface. These touch signals can be input as control signals to processor 501 for processing. In this case, display screen 505 can also be used to provide virtual buttons and / or a virtual keyboard, also known as soft buttons and / or a soft keyboard.

[0125] The camera assembly 506 is used to capture images or videos. Optionally, the camera assembly 506 includes a front-facing camera and a rear-facing camera. Typically, the front-facing camera is located on the front panel of the terminal, and the rear-facing camera is located on the back of the terminal.

[0126] The audio circuit 507 may include a microphone and a speaker. The microphone is used to collect sound waves from the user and the environment, and convert the sound waves into electrical signals that are input to the processor 501 for processing, or input to the radio frequency circuit 504 to realize voice communication.

[0127] Power supply 508 is used to supply power to the various components in terminal 500. Power supply 508 can be AC ​​power, DC power, a disposable battery, or a rechargeable battery.

[0128] In some embodiments, the terminal 500 further includes one or more sensors 509. The one or more sensors 509 include, but are not limited to, an accelerometer 510, a gyroscope 511, a pressure sensor 512, an optical sensor 513, and a proximity sensor 514.

[0129] Accelerometer 510 can detect the magnitude of acceleration on the three coordinate axes of a coordinate system established with terminal 500.

[0130] The gyroscope sensor 511 can detect the orientation and rotation angle of the terminal 500. The gyroscope sensor 511 can work in conjunction with the accelerometer sensor 510 to collect the user's 3D movements on the terminal 500.

[0131] The pressure sensor 512 can be installed on the side bezel of the terminal 500 and / or on the lower layer of the display screen 505. When the pressure sensor 512 is installed on the side bezel of the terminal 500, it can detect the user's grip signal on the terminal 500, and the processor 501 can perform left / right hand recognition or quick operation based on the grip signal collected by the pressure sensor 512. When the pressure sensor 512 is installed on the lower layer of the display screen 505, the processor 501 can control the operable controls on the UI interface based on the user's pressure operation on the display screen 505.

[0132] An optical sensor 513 is used to collect ambient light intensity. In one embodiment, the processor 501 can control the display brightness of the display screen 505 based on the ambient light intensity collected by the optical sensor 513.

[0133] The proximity sensor 514 is used to acquire the distance between the user and the front of the terminal 500.

[0134] Those skilled in the art will understand that Figure 5 The structure shown does not constitute a limitation on terminal 500, and may include more or fewer components than shown, or combine certain components, or use different component arrangements.

[0135] The aforementioned computer equipment can also be implemented as a server. The structure of a server is described below: Figure 6This is a schematic diagram of a server structure provided in an embodiment of this specification. The server 600 can vary significantly due to differences in configuration or performance. It may include one or more Central Processing Units (CPUs) 601 and one or more memories 602. The one or more memories 602 store at least one computer program, which is loaded and executed by the one or more processors 601 to implement the methods provided in the various method embodiments described above. Of course, the server 600 may also have wired or wireless network interfaces, a keyboard, and input / output interfaces for input and output. The server 600 may also include other components for implementing device functions, which will not be elaborated upon here.

[0136] In an exemplary embodiment, a computer-readable storage medium is also provided, such as a memory including a computer program that can be executed by a processor to complete the method for generating user interface information in the above embodiments. For example, the computer-readable storage medium may be a read-only memory (ROM), a random access memory (RAM), a compact disc read-only memory (CD-ROM), magnetic tape, floppy disk, and optical data storage device, etc.

[0137] In an exemplary embodiment, a computer program product or computer program is also provided, which includes program code stored in a computer-readable storage medium. A processor of a computer device reads the program code from the computer-readable storage medium and executes the program code, causing the computer device to perform the aforementioned method for generating user interface information.

[0138] In some embodiments, the computer program described in this specification may be deployed and executed on a single computer device, or on multiple computer devices located in one location, or on multiple computer devices distributed across multiple locations and interconnected via a communication network. These multiple computer devices distributed across multiple locations and interconnected via a communication network may constitute a blockchain system.

[0139] Those skilled in the art will understand that all or part of the steps of the above embodiments can be implemented by hardware or by a program instructing related hardware. The program can be stored in a computer-readable storage medium, such as a read-only memory, a disk, or an optical disk.

[0140] The above are merely optional embodiments of this specification and are not intended to limit this specification. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this specification shall be included within the scope of protection of this specification.

Claims

1. A method for generating user interface information, characterized in that, The method includes: Obtain design requirements information related to user interface design; Based on the design requirements, extract the interface style and material content; Determine the target keywords corresponding to the interface style; The target keyword is matched with each preset keyword stored in the preset sample library to obtain the matching degree between the target keyword and each preset keyword stored in the preset sample library. The preset sample library stores structural prompt words corresponding to various interface styles and preset keywords corresponding to the structural prompt words. The K preset keywords whose matching degree with the target keyword is in the top K positions are selected as preset keywords that successfully match the target keyword, where K is an integer greater than or equal to 1; The structural prompts corresponding to the K preset keywords are all used as sample structural prompts that match the interface style; Based on the sample structure prompts and the material content, generate target prompts that correspond to the design requirements information; Input the target prompt words into a preset large model, and output user interface information that matches the design requirements.

2. The method according to claim 1, characterized in that, The preset sample library is obtained in the following way: Obtain sample user interfaces with various interface styles, wherein the quality of the sample user interfaces is higher than a preset quality threshold; For each interface style sample user interface, based on the sample user interface, structural prompts corresponding to the interface style are generated iteratively. If the generated structural prompts can reconstruct the sample user interface, the generated structural prompts are stored in the preset sample library as structural prompts corresponding to the interface style.

3. The method according to claim 1, characterized in that, The step of generating target prompts corresponding to the design requirement information based on the sample structure prompts and the material content includes: Based on the provided material, generate reference content prompts; The reference content prompts and the sample structure prompts are combined to generate target prompts that correspond to the design requirement information.

4. The method according to claim 3, characterized in that, The target prompt word is used to instruct the large model to refer to the interface style described by the sample structure prompt word, fill the material content described by the reference content prompt word into the interface style, and adapt the interface style and the material content.

5. The method according to claim 1, characterized in that, The user interface information is user interface code or a rendered user interface; The step of inputting the target prompt words into a preset large model and outputting user interface information adapted to the design requirements includes: Input the target prompt into a preset large model, and output user interface code or rendered user interface that matches the design requirements information.

6. A device for generating user interface information, characterized in that, The device includes: The acquisition module is used to acquire design requirement information related to user interface design; The extraction module is used to extract interface styles and material content based on the design requirements information. A retrieval module is used to determine target keywords corresponding to the interface style; match the target keywords with each preset keyword stored in a preset sample library to obtain the matching degree between the target keywords and each preset keyword stored in the preset sample library, wherein the preset sample library stores structural prompt words corresponding to various different interface styles and preset keywords corresponding to the structural prompt words; select the K preset keywords with the highest matching degree between them and the target keywords as preset keywords that have successfully matched the target keywords, where K is an integer greater than or equal to 1; and select the structural prompt words corresponding to the K preset keywords as sample structural prompt words that match the interface style. The prompt word generation module is used to generate target prompt words corresponding to the design requirement information based on the sample structure prompt words and the material content; The output module is used to input the target prompt words into a preset large model and output user interface information that matches the design requirements information.

7. A computer device, characterized in that, The computer device includes one or more processors and one or more memories, wherein at least one computer program is stored in the one or more memories, and the computer program is loaded and executed by the one or more processors to implement the method as described in any one of claims 1 to 5.

8. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores at least one computer program, which is loaded and executed by a processor to implement the method as described in any one of claims 1 to 5.

Citation Information

Patent Citations

  • Method for generating page code and electronic equipment

    CN120144123A

  • Code generation method and device based on large model, equipment and medium

    CN120848850A

  • AI-based low-code visual component dynamic generation method and system

    CN121501270A

  • Generating Graphical User Interface Designs Using Natural Language Processing

    US20250244973A1