UI design style optimization method and system based on large model

Abstract

The invention relates to the technical field of large models, in particular to a UI design style optimization method and system based on a large model, and the method comprises the following steps: inputting, feature extraction, style analysis, optimization and outputting. The method has the beneficial effects that the design style is automatically optimized, and the time and energy of manual adjustment are reduced. Through analysis and optimization of a large model, the consistency and speciality of design styles are ensured. And even non-professional designers can easily realize conversion and optimization of design styles. And the user can quickly adjust the design style according to own requirements to obtain a better design result.

Description

Technical Field

[0001] This invention relates to the field of large model technology, specifically to a method and system for optimizing UI design style based on large models. Background Technology

[0002] In current UI design processes, designers typically spend a significant amount of time and effort adjusting design styles to meet diverse needs. While existing design tools offer templates and style libraries, they have limitations in style conversion and optimization, failing to efficiently transform one design style into another. Furthermore, manually adjusting the style of design elements requires advanced design skills and experience, making it challenging for non-professional designers. Summary of the Invention

[0003] The purpose of this invention is to provide a UI design style optimization method and system based on a large model, so as to solve the problems mentioned in the background art.

[0004] To achieve the above objectives, the present invention provides the following technical solution: a UI design style optimization method based on a large model, comprising the following steps:

[0005] Input Steps: Provide an interface to receive target design style images and current UI design drafts uploaded by users in various common file formats; preprocess the uploaded images, check the image format, and prompt users to convert or re-upload images that do not meet the format specifications; adjust the image resolution according to internal standards, use image scaling algorithms to reduce the resolution of images with too high resolution, and use super-resolution reconstruction technology to enhance the clarity and details of images with too low resolution; set a progress bar and feedback prompts to let users know the progress of image upload and preprocessing.

[0006] Feature extraction steps: Using a pre-trained large model, the visual model with the Transformer architecture, the input image is converted into tensor format, and features at different levels are extracted through a multi-layer neural network; for UI design images, key features such as color distribution, layout structure, font style, and texture are extracted, and corresponding feature vectors are generated; data augmentation techniques are used to perform random operations on the input image to increase data diversity and improve the accuracy and robustness of feature extraction.

[0007] Preferably, the method also includes a style analysis step: based on the feature vectors obtained by the feature extraction module, the target design style is analyzed; during color analysis, a clustering algorithm is used to cluster the color distribution feature vectors of the target design style image, determine the optimal number of clusters, divide the main colors and auxiliary colors, and calculate the color proportions and matching relationships; during layout structure analysis, a graph neural network is used to model the layout structure features, treating UI design graph elements as nodes and element relationships as edges, and learning the layout topology and rules; during font style analysis, natural language processing technology is used in conjunction with font library attribute information to identify and analyze font features and extract font style characteristics; during texture and decorative element analysis, a convolutional neural network is used to further analyze texture features and identify key features; and a user feedback mechanism is introduced, allowing users to annotate and correct the analysis results.

[0008] Preferably, the optimization steps also include: optimizing the current UI design based on the key elements of the target design style extracted by the style analysis module; when adjusting the color scheme, using a color migration algorithm to convert the current design color pixel by pixel based on the target style color, and introducing color balance and contrast adjustment techniques to avoid color distortion and inconsistency; when modifying the layout structure, adjusting the grid system of the current design according to the target style layout rules, and repositioning and aligning elements; when replacing or adjusting the font style, selecting matching fonts from the font library, uniformly replacing and adjusting the fonts in the current design, and optimizing font attributes; when adding or modifying textures and decorative elements, using a generative adversarial network to generate blending elements based on the target style characteristics and adding them to the current design; and using real-time preview technology, allowing users to view the optimization effects and adjust optimization parameters.

[0009] Preferably, the output steps are as follows: the optimized UI design is displayed to the user in multiple formats; the user can choose to save the design in the original upload format or other commonly used formats; a layered output function is provided, which outputs the design elements according to different layers, making it convenient for users to operate independently in other design software; high-resolution display technology is used to accurately present the details and colors of the design; a comparison display function is provided, which displays the design before and after optimization side by side; users can evaluate and provide feedback on the optimization results, and the system optimizes and improves the optimization algorithm based on the feedback.

