User interface generation method and system based on artificial intelligence and gestalt psychology

Abstract

This invention provides a user interface generation method and system based on artificial intelligence and Gestalt psychology. The method includes: acquiring multiple first sample images; performing image segmentation on each first sample image to obtain multiple second sample images, each second sample image containing a main page display area and an auxiliary page display area; extracting features from the graphic components in each second sample image to obtain feature vectors corresponding to each graphic component; clustering the graphic components in each second sample image based on the feature vectors to obtain the interface graphic category corresponding to each graphic component, and determining candidate graphic components based on the interface graphic category; constructing a preset user page framework, and filling the preset user page framework with candidate graphic components to generate the corresponding target user interface. This invention makes the generated target user interface more in line with user needs, improving the development efficiency and user experience of the user interface.

Description

Technical Field

[0001] This invention relates to the field of graphical user interface technology, and in particular to a user interface generation method and system based on artificial intelligence and Gestalt psychology. Background Technology

[0002] User interface (UI) design has gradually gained attention with the widespread use of digital terminals in the information age. As an interface presented to users through digital terminal displays, the design of the user interface directly affects the user experience and is the way information is conveyed.

[0003] With the increasing popularity of flat user interface design, more and more scenarios require the use of flat design styles to create large-screen visual user interfaces for users. However, existing flat user interface styles are relatively homogeneous, resulting in a serious lack of stylistic similarity and a poor user experience.

[0004] Therefore, there is an urgent need for a user interface generation method and system based on artificial intelligence and Gestalt psychology to solve the above problems. Summary of the Invention

[0005] To address the problems existing in the prior art, this invention provides a user interface generation method and system based on artificial intelligence and Gestalt psychology.

[0006] This invention provides a user interface generation method based on artificial intelligence and Gestalt psychology, comprising:

[0007] Obtain multiple first sample images, wherein the first sample images are the images corresponding to the large screen visualization page;

[0008] Each of the first sample images is processed by image segmentation to obtain multiple second sample images, each of which is divided into a main page display area and an auxiliary page display area.

[0009] Feature extraction is performed on the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component;

[0010] Based on the feature vector, the graphic components in each of the second sample images are clustered to obtain the interface graphic category corresponding to each graphic component, and candidate graphic components are determined based on the interface graphic category.

[0011] Based on the main page display area and the auxiliary page display area, a preset user page framework is constructed, and based on the candidate graphic components, the preset user page framework is filled to generate the corresponding target user interface.

[0012] According to the present invention, a user interface generation method based on artificial intelligence and Gestalt psychology is provided, wherein the step of performing image segmentation processing on each of the first sample images to obtain multiple second sample images includes:

[0013] Each of the first sample images is input into the image segmentation model to obtain the first sample image after image segmentation. The image segmentation model is obtained by training a convolutional neural network with training sample images labeled with main page display area labels and auxiliary page display area labels. The display area corresponding to the main page display area label includes at least the title text display area.

[0014] Based on the preset main and auxiliary page display method, the first sample images after all the image segments are filtered to obtain multiple second sample images.

[0015] According to the user interface generation method based on artificial intelligence and Gestalt psychology provided by the present invention, the step of extracting features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component includes:

[0016] The VGG convolutional neural network is used to extract features from the graphic components in each of the second sample images, resulting in feature vectors for each graphic component.

[0017] According to the present invention, a user interface generation method based on artificial intelligence and Gestalt psychology is provided, wherein the step of clustering graphical components in each of the second sample images according to the feature vector to obtain the interface graphical category corresponding to each graphical component, and determining candidate graphical components according to the interface graphical category, includes:

[0018] The feature vectors are clustered using the K-means clustering algorithm to determine the interface graphic category corresponding to the graphic component;

[0019] Based on the number of graphic components corresponding to each interface graphic category, multiple candidate graphic components are determined, wherein the candidate graphic components include at least line chart components, bar chart components, pie chart components, and map components.