[0010] Preferably, the pre-trained large model is the CLIP model, which is pre-trained on large-scale image-text pair data and can learn rich visual semantic information. In the feature extraction process, the CLIP model converts the input image into a tensor format suitable for processing, and then extracts different levels of features from basic visual features such as bottom edge and texture to high-level semantic concepts and object features through a multi-layer neural network.

[0011] A system for a UI design style optimization method based on a large model includes:

[0012] The input module provides an interface to receive target design style images and current UI design drafts uploaded by users in various common file formats. It preprocesses the uploaded images, including checking image formats and prompting users to convert or re-upload images that do not meet format specifications. It adjusts image resolution according to internal standards, using image scaling algorithms to reduce resolution for overly high-resolution images and super-resolution reconstruction technology to enhance clarity and detail for underly low-resolution images. A progress bar and feedback prompts are provided to keep users informed of the image upload and preprocessing progress.

[0013] The feature extraction module utilizes a pre-trained large model, a visual model based on the Transformer architecture, to convert the input image into a tensor format and then perform deep feature extraction through a multi-layer neural network. It focuses on extracting key features such as color distribution, layout structure, font style, and texture features from UI design images and generates corresponding feature vectors. At the same time, data augmentation techniques are used to increase data diversity to improve the accuracy and robustness of feature extraction.

[0014] The style analysis module analyzes the target design style based on the feature vectors obtained from the feature extraction module. In terms of color analysis, clustering algorithms are used to divide the main colors and auxiliary colors and calculate their proportions and matching relationships. The layout structure analysis uses graph neural networks to learn the layout topology and rules. The font style analysis uses natural language processing technology to identify and analyze font features and extract style characteristics. The texture and decorative element analysis uses convolutional neural networks to extract key features. A user feedback mechanism is also introduced to allow users to annotate and correct the analysis results.

[0015] The optimization module comprehensively optimizes the current UI design based on the key elements of the target design style extracted by the style analysis module. This includes adjusting the color scheme using a color migration algorithm and introducing color balance and contrast adjustment techniques, modifying the layout structure according to the target style layout rules, selecting and matching fonts from the font library to replace or adjust font styles and optimize font attributes, adding or modifying textures and decorative elements using generative adversarial networks, and using real-time preview technology to allow users to view the optimization effects and adjust optimization parameters.

[0016] The output module displays the optimized UI design in various formats to the user. Users can choose to save the design in the original upload format or other commonly used formats. It provides a layered output function to facilitate users to operate the layers independently in other design software. It uses high-resolution display technology to accurately present the details and colors of the design. It provides a comparison display function to show the design before and after optimization side by side. It collects user evaluations and feedback to optimize and improve the optimization algorithm.

[0017] Preferably, in the input module, the pre-trained large model is the CLIP model, which is pre-trained on large-scale image-text pair data and can learn rich visual semantic information. During feature extraction, the CLIP model converts the input image into a tensor format suitable for processing, and then extracts different levels of features from basic visual features such as bottom edges and textures to high-level semantic concepts and object features through a multi-layer neural network.

[0018] Preferably, in the style analysis module, the color analysis uses the K-Means clustering algorithm, and the optimal number of clusters is determined through multiple experiments; in the layout structure analysis, each element in the UI design drawing is regarded as a node in the drawing, and the positional relationship and constraint relationship between elements are regarded as edges. The topology and layout rules of the layout are learned through graph neural networks, including the size of the grid system, alignment, and element spacing; the font style analysis combines the font attribute information in the font library and extracts style characteristics by analyzing the font's layout and visual effect in the design drawing; the texture and decorative element analysis uses convolutional neural networks to identify repeating patterns, border styles, and shadow effect elements to extract key features.

[0019] Preferably, in the optimization module, when adjusting the color scheme, the main and auxiliary colors of the target style are used as a benchmark to perform pixel-by-pixel conversion on the colors in the current design drawing, and color balance and contrast adjustment techniques are introduced to ensure that the converted color scheme has a good visual effect; when modifying the layout structure, the grid system of the current design drawing is first adjusted, the size and proportion are redivided, and then the elements are repositioned and aligned by calculating the element position offset; when replacing or adjusting the font style, matching fonts are selected from the font library, and the fonts in the current design drawing are uniformly replaced and adjusted, and the font attributes are optimized according to the font position and function; when adding or modifying texture and decorative elements, a generative adversarial network model is trained to learn the distribution rules and generation patterns of texture and decorative elements of the target style, generate high-quality elements, and add them reasonably to the current design drawing.

[0020] Preferably, the output module provides common output formats including PDF and PSD; the layered output function outputs each element in the design drawing according to different layers; the comparison display function displays the UI design drawing before optimization and the design drawing after optimization side by side; the system optimizes and improves the optimization algorithm based on the user's evaluation and feedback on the optimization results, so as to improve the optimization effect of the system and user satisfaction.

[0021] Compared with the prior art, the beneficial effects of the present invention are:

[0022] This invention proposes a UI design style optimization method and system based on a large model, which automatically optimizes design styles, reducing the time and effort required for manual adjustments. Through the analysis and optimization of the large model, it ensures the consistency and professionalism of the design style. Even non-professional designers can easily switch and optimize design styles. Users can quickly adjust their design styles according to their needs to achieve better design results. Attached Figure Description

[0023] Figure 1 This is a flowchart of the method of the present invention. Detailed Implementation

[0024] To make the objectives, technical solutions, and advantages of the present invention clear and complete, the embodiments of the present invention will be further described in detail below with reference to the accompanying drawings. It should be understood that the specific embodiments described herein are only some, not all, embodiments of the present invention, and are merely illustrative of the embodiments of the present invention. They are not intended to limit the embodiments of the present invention. All other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0025] Example 1, please refer to Figure 1 This invention provides a technical solution: a UI design style optimization method based on a large model, comprising the following steps:

[0026] Input Steps: Provide an interface to receive target design style images and current UI design drafts uploaded by users in various common file formats; preprocess the uploaded images, check the image format, and prompt the user to convert the format or re-upload images that do not meet the format specifications; adjust the image resolution according to internally set standards, use image scaling algorithms to reduce the resolution of images with too high resolution, and use super-resolution reconstruction technology to enhance the clarity and details of images with too low resolution; set a progress bar and feedback prompts to let users know the progress of image upload and preprocessing.

[0027] Feature extraction steps: Using a pre-trained large model, the visual model with the Transformer architecture, the input image is converted into tensor format, and features at different levels are extracted through a multi-layer neural network; for UI design images, key features such as color distribution, layout structure, font style, and texture are extracted, and corresponding feature vectors are generated; data augmentation techniques are used to perform random operations on the input image to increase data diversity and improve the accuracy and robustness of feature extraction.

[0028] Style analysis steps: Based on the feature vectors obtained from the feature extraction module, the target design style is analyzed; during color analysis, a clustering algorithm is used to cluster the color distribution feature vectors of the target design style image, determine the optimal number of clusters, divide the primary and secondary colors, and calculate the color proportions and matching relationships; during layout structure analysis, a graph neural network is used to model the layout structure features, treating UI design graph elements as nodes and element relationships as edges, learning the layout topology and rules; during font style analysis, natural language processing technology is used in conjunction with font library attribute information to identify and analyze font features and extract font style characteristics; during texture and decorative element analysis, a convolutional neural network is used to further analyze texture features and identify key features; a user feedback mechanism is introduced, allowing users to annotate and correct the analysis results.