[0020] According to the present invention, a user interface generation method based on artificial intelligence and Gestalt psychology is provided, wherein the step of filling the preset user page frame with candidate graphic components to generate a corresponding target user interface includes:

[0021] Receive a first input, the first input including an operation of selecting a target graphic component from a plurality of candidate graphic components;

[0022] In response to the first input, a plurality of the target graphical components are determined;

[0023] The second input includes an operation based on the principles of Gestalt psychology, which involves filling each of the target graphic components into the main page display area and the auxiliary page display area of ​​the preset user page frame according to the data type corresponding to the user interface to be generated;

[0024] In response to the second input, a corresponding target user interface is generated based on the pre-filled user interface framework.

[0025] According to a user interface generation method based on artificial intelligence and Gestalt psychology provided by the present invention, after constructing a preset user page framework according to the main page display area and the auxiliary page display area, and filling the preset user page framework according to the candidate graphic components to generate a corresponding target user interface, the method further includes:

[0026] Receive a third input, the third input including an operation to replace the graphical components already filled in the target user interface;

[0027] In response to the third input, a new target user interface is generated.

[0028] This invention also provides a user interface generation system based on artificial intelligence and Gestalt psychology, comprising:

[0029] The large-screen visualization page acquisition module is used to acquire multiple first sample images, wherein the first sample images are the images corresponding to the large-screen visualization page;

[0030] The image segmentation module is used to perform image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area;

[0031] The feature extraction module is used to extract features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component.

[0032] The image component classification module is used to perform clustering processing on the graphic components in each of the second sample images according to the feature vector, obtain the interface graphic category corresponding to each graphic component, and determine the candidate graphic component according to the interface graphic category.

[0033] The user page generation module is used to construct a preset user page framework based on the main page display area and the auxiliary page display area, and to fill the preset user page framework based on the candidate graphic components to generate the corresponding target user interface.

[0034] The present invention also provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the program to implement the user interface generation method based on artificial intelligence and Gestalt psychology as described above.

[0035] The present invention also provides a non-transitory computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the user interface generation method based on artificial intelligence and Gestalt psychology as described above.

[0036] The present invention also provides a computer program product, including a computer program that, when executed by a processor, implements the user interface generation method based on artificial intelligence and Gestalt psychology as described above.

[0037] This invention provides a user interface generation method and system based on artificial intelligence and Gestalt psychology. By performing image segmentation and feature extraction on large-screen visualization page images, feature vectors corresponding to each graphic component in the large-screen visualization page images are obtained. Based on these feature vectors, the graphic components are clustered to determine the corresponding candidate graphic components according to the interface graphic categories. These candidate graphic components are then filled into a preset user page framework, making the generated target user interface more in line with user needs and improving the development efficiency and user experience of the user interface. Attached Figure Description

[0038] To more clearly illustrate the technical solutions in this invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of this invention. For those skilled in the art, other drawings can be obtained from these drawings without creative effort.

[0039] Figure 1 A flowchart illustrating the user interface generation method based on artificial intelligence and Gestalt psychology provided by this invention;

[0040] Figure 2 A schematic diagram of the user interface generation system based on artificial intelligence and Gestalt psychology provided by the present invention;

[0041] Figure 3 This is a schematic diagram of the structure of the electronic device provided by the present invention. Detailed Implementation

[0042] To make the objectives, technical solutions, and advantages of this invention clearer, the technical solutions of this invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of this invention. All other embodiments obtained by those skilled in the art based on the embodiments of this invention without creative effort are within the scope of protection of this invention.

[0043] In early user interface design, the MS-DOS system served as a landmark example, employing a command-line-based, function-centric operation method: users typed commands, and the system responded. During this period, terminal displays had low resolution and limited color options; the user interface could only display the user-input commands and their results, offering almost no graphical information and poor human-computer interaction. While this interface was manageable for professionals, it was too difficult for ordinary users. This led to the development of the mouse, which solved the problem of command input through clicks. To make icons more recognizable, icon design began to shift towards a more realistic, skeuomorphic style.