[0029] Optimization steps: Based on the key elements of the target design style extracted by the style analysis module, the current UI design is optimized; when adjusting the color scheme, a color migration algorithm is used to transform the colors of the current design pixel by pixel based on the target style colors, and color balance and contrast adjustment techniques are introduced to avoid color distortion and inconsistency; when modifying the layout structure, the grid system of the current design is adjusted according to the layout rules of the target style, and elements are repositioned and aligned; when replacing or adjusting the font style, matching fonts are selected from the font library, and the fonts of the current design are uniformly replaced and adjusted, and font attributes are optimized; when adding or modifying textures and decorative elements, generative adversarial networks are used to generate blending elements based on the characteristics of the target style and add them to the current design; real-time preview technology is used, allowing users to view the optimization effects and adjust optimization parameters.

[0030] The output steps are as follows: the optimized UI design is displayed to the user in multiple formats; users can choose to save the design in the original upload format or other commonly used formats; a layered output function is provided, which outputs the design elements according to different layers, making it convenient for users to operate independently in other design software; high-resolution display technology is used to accurately present the details and colors of the design; a comparison display function is provided, which displays the design before and after optimization side by side; users can evaluate and provide feedback on the optimization results, and the system optimizes and improves the optimization algorithm based on the feedback.

[0031] The pre-trained large model is the CLIP model, which is pre-trained on large-scale image-text pair data and can learn rich visual semantic information. During the feature extraction process, the CLIP model converts the input image into a tensor format suitable for processing, and then extracts different levels of features from basic visual features such as bottom edges and textures to high-level semantic concepts and object features through multi-layer neural networks.

[0032] Example 2, based on Example 1, proposes a system for UI design style optimization based on a large model, including:

[0033] I. Input Module

[0034] The input module, as the starting point for the entire system's interaction with the user, undertakes the crucial task of receiving and initially processing user input information. Users can upload images of their target design style and current UI design drafts in various common file formats, such as JPEG, PNG, and SVG, through an intuitive interface. To ensure the accuracy and efficiency of subsequent processing, the system performs rigorous preprocessing on uploaded images. First, the system checks if the image format meets the requirements. For images that do not conform to the format specifications, the system will prompt the user to convert the format or re-upload. Second, regarding image resolution, the system adjusts images that are too high or too low resolution according to internally set standards. For images with excessively high resolution, advanced image scaling algorithms are used to reduce the resolution while maintaining image quality; for images with excessively low resolution, super-resolution reconstruction technology is used to enhance image clarity and detail, bringing them to the optimal state for system processing. Furthermore, to improve user experience, the input module also includes a progress bar and feedback prompts, allowing users to understand the real-time progress of image uploading and preprocessing.

[0035] II. Feature Extraction Module

[0036] The feature extraction module is the core foundation of the entire optimization process. It utilizes pre-trained large models, such as visual models based on the Transformer architecture, to perform deep feature extraction on the input target design style image and the current UI design. Taking the CLIP model as an example, this model is pre-trained on large-scale image-text pairs, enabling it to learn rich visual semantic information. During feature extraction, the CLIP model first converts the input image into a tensor format suitable for model processing, and then extracts features through a multi-layer neural network. Different layers of the model extract features at different levels, from basic visual features such as edges and textures at the bottom layer to semantic concepts and object features at the higher level. For UI design images, the system focuses on extracting key features such as color distribution, layout structure, font style, and texture features. When extracting color distribution, the model analyzes the proportion and combination relationships of various colors in the image to generate color distribution feature vectors; for layout structure, it extracts layout structure features by analyzing information such as the position, size, and alignment of elements; regarding font style, the model can identify attributes such as font type, font size, and letter spacing, and convert them into corresponding feature vectors; and texture features are extracted by analyzing information such as repeating patterns and surface texture in the image. To improve the accuracy and robustness of feature extraction, the system also employs data augmentation techniques, performing random rotation, flipping, scaling, and other operations on the input images to increase data diversity, thereby enabling the model to learn more generalizable feature representations.

[0037] III. Style Analysis Module

[0038] The style analysis module, based on the feature vectors obtained from the feature extraction module, performs in-depth analysis of the target design style and extracts key style elements. For color analysis, the system uses clustering algorithms, such as K-Means, to cluster the color distribution feature vectors of the target design style image. Through multiple experiments, the optimal number of clusters is determined, dividing the colors in the image into primary and secondary colors, and calculating the proportion of each color in the entire image and their interrelationships. For layout structure, the system uses a graph neural network (GNN) to model the layout structure features. Each element in the UI design drawing is considered a node in the graph, and the positional and constraint relationships between elements are considered edges. The GNN learns the topological structure and layout rules of the layout, such as the size of the grid system, alignment, and element spacing. In font style analysis, the system utilizes natural language processing (NLP) technology, combined with font attribute information from a font library, to identify and analyze features such as font type, font size, and letter spacing. Simultaneously, by analyzing the font's layout and visual effect in the design drawing, the system extracts the font's stylistic characteristics. For texture and decorative elements, the system employs a convolutional neural network (CNN) to further analyze texture features. By identifying elements such as repeating patterns, border styles, and shadow effects, it extracts key features of texture and decorative elements. Furthermore, the style analysis module incorporates a user feedback mechanism, allowing users to annotate and correct the analysis results, enabling the system to better understand users' interpretations and needs regarding style elements.

[0039] IV. Optimization Module

[0040] The optimization module is a crucial step in achieving UI design style transformation. Based on the key elements of the target design style extracted by the style analysis module, it comprehensively optimizes the current UI design. When adjusting the color scheme, the system employs a color migration algorithm, using the primary and secondary colors of the target style as a baseline to transform the colors in the current design pixel by pixel. To avoid color distortion and inconsistencies during the transformation process, the system introduces color balance and contrast adjustment techniques to ensure that the transformed color scheme maintains the target style while offering good visual appeal. Regarding layout structure modifications, the system adjusts the grid system of the current design according to the layout rules of the target style, re-dividing the grid size and proportions. Then, by calculating the positional offsets between elements, it repositions and aligns each element to meet the layout requirements of the target style. When replacing or adjusting font styles, the system selects fonts from a vast font library that match the font type of the target style and uniformly replaces and adjusts the fonts in the current design based on the font size and letter spacing settings of the target style. Simultaneously, the system optimizes font attributes such as color, bolding, and italics based on the font's specific position and function in the design, enhancing readability and visual appeal. For adding or modifying textures and decorative elements, the system utilizes a Generative Adversarial Network (GAN) to generate textures and decorative elements that blend seamlessly with the current design, based on the characteristics of the target style's textures and decorative elements. By training the GAN model, it learns the distribution patterns and generation modes of the target style's textures and decorative elements, thereby generating high-quality textures and decorative elements and appropriately adding them to the current design to enhance its overall style. During the optimization process, the system also employs real-time preview technology, allowing users to view the optimization effects at any time and adjust optimization parameters according to their needs, achieving personalized style optimization.

[0041] V. Output Module

[0042] The output module is responsible for outputting and displaying the optimized UI design drafts to users in various formats. Users can choose to save the optimized design drafts in the original uploaded format, or select other commonly used output formats such as PDF and PSD according to their actual needs. To facilitate further editing and processing of the design drafts, the output module also provides a layered output function, outputting each element of the design draft according to different layers. Users can operate on each layer independently in other design software. When displaying the optimization results, the output module uses high-resolution display technology to ensure that the details and colors of the design drafts are accurately presented. The system also provides a comparison display function, showing the UI design drafts before and after optimization side by side, allowing users to intuitively see the effect of style optimization. Furthermore, users can evaluate and provide feedback on the optimization results. The system will optimize and improve the optimization algorithm based on user feedback, continuously improving the system's optimization effect and user satisfaction.

[0043] Although embodiments of the invention have been shown and described, it will be understood by those skilled in the art that various changes, modifications, substitutions and alterations can be made to these embodiments without departing from the principles and spirit of the invention, the scope of which is defined by the appended claims and their equivalents.

Claims