[0044] Due to the operational difficulty of the DOS system, manufacturers began developing interface designs that were easy for ordinary people to understand. This led to a revolutionary shift in user interface design, moving from a "function-centric" to a "user-centric" approach. Good human-computer interaction became a key design requirement, with a greater emphasis on user experience. Various operating systems began to favor skeuomorphic interface designs, pursuing realism, three-dimensionality, and lighting effects. After a considerable period of skeuomorphism, the rapid development of communication technology, the increasing volume of information, and the growing complexity of graphics led to longer reading times and higher time costs for users. In this era of information overload, decorative user interfaces began to struggle to highlight relevant information.

[0045] With the emergence of flat interface design styles, user interface design, after more than a decade of exploration in skeuomorphic styles, suddenly underwent a disruptive transformation, beginning research and exploration into flat interface styles that streamline information. This change stemmed from the social needs of the information overload era. The purpose of flat design is to simplify overly cumbersome decorative information on the screen, leaving only precise and accurately conveyable information, enabling the rapid delivery of effective messages in the sea of ​​information. Flat user interface design, to a certain extent, acts as the first filter for users, presenting information in the simplest and most easily conveyed way. However, with the popularization of flat user interfaces, on the one hand, interface design requires a large number of designers, resulting in low development efficiency; on the other hand, the designed user interfaces tend to be monotonous, with many uniform flat designs failing to meet user needs. In this context, this invention, in order to make user interface design more distinctive and easily recognizable, uses artificial intelligence to analyze user needs and preferences, then designs according to design principles and Gestalt psychology principles, finally presenting the most concise data to the user group.

[0046] Figure 1 This is a flowchart illustrating the user interface generation method based on artificial intelligence and Gestalt psychology provided by the present invention, as shown below. Figure 1 As shown, this invention provides a user interface generation method based on artificial intelligence and Gestalt psychology, including:

[0047] Step 101: Obtain multiple first sample images, wherein the first sample images are the images corresponding to the large-screen visualization page.

[0048] In this invention, a set of large-screen visualization page images is constructed by searching for keywords such as "large-screen visualization" or "flat design" using a search engine. Preferably, in this invention, the search keywords can be further refined based on the data theme type of the user interface to be designed, for example, sample images for economic data themes or traffic data themes, so that the searched large-screen visualization pages are more closely aligned with the user interface to be designed.

[0049] Furthermore, in this invention, color statistics can be performed on the downloaded first sample images to filter out the main colors to be used. In one embodiment, the main colors of the multiple first sample images collected are predominantly blue, green, and black. Based on the number of images, the theme color of the user interface to be designed (i.e., the final target user interface) is determined. For example, in the currently collected image set, the number of sample images with a blue theme is the largest; therefore, the user interface to be designed will primarily use blue tones, such as dark blue, to highlight the foreground color.

[0050] Step 102: Perform image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area.

[0051] Image segmentation refers to dividing an image into several non-overlapping regions based on features such as grayscale, color, spatial texture, and geometric shape. These features exhibit consistency or similarity within the same region, while showing significant differences between different regions. Simply put, it's about separating the target from the background in an image. In this invention, when segmenting each first sample image, the main page display area and auxiliary page display area are separated, thus displaying different areas on the page. It should be noted that in this invention, the main page display area and auxiliary page display area can be determined based on the image segmentation results. Generally, the page in the segmented first sample image (i.e., the second sample image) is mostly displayed in three columns: the middle area is the main page display area, and the areas on either side of the main page display area are the auxiliary page display areas. Therefore, this image segmentation result can be used as the interface area division method for the user interface to be designed, i.e., determining the main page display area and auxiliary page display area of ​​the user page to be designed.