1. A UI design style optimization method based on a large model, characterized in that: Includes the following steps: Input steps: Provide an operation interface to receive target design style images and current UI design drafts uploaded by users in various common file formats; Preprocess uploaded images, check image formats, and prompt users to convert or re-upload images that do not meet format specifications; The image resolution is adjusted according to internally set standards. For images with excessively high resolution, an image scaling algorithm is used to reduce the resolution. For images with excessively low resolution, super-resolution reconstruction technology is used to enhance clarity and detail. Progress bars and feedback prompts are set up to let users know the progress of image uploading and preprocessing. Feature extraction steps: Using a pre-trained large model, the visual model with the Transformer architecture, the input image is converted into tensor format, and features at different levels are extracted through a multi-layer neural network; for UI design images, key features such as color distribution, layout structure, font style, and texture are extracted, and corresponding feature vectors are generated; data augmentation techniques are used to perform random operations on the input image to increase data diversity and improve the accuracy and robustness of feature extraction.

2. The UI design style optimization method based on a large model according to claim 1, characterized in that: It also includes a style analysis step: based on the feature vectors obtained from the feature extraction module, the target design style is analyzed; during color analysis, a clustering algorithm is used to cluster the color distribution feature vectors of the target design style image, determine the optimal number of clusters, divide the main colors and auxiliary colors, and calculate the color proportions and matching relationships; during layout structure analysis, a graph neural network is used to model the layout structure features, treating UI design graph elements as nodes and element relationships as edges, and learning the layout topology and rules; during font style analysis, natural language processing technology is used in conjunction with font library attribute information to identify and analyze font features and extract font style characteristics; during texture and decorative element analysis, a convolutional neural network is used to further analyze texture features and identify key features; a user feedback mechanism is introduced, allowing users to annotate and correct the analysis results.

3. The UI design style optimization method based on a large model according to claim 2, characterized in that: It also includes optimization steps: optimizing the current UI design based on the key elements of the target design style extracted by the style analysis module; when adjusting the color scheme, using a color migration algorithm to convert the current design color pixel by pixel based on the target style color, and introducing color balance and contrast adjustment technology to avoid color distortion and inconsistency; when modifying the layout structure, adjusting the grid system of the current design according to the target style layout rules, and repositioning and aligning elements. When replacing or adjusting font styles, matching fonts are selected from the font library to uniformly replace and adjust the fonts in the current design, and font attributes are optimized. When adding or modifying textures and decorative elements, generative adversarial networks are used to generate blending elements based on the target style characteristics and add them to the current design. Real-time preview technology is used, allowing users to view the optimization effects and adjust optimization parameters.

4. The UI design style optimization method based on a large model according to claim 3, characterized in that: The output steps are as follows: output and display the optimized UI design to the user in multiple formats; Users can choose to save the design in the original upload format or other commonly used formats; It offers a layered output function, allowing design elements to be output in different layers, making it convenient for users to operate independently in other design software; it uses high-resolution display technology to accurately present the details and colors of the design drawings; it provides a comparison display function, showing the design drawings before and after optimization side by side; users can evaluate and provide feedback on the optimization results, and the system optimizes and improves the optimization algorithm based on the feedback.

5. The UI design style optimization method based on a large model according to claim 4, characterized in that: The pre-trained large model is the CLIP model, which is pre-trained on large-scale image-text pair data and can learn rich visual semantic information. During the feature extraction process, the CLIP model converts the input image into a tensor format suitable for processing, and then extracts different levels of features from basic visual features such as bottom edges and textures to high-level semantic concepts and object features through multi-layer neural networks.