[0052] Step 103: Extract features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component.

[0053] In this invention, feature extraction can be performed on the second sample images using the Scale-invariant Feature Transform (SIFT) algorithm or the Histogram of Oriented Gradients (HOG) to obtain the feature vectors of the graphic components in each second sample image. Preferably, in one embodiment, feature extraction can be performed separately for the main page display area and the auxiliary page display area, so that when clustering the feature vectors later, different display areas can be combined for classification, thereby determining the graphic components in different display areas to generate a more reasonable target user interface.

[0054] Step 104: Based on the feature vector, cluster the graphic components in each of the second sample images to obtain the interface graphic category corresponding to each graphic component, and determine the candidate graphic components based on the interface graphic category.

[0055] In this invention, the feature vectors obtained in the above steps are clustered. After clustering, the k most numerous categories are selected from the clustering results to analyze commonly used expressive elements (i.e., the graphic categories corresponding to graphic components) in "large-screen visualization," and then the most numerous graphic components are selected as candidate graphic components. In one embodiment, the four most numerous candidate graphic components are line chart component, pie chart component, bar chart component, and map component.

[0056] Step 105: Construct a preset user page framework based on the main page display area and the auxiliary page display area, and fill the preset user page framework with the candidate graphic components to generate the corresponding target user interface.

[0057] In this invention, after constructing a preset user page framework, the role and function of each display area in the user interface to be designed are determined. Then, based on the principles of Gestalt psychology, the preset user page framework is gestaltized, target graphic components are selected from candidate graphic components, and the preset user page framework is filled to finally obtain the target user interface.

[0058] The user interface generation method based on artificial intelligence and Gestalt psychology provided by this invention performs image segmentation and feature extraction on large-screen visualization page images to obtain feature vectors corresponding to each graphic component in the large-screen visualization page images. Based on these feature vectors, the graphic components are clustered to determine the corresponding candidate graphic components according to the interface graphic categories. These candidate graphic components are then filled into a preset user page framework, making the generated target user interface more in line with user needs and improving the development efficiency and user experience of the user interface.

[0059] Based on the above embodiments, the step of performing image segmentation processing on each of the first sample images to obtain multiple second sample images includes:

[0060] Each of the first sample images is input into the image segmentation model to obtain the first sample image after image segmentation. The image segmentation model is obtained by training a convolutional neural network with training sample images labeled with main page display area labels and auxiliary page display area labels. The display area corresponding to the main page display area label includes at least the title text display area.

[0061] Based on the preset main and auxiliary page display method, the first sample images after all the image segments are filtered to obtain multiple second sample images.

[0062] In this invention, a Convolutional Neural Network (CNN) can be used for training to obtain a model for image segmentation. Specifically, during training, different categories of regions in each training sample image are labeled, enabling the trained model to perform image segmentation more accurately. Further, after processing the first sample image using the image segmentation model, the segmented first sample image is filtered using a preset main and auxiliary page display method to obtain sample images that meet preset conditions, i.e., second sample images. In this invention, the preset main and auxiliary page display method can be that the central area of ​​the page is the main page display area (mainly characterized by having a title text display area), and the two sides of the main page display area are auxiliary page display areas. This preset main and auxiliary page display method can be set according to the design requirements of the user interface to be designed.

[0063] Based on the above embodiments, the step of extracting features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component includes:

[0064] The VGG convolutional neural network is used to extract features from the graphic components in each of the second sample images, resulting in feature vectors for each graphic component.

[0065] In this invention, feature extraction is performed using a VGG convolutional neural network. The VGG convolutional neural network structure incorporates more fully connected layers and more convolutional layers, and some of the convolutional layers are combined into blocks to extract more accurate features of the graphic components in the second sample image.

[0066] Based on the above embodiments, the step of clustering the graphic components in each of the second sample images according to the feature vector to obtain the interface graphic category corresponding to each graphic component, and determining candidate graphic components according to the interface graphic category, includes:

[0067] The feature vectors are clustered using the K-means clustering algorithm to determine the interface graphic category corresponding to the graphic component;

[0068] Based on the number of graphic components corresponding to each interface graphic category, multiple candidate graphic components are determined, wherein the candidate graphic components include at least line chart components, bar chart components, pie chart components, and map components.

[0069] For unlabeled data, to discover potential information within it, clustering algorithms in unsupervised learning can be used. These algorithms group similar objects into the same cluster, maximizing the similarity within each cluster and maximizing the differences between objects outside the same cluster. In other words, after clustering, data of the same type are grouped together as much as possible, while different data are separated as much as possible. In this invention, the K-Means clustering algorithm is used. For a given sample set, it divides the set into K clusters based on the distance between samples, ensuring that points within a cluster are as closely connected as possible, while maximizing the distance between clusters. Specifically, assuming the clusters are divided into (C1, C2, ... C... k If the objective is to minimize the squared error E, then:

[0070]

[0071] Where, μ i It is cluster C i The mean vector, also known as the centroid, is expressed as:

[0072]

[0073] This invention uses the K-Means clustering algorithm to cluster the feature vectors obtained during feature extraction. After clustering, the k most frequent clusters are selected from the results for analysis of commonly used representation elements in "large-screen visualization," including line charts, pie charts, bar charts, and maps. In some embodiments, relationship diagrams and radar charts can also be selected according to the design requirements of the actual user interface.

[0074] Based on the above embodiments, the step of filling the preset user page framework with the candidate graphic components to generate the corresponding target user interface includes:

[0075] Receive a first input, the first input including an operation of selecting a target graphic component from a plurality of candidate graphic components;

[0076] In response to the first input, a plurality of the target graphical components are determined;

[0077] The second input includes an operation based on the principles of Gestalt psychology, which involves filling each of the target graphic components into the main page display area and the auxiliary page display area of ​​the preset user page frame according to the data type corresponding to the user interface to be generated;

[0078] In response to the second input, a corresponding target user interface is generated based on the pre-filled user interface framework.

[0079] In this invention, a human-computer interaction interface allows users (such as designers) to select a target graphic component from multiple candidate graphic components. After selection, based on the principles of Gestalt psychology, the target graphic component is filled into the corresponding area of ​​a preset user page frame. This invention utilizes a flat design based on the principles of Gestalt psychology. When an incomplete graphic appears in a person's vision, their visual thinking tends to automatically complete it, transforming it into a known, complete, and common overall graphic—a "Gestalt." This ensures that the resulting user page is highly readable, avoiding excessive decorative details and textured icons that attract user attention and reducing interference with content comprehension.

[0080] In this invention, based on the principles of Gestalt psychology, different target graphical components are used to complete the pre-defined user page framework for the information content to be displayed in different areas of the page. Specifically, the line graph component is used to analyze the trend of changes in events over time or in ordered categories. It mainly analyzes the trend changes and comparisons of different parameters to obtain the increase or decrease in quantity. Therefore, the line graph component can be used when designing graphical components for such information content in the user page. Correspondingly, for scenarios where there are too many nodes, resulting in an overly dense overall display, the line graph component is not suitable because it is difficult to accurately correspond and capture the information of each node; similarly, it is not suitable for scenarios with too much indicator data in the graph because the accumulation of multiple lines makes it difficult to focus on the key points.

[0081] The bar chart component is suitable for comparing categorized data, especially when the values ​​are close together. Since the human eye perceives height better than other visual elements (such as area and angle), bar charts are more appropriate. They are primarily used to view the comparison and changes in the values ​​of different parameters, such as the magnitude of quantities.

[0082] The pie chart component is mainly used to view the total proportion of different parameters, showing the percentage of each part in the whole.

[0083] The map component is used to display the relationship between data and geographic locations. This component can be used when a certain display area of ​​the user page frame is set to geographic data.

[0084] In addition, the present invention can also use relationship graph components and radar chart components (obtained through clustering) for gestaltization. The relationship graph is used to describe the relationship between data and visually display the relationship between data. The radar chart is a graphical method for displaying multivariate data. It can be used to compare variables or check for outliers in variables. However, it is not suitable for data analysis with too many classification types.

[0085] Based on the above embodiments, after constructing a preset user page framework according to the main page display area and the auxiliary page display area, and filling the preset user page framework according to the candidate graphic components to generate the corresponding target user interface, the method further includes:

[0086] Receive a third input, the third input including an operation to replace the graphical components already filled in the target user interface;

[0087] In response to the third input, a new target user interface is generated.

[0088] In this invention, the target user interface that has already been constructed can be modified at any time. To address some errors in the current target user interface or the design requirements of the designers, the graphical components in the target user interface can be modified to obtain a more complete user interface that meets the design requirements.

[0089] The user interface generation system based on artificial intelligence and Gestalt psychology provided by this invention will be described below. The user interface generation system based on artificial intelligence and Gestalt psychology described below can be referred to in correspondence with the user interface generation method based on artificial intelligence and Gestalt psychology described above.

[0090] Figure 2 This is a schematic diagram of the user interface generation system based on artificial intelligence and Gestalt psychology provided by the present invention, such as... Figure 2 As shown, this invention provides a user interface generation system based on artificial intelligence and Gestalt psychology, including a large-screen visualization page acquisition module 201, an image segmentation module 202, a feature extraction module 203, an image component classification module 204, and a user page generation module 205. The large-screen visualization page acquisition module 201 acquires multiple first sample images, where each first sample image corresponds to a large-screen visualization page. The image segmentation module 202 performs image segmentation processing on each of the first sample images to obtain multiple second sample images, where each second sample image is divided into a main page display area and an auxiliary page display area. The extraction module 203 is used to extract features from the graphic components in each of the second sample images to obtain feature vectors corresponding to each graphic component; the image component classification module 204 is used to perform clustering processing on the graphic components in each of the second sample images according to the feature vectors to obtain the interface graphic category corresponding to each graphic component, and to determine candidate graphic components according to the interface graphic category; the user page generation module 205 is used to construct a preset user page framework according to the main page display area and the auxiliary page display area, and to fill the preset user page framework according to the candidate graphic components to generate the corresponding target user interface.

[0091] The user interface generation system based on artificial intelligence and Gestalt psychology provided by this invention performs image segmentation and feature extraction on large-screen visualization page images to obtain feature vectors corresponding to each graphic component in the large-screen visualization page images. Based on these feature vectors, the graphic components are clustered to determine the corresponding candidate graphic components according to the interface graphic categories. These candidate graphic components are then filled into the preset user page framework, making the generated target user interface more in line with user needs and improving the development efficiency and user experience of the user interface.

[0092] The system provided by this invention is used to execute the above-described method embodiments. For specific processes and details, please refer to the above embodiments, which will not be repeated here.

[0093] Figure 3 This is a schematic diagram of the structure of the electronic device provided by the present invention, such as... Figure 3 As shown, the electronic device may include: a processor 301, a communication interface 302, a memory 303, and a communication bus 304, wherein the processor 301, the communication interface 302, and the memory 303 communicate with each other through the communication bus 304. The processor 301 can call logical instructions in the memory 303 to execute a user interface generation method based on artificial intelligence and Gestalt psychology. This method includes: acquiring multiple first sample images, wherein the first sample images are images corresponding to a large-screen visualization page; performing image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area; extracting features from the graphic components in each of the second sample images to obtain feature vectors corresponding to each graphic component; performing clustering processing on the graphic components in each of the second sample images based on the feature vectors to obtain interface graphic categories corresponding to each graphic component, and determining candidate graphic components based on the interface graphic categories; constructing a preset user page framework based on the main page display area and the auxiliary page display area, and filling the preset user page framework based on the candidate graphic components to generate a corresponding target user interface.

[0094] Furthermore, the logical instructions in the aforementioned memory 303 can be implemented as software functional units and, when sold or used as independent products, can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, essentially, or the part that contributes to the prior art, or a part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0095] On the other hand, the present invention also provides a computer program product, the computer program product comprising a computer program stored on a non-transitory computer-readable storage medium, the computer program comprising program instructions, wherein when the program instructions are executed by a computer, the computer is able to execute the user interface generation method based on artificial intelligence and Gestalt psychology provided by the above methods, the method comprising: acquiring multiple first sample images, wherein the first sample images are images corresponding to a large-screen visualization page; performing image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area; extracting features from the graphic components in each of the second sample images to obtain feature vectors corresponding to each graphic component; performing clustering processing on the graphic components in each of the second sample images according to the feature vectors to obtain the interface graphic category corresponding to each graphic component, and determining candidate graphic components according to the interface graphic category; constructing a preset user page framework according to the main page display area and the auxiliary page display area, and filling the preset user page framework according to the candidate graphic components to generate a corresponding target user interface.