6. A system for the UI design style optimization method based on a large model according to claim 5, characterized in that: include: The input module provides an interface to receive target design style images and current UI design images uploaded by users in various common file formats. It also preprocesses the uploaded images, including checking the image format and prompting users to convert the format or re-upload images that do not meet the format specifications. The image resolution is adjusted according to internally set standards. For images with excessively high resolution, an image scaling algorithm is used to reduce the resolution. For images with excessively low resolution, super-resolution reconstruction technology is used to enhance clarity and detail. Progress bars and feedback prompts are set up to let users know the progress of image uploading and preprocessing. The feature extraction module utilizes a pre-trained large model, a visual model based on the Transformer architecture, to convert the input image into a tensor format and then perform deep feature extraction through a multi-layer neural network. It focuses on extracting key features such as color distribution, layout structure, font style, and texture features from UI design images and generates corresponding feature vectors. At the same time, data augmentation techniques are used to increase data diversity to improve the accuracy and robustness of feature extraction. The style analysis module analyzes the target design style based on the feature vectors obtained from the feature extraction module. In terms of color analysis, clustering algorithms are used to divide the main colors and auxiliary colors and calculate their proportions and matching relationships. The layout structure analysis uses graph neural networks to learn the layout topology and rules. The font style analysis uses natural language processing technology to identify and analyze font features and extract style characteristics. The texture and decorative element analysis uses convolutional neural networks to extract key features. A user feedback mechanism is also introduced to allow users to annotate and correct the analysis results. The optimization module comprehensively optimizes the current UI design based on the key elements of the target design style extracted by the style analysis module. This includes adjusting the color scheme using a color migration algorithm and introducing color balance and contrast adjustment techniques, modifying the layout structure according to the target style layout rules, selecting and matching fonts from the font library to replace or adjust font styles and optimize font attributes, adding or modifying textures and decorative elements using generative adversarial networks, and using real-time preview technology to allow users to view the optimization effects and adjust optimization parameters. The output module displays the optimized UI design in various formats to the user. Users can choose to save the design in the original upload format or other commonly used formats. It provides a layered output function to facilitate users to operate the layers independently in other design software. It uses high-resolution display technology to accurately present the details and colors of the design. It provides a comparison display function to show the design before and after optimization side by side. It collects user evaluations and feedback to optimize and improve the optimization algorithm.

7. The system according to claim 6, characterized in that: In the input module, the pre-trained large model is the CLIP model, which is pre-trained on large-scale image-text pairs and can learn rich visual semantic information. During feature extraction, the CLIP model converts the input image into a tensor format suitable for processing, and then extracts different levels of features from low-level edges and texture basic visual features to high-level semantic concepts and object features through multi-layer neural networks.

8. The system according to claim 7, characterized in that: In the style analysis module, the color analysis uses the K-Means clustering algorithm, and the optimal number of clusters is determined through multiple experiments. In the layout structure analysis, each element in the UI design drawing is regarded as a node in the drawing, and the positional relationship and constraint relationship between elements are regarded as edges. The topology and layout rules of the layout are learned through graph neural network, including the size of the grid system, alignment, and element spacing. Font style analysis combines font attribute information from the font library to extract style characteristics by analyzing the font's layout and visual effects in the design drawing; texture and decorative element analysis uses convolutional neural networks to identify repeating patterns, border styles, and shadow effects to extract key features.

9. A system according to claim 8, characterized in that: In the optimization module, when adjusting the color scheme, the main and auxiliary colors of the target style are used as the basis to perform pixel-by-pixel conversion on the colors in the current design drawing, and color balance and contrast adjustment techniques are introduced to ensure that the converted color scheme has a good visual effect; when modifying the layout structure, the grid system of the current design drawing is first adjusted, the size and proportion are redivided, and then the elements are repositioned and aligned by calculating the element position offset. When replacing or adjusting font styles, matching fonts are selected from the font library to uniformly replace and adjust the fonts in the current design. Font attributes are optimized based on font position and function. When adding or modifying textures and decorative elements, a generative adversarial network model is trained to learn the distribution patterns and generation modes of textures and decorative elements in the target style, generating high-quality elements and adding them appropriately to the current design.

10. A system according to claim 9, characterized in that: The output module provides common output formats including PDF and PSD; the layered output function outputs the various elements in the design drawing according to different layers. The comparison display function shows the UI design before and after optimization side by side; the system makes targeted optimizations and improvements to the optimization algorithm based on user evaluation and feedback on the optimization results, so as to improve the optimization effect of the system and user satisfaction.

Images