[0096] In another aspect, the present invention also provides a non-transitory computer-readable storage medium storing a computer program thereon, which, when executed by a processor, implements the user interface generation method based on artificial intelligence and Gestalt psychology provided in the above embodiments. The method includes: acquiring multiple first sample images, wherein the first sample images are images corresponding to a large-screen visualization page; performing image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area; extracting features from the graphic components in each of the second sample images to obtain feature vectors corresponding to each graphic component; performing clustering processing on the graphic components in each of the second sample images based on the feature vectors to obtain interface graphic categories corresponding to each graphic component, and determining candidate graphic components based on the interface graphic categories; constructing a preset user page framework based on the main page display area and the auxiliary page display area, and filling the preset user page framework based on the candidate graphic components to generate a corresponding target user interface.

[0097] The device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. Those skilled in the art can understand and implement this without any creative effort.

[0098] Through the above description of the embodiments, those skilled in the art can clearly understand that each embodiment can be implemented by means of software plus necessary general-purpose hardware platforms, and of course, it can also be implemented by hardware. Based on this understanding, the above technical solutions, in essence or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product can be stored in a computer-readable storage medium, such as ROM / RAM, magnetic disk, optical disk, etc., and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute the methods described in the various embodiments or some parts of the embodiments.

[0099] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, and not to limit them; although the present invention has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features; and these modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present invention.

Claims

1. A user interface generation method based on artificial intelligence and Gestalt psychology, characterized in that, include: Obtain multiple first sample images, wherein the first sample images are the images corresponding to the large screen visualization page; Each of the first sample images is processed by image segmentation to obtain multiple second sample images, each of which is divided into a main page display area and an auxiliary page display area. Feature extraction is performed on the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component; Based on the feature vector, the graphic components in each of the second sample images are clustered to obtain the interface graphic category corresponding to each graphic component, and candidate graphic components are determined based on the interface graphic category. Based on the main page display area and the auxiliary page display area, a preset user page framework is constructed, and based on the candidate graphic components, the preset user page framework is filled to generate the corresponding target user interface. Specifically, this includes: using the flat design principle of Gestalt psychology to perform Gestaltization on the preset user page framework, selecting target graphic components from the candidate graphic components, filling the preset user page framework, and obtaining the target user interface. The step of performing image segmentation processing on each of the first sample images to obtain multiple second sample images includes: Each of the first sample images is input into the image segmentation model to obtain the first sample image after image segmentation. The image segmentation model is obtained by training a convolutional neural network with training sample images labeled with main page display area labels and auxiliary page display area labels. The display area corresponding to the main page display area label includes at least the title text display area. Based on the preset main and auxiliary page display method, the first sample images after all the image segments are filtered to obtain multiple second sample images.

2. The user interface generation method based on artificial intelligence and Gestalt psychology according to claim 1, characterized in that, The step of extracting features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component includes: The VGG convolutional neural network is used to extract features from the graphic components in each of the second sample images, resulting in feature vectors for each graphic component.

3. The user interface generation method based on artificial intelligence and Gestalt psychology according to claim 1, characterized in that, The step of clustering the graphic components in each of the second sample images according to the feature vector to obtain the interface graphic category corresponding to each graphic component, and determining candidate graphic components according to the interface graphic category, includes: The feature vectors are clustered using the K-means clustering algorithm to determine the interface graphic category corresponding to the graphic component; Based on the number of graphic components corresponding to each interface graphic category, multiple candidate graphic components are determined, wherein the candidate graphic components include at least line chart components, bar chart components, pie chart components, and map components.

4. The user interface generation method based on artificial intelligence and Gestalt psychology according to claim 3, characterized in that, The step of filling the preset user page framework with the candidate graphic components to generate the corresponding target user interface includes: Receive a first input, the first input including an operation of selecting a target graphic component from a plurality of candidate graphic components; In response to the first input, a plurality of the target graphical components are determined; The second input includes an operation based on the principles of Gestalt psychology, which involves filling each of the target graphic components into the main page display area and the auxiliary page display area of ​​the preset user page frame according to the data type corresponding to the user interface to be generated; In response to the second input, a corresponding target user interface is generated based on the pre-filled user interface framework.

5. The user interface generation method based on artificial intelligence and Gestalt psychology according to claim 4, characterized in that, After constructing a preset user page framework based on the main page display area and the auxiliary page display area, and filling the preset user page framework with the candidate graphic components to generate the corresponding target user interface, the method further includes: Receive a third input, the third input including an operation to replace the graphical components already filled in the target user interface; In response to the third input, a new target user interface is generated.

6. A user interface generation system based on artificial intelligence and Gestalt psychology, characterized in that, include: The large-screen visualization page acquisition module is used to acquire multiple first sample images, wherein the first sample images are the images corresponding to the large-screen visualization page; The image segmentation module is used to perform image segmentation processing on each of the first sample images to obtain multiple second sample images, wherein the second sample images are divided into a main page display area and an auxiliary page display area; The feature extraction module is used to extract features from the graphic components in each of the second sample images to obtain the feature vectors corresponding to each graphic component. The image component classification module is used to perform clustering processing on the graphic components in each of the second sample images according to the feature vector, obtain the interface graphic category corresponding to each graphic component, and determine the candidate graphic component according to the interface graphic category. The user page generation module is used to construct a preset user page framework based on the main page display area and the auxiliary page display area, and to fill the preset user page framework with candidate graphic components to generate a corresponding target user interface. Specifically, it is used to: perform gestaltization on the preset user page framework through flat design based on the principles of Gestalt psychology, select target graphic components from candidate graphic components, fill the preset user page framework, and obtain the target user interface. The image segmentation module is specifically used for: Each of the first sample images is input into the image segmentation model to obtain the first sample image after image segmentation. The image segmentation model is obtained by training a convolutional neural network with training sample images labeled with main page display area labels and auxiliary page display area labels. The display area corresponding to the main page display area label includes at least the title text display area. Based on the preset main and auxiliary page display method, the first sample images after all the image segments are filtered to obtain multiple second sample images.

7. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that, When the processor executes the computer program, it implements the user interface generation method based on artificial intelligence and Gestalt psychology as described in any one of claims 1 to 5.

8. A non-transitory computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by the processor, it implements the user interface generation method based on artificial intelligence and Gestalt psychology as described in any one of claims 1 to 5.

9. A computer program product, comprising a computer program, characterized in that, When the computer program is executed by the processor, it implements the user interface generation method based on artificial intelligence and Gestalt psychology as described in any one of claims 1 to 5.

Images