Tensor construction, model training and animation generation method and system for expressing UI (User Interface) animation frame
By describing the tensor construction method of UI animation frames, the problem of lack of a unified UI animation element expression method in the prior art is solved, and a detailed UI animation frame description and a reliable learning data set are provided, which improves the training efficiency and generation quality of UI animation generation models.
Patent Information
- Application Number
- CN202411758417.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-12-03
- Publication Date
- 2025-03-25
AI Technical Summary
The lack of a unified expression method of UI animation elements in the prior art leads to a lack of reliable learning data for the UI animation generation model, which is difficult to train the model and difficult to ensure accuracy and efficiency.
A tensor construction method for expressing UI animation frames is proposed. By obtaining the original attributes of UI animation frames for normalization, and calculating the difference value, a tensor containing N UI elements is constructed. Each UI element is represented as a vector composed of the normalized value and the difference value of the original attribute.
It realizes a detailed and comprehensive description of UI animation frames, ensures the full extraction and expression of feature data of UI animation frames, provides a reliable learning data set, lays the foundation for the training of UI animation generation models, and improves the efficiency and quality of animation generation.
Smart Images
Figure CN119693506A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of image processing and artificial intelligence technology, and in particular to a method and system for tensor construction, model training and animation generation for expressing UI animation frames. Background Art
[0002] User interface (UI) animation plays an important role in enhancing user experience and guiding user operations in various touch-based display applications.
[0003] Traditional UI animation production requires interface designers to determine key frames based on experience, scenes and functions, that is, important turning points or change points in the animation, such as the movement, scaling, gradient, rotation of pictures, etc., to ensure smooth animation transitions and visual appeal. Traditional UI animation production usually takes up a lot of time and energy of interface designers, and even requires multiple people to collaborate on production. The differences in skill levels of different production staff result in inconsistent animation styles for different query exhibits in the same exhibition hall, and it is difficult to guarantee quality.
[0004] AI-based UI animation generation technology uses machine learning algorithms and a large amount of data to automatically generate high-quality UI animations, greatly improving the efficiency and uniformity of animation production. However, UI animation elements are diverse and there is currently no unified way to express them. Machine learning has high requirements for data sets, but there is currently no unified way to express UI animation elements and UI animation data sets. This leads to a lack of reliable learning objects for UI animation generation models, making model training difficult and difficult to ensure accuracy and efficiency.
[0005] Application Contents
[0006] In order to overcome the defect of the above-mentioned prior art that there is a lack of a unified way to express UI animation elements, which leads to a lack of reliable learning data for the UI animation generation model, the present application proposes a tensor construction for expressing UI animation frames, constructs a unified tensor mode for comprehensively expressing UI animation frames, and lays the foundation for the construction of a data set and model training for UI animation generation model learning.
[0007] The present invention proposes a tensor construction method for expressing UI animation frames, which first obtains the original attributes of the UI animation frame and normalizes them; the original attributes include the position, size, scaling value, rotation angle and color of each UI element; then, a differential value is calculated in combination with the normalized attribute values of the UI animation frame, and the differential value is the difference between the normalized attribute values of the attribute in two adjacent frames; a tensor of the UI animation frame is constructed, which includes N UI elements, and each UI element is represented as a vector composed of the normalized value and the differential value of the original attribute; N is a set value, if the number of UI elements in the UI animation frame is less than N, UI elements with attribute values of 0 are used to fill the end of the tensor until N UI elements are reached.
[0008] Preferably, the position and size normalization method of the UI element in the UI animation frame includes:
[0009] First, set a rectangular canvas, and then expand the rectangular canvas outward by a times the original height in the vertical direction and a times the original width in the left and right directions;
[0010] Then use the following formula to calculate:
[0011] x'=(x+w) / [w+2aw]
[0012] y'=(y+h) / [h+2ah]
[0013] width'=width / [w+2aw]
[0014] height'=height / [h+2ah]
[0015] Among them, x is the horizontal coordinate of the UI element on the original canvas, y is the vertical coordinate of the UI element on the original canvas, width is the original width of the UI element, and height is the original height of the UI element; x' is the normalized horizontal coordinate of the UI element, y' is the normalized vertical coordinate of the UI element, width' is the normalized width of the UI element, and height' is the normalized height of the UI element.
[0016] Preferably, the normalized value of the rotation attribute is calculated using the following formula:
[0017] R'x=(Rx mod 360) / 360
[0018] R'y=(Ry mod 360) / 360
[0019] R'z=(Rz mod 360) / 360
[0020] Among them, R'x is the normalized x-axis rotation value, R'y is the normalized y-axis rotation value, and R'z is the normalized z-axis rotation value; Rx is the x-axis rotation value of the UI element, Ry is the y-axis rotation value of the UI element, and Rz is the z-axis rotation value of the UI element; mod means remainder.
[0021] Preferably, a single UI element is represented by a vector {x', y', width', height', S'x, S'y, R'x, R'y, R'z, R, G, B, A}; wherein x' is the normalized horizontal coordinate of the UI element, y' is the normalized vertical coordinate of the UI element, width' is the normalized width of the UI element, and height' is the normalized height of the UI element; S'x is the normalized horizontal scaling value, and S'y is the normalized vertical scaling value; R'x is the normalized x-axis rotation value, R'y is the normalized y-axis rotation value, and R'z is the normalized z-axis rotation value; R represents the red value, G represents the blue value, B represents the green value, and A represents transparency.
[0022] The present invention proposes a training method for a UI animation frame generation model, which first constructs a learning data set and an animation frame generation model; then enables the animation frame generation model to perform machine learning on the learning data set until convergence;
[0023] The learning data consists of a tensor C corresponding to T consecutive UI animation frames; T is the set value;
[0024] The animation frame generation model includes a sequentially connected input layer, an encoder, a decoder and an output head; the input layer is used to obtain UI animation frames as input data, the encoder is used to encode the input data and then input it into the decoder; the decoder decodes the encoded features; the output head contains a linear transformation structure and an activation function; the decoded features are linearly transformed by the linear transformation function and then activated by the activation function to obtain continuous T-frame UI animation frames starting with the input data.
[0025] Preferably, the method for constructing a learning data set is: first obtain continuous UI animation frames to obtain tensors of each UI animation frame; obtain tensors corresponding to continuous T frames to constitute learning data; when the number of continuous UI animation frames is less than the T value, copy the last frame of UI animation and arrange them backwards until learning data containing T frame tensors is obtained.
[0026] Preferably, the loss function used in the model training process is:
[0027]
[0028] Among them, x(t,n) represents the annotated attribute value of the nth UI element in the tth UI animation frame, x'(t,n) represents the attribute value of the nth UI element in the tth UI animation frame predicted by the animation frame generation model; N represents the number of UI elements contained in the UI animation frame.
[0029] Preferably, during the model training process, the Adam algorithm is used in combination with the model loss to update the animation frame generation model.
[0030] A UI animation generation method proposed in the present invention is characterized in that first, multiple UI animation frames are constructed as original frames and sorted; then each original frame is output to a UI animation frame generation model to obtain a segment containing T-frame animation frames corresponding to the original frame; the obtained segment is sorted according to the corresponding original frame to complete the animation production.
[0031] The present invention provides a UI animation generation system, which includes a memory and a processor. The memory stores a computer program. The processor is connected to the memory and is used to execute the computer program to implement the UI animation generation method.
[0032] The advantages of this application are:
[0033] (1) This application proposes a tensor construction method for expressing UI animation frames, which takes UI elements as unit features and constructs tensors based on the normalized values and differential values of their positions, sizes, scaling values, rotation angles, and colors, to provide a detailed and comprehensive description of UI animation frames, thereby ensuring the full extraction and expression of feature data of UI animation frames.
[0034] (2) In this application, a method of extending the canvas dimension is adopted to process UI elements, expanding the canvas size to 1+2a times of the original size, and normalizing the element position and size to the range of [0,1] to better manage and position UI elements that may partially or completely exceed the original canvas range.
[0035] (3) This application records the attribute values of UI elements in each frame through differential value calculation, and calculates the attribute difference between two adjacent frames to obtain a differential sequence, which can represent the change trend of UI elements. For example, the differential sequence of position size, scale value and opacity can represent the various change characteristics and speed of elements in animation. In this way, this application uses differential coding to capture the dynamic changes of UI element attributes in animation sequences. After constructing the data set, the model can more accurately understand the time relationship and change trend between sequences, thereby improving the prediction accuracy.
[0036] (4) This application adopts a time frame filling strategy to fill the insufficient animation sequence to a fixed number of time frames by repeating the data of the last frame and differential encoding, thereby ensuring the temporal consistency of all animation sequence data.
[0037] (5) This application optimizes the UI animation data tensor structure in combination with the UI element tensor and constructs a UI animation data tensor (26, N, T) with a specific structure, which contains all the attributes and differential encoding of the UI elements, and the number of each UI element and its frames are standardized, which facilitates batch training of the model.
[0038] (6) The training method of the UI animation frame generation model proposed in this application uses three methods, namely differential coding, normalization processing and sequence filling, to process the original data. The combination of these three methods ensures that the length of the input data received by the model is always consistent regardless of the duration of the animation. In particular, through differential coding, the difference between the attributes of two adjacent frames is calculated based on recording the attribute values of the UI elements in each frame. The resulting differential sequence can more intuitively reflect the changing trend of the UI elements in the animation.
[0039] (7) This application uses the Transformer structure to build an animation frame generation model, which has an efficient self-attention mechanism and can process sequence data well. The unique encoder and decoder structure can efficiently handle the dynamic changes of UI elements. The loss function of the model uses the mean square error, which can well measure the error between the predicted value and the true value. At the same time, the Adam optimization algorithm is selected to adjust the model parameters, which improves the model convergence speed, and can be combined with the early stopping rule to avoid model overfitting.
[0040] (8) The animation frame generation model in this application can construct data sets based on different scenarios and perform training, such as processing the entry animation and exit animation of UI elements separately. This means that the model can be trained, optimized and applied according to actual needs, greatly enhancing the practicality and flexibility of the model.
[0041] (9) The UI animation generation method proposed in this application aims to combine artificial intelligence technology and UI animation production technology to meet the growing needs of application development, reduce development costs, and improve the quality of work. BRIEF DESCRIPTION OF THE DRAWINGS
[0042] Figure 1 A flowchart of a tensor construction method for expressing UI animation frames;
[0043] Figure 2 A flowchart of a training method for a UI animation frame generation model;
[0044] Figure 3 Flowchart of the method to construct a learning dataset. DETAILED DESCRIPTION
[0045] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.
[0046] Reference Figure 1, a tensor construction method for expressing UI animation frames proposed in this application includes the following steps S1-S3.
[0047] S1. Obtain the original attributes of the UI animation frame and perform normalization processing; the original attributes include the position, size, scaling value, rotation angle and color of each UI element;
[0048] The position and size of UI elements are normalized as follows.
[0049] First, expand the canvas size outward along the outer edge. Specifically, it can be expanded in each direction by a times the original size in that direction. Taking a rectangular canvas as an example, the canvas width can be expanded by 1 times along the left and right sides, and the canvas height can be expanded by 1 times along the top and bottom sides, so as to obtain a new canvas with a size of 3w×3h, where w is the original canvas width and h is the original canvas height. This step ensures that all UI elements can be completely positioned on the new canvas.
[0050] Then recalculate the position and size of the UI element on the new canvas so that its value falls within the range of [0,1], and obtain the normalized horizontal position, vertical position, width and height of the UI element. The formula is as follows:
[0051] x'=(x+w) / [w+2aw]
[0052] y'=(y+h) / [h+2ah]
[0053] width'=width / [w+2aw]
[0054] height'=height / [h+2ah]
[0055] In this way, when the size of the rectangular canvas is expanded by 1 times the original size along the top, bottom, left and right directions, that is, when a=1, we have:
[0056] x'=(x+w) / 3w
[0057] y'=(y+h) / 3h
[0058] width'=width / 3w
[0059] height'=height / 3h
[0060] Among them, x is the horizontal coordinate of the UI element on the original canvas, y is the vertical coordinate of the UI element on the original canvas, width is the original width of the UI element, and height is the original height of the UI element; x' is the normalized horizontal coordinate of the UI element, y' is the normalized vertical coordinate of the UI element, width' is the normalized width of the UI element, and height' is the normalized height of the UI element.
[0061] The scaling value is normalized as follows:
[0062] S'x=Sx / M
[0063] S'y=Sy / M
[0064] Wherein, M represents the maximum zoom factor, which can be specifically set to M=10; Sx is the horizontal zoom value of the UI element, Sy is the vertical zoom value of the UI element; S'x is the normalized horizontal zoom value, and S'y is the normalized vertical zoom value.
[0065] The normalization formula of the rotation attribute is expressed as follows:
[0066] R'x=(Rx mod 360) / 360
[0067] R'y=(Ry mod 360) / 360
[0068] R'z=(Rz mod 360) / 360
[0069] Among them, R'x is the normalized x-axis rotation value, R'y is the normalized y-axis rotation value, and R'z is the normalized z-axis rotation value; Rx is the x-axis rotation value of the UI element, Ry is the y-axis rotation value of the UI element, and Rz is the z-axis rotation value of the UI element; mod means remainder.
[0070] Color attributes include: RGB components and transparency. Color attribute values are all in the range of [0-1] and do not require additional processing and can be used directly as normalized values.
[0071] S2. Calculate the difference value based on the normalized attribute value of the UI animation frame. The calculation formula is as follows:
[0072] Δx(t,n)=x(t,n)-x(t-1,n)
[0073] x(t,n)∈{x',y',width',height',S'x,S'y,R'x,R'y,R'z,R,G,B,A}
[0074] Among them, R represents the red value, G represents the blue value, B represents the green value, and A represents transparency; x(t,n) represents any attribute value of the nth UI element in the tth UI animation frame, x(t-1,n) represents any attribute value of the nth UI element in the t-1th UI animation frame, and x(0,n)=0; Δx(t,n) represents the differential value corresponding to x(t,n).
[0075] make:
[0076] Δx(t,n)∈{Δx',Δy',Δwidth',Δheight',ΔS'x,ΔS'y,ΔR'x,ΔR'y,ΔR'z,ΔR,ΔG,ΔB,ΔA}
[0077] Among them, Δx', Δy', Δwidth', Δheight', ΔS'x, ΔS'y, ΔR'x, ΔR'y, ΔR'z, ΔR, ΔG, ΔB and ΔA represent the differential values corresponding to x', y', width', height', S'x, S'y, R'x, R'y, R'z, R, G, B and A respectively;
[0078] S3, construct the tensor C of UI animation frame;
[0079] C contains N UI elements, each of which contains 26 attribute values, namely, x', y', width', height', S'x, S'y, R'x, R'y, R'z, R, G, B, A, Δx', Δy', Δwidth', Δheight', ΔS'x, ΔS'y, ΔR'x, ΔR'y, ΔR'z, ΔR, ΔG, ΔB and ΔA;
[0080] N is a set value, which may be the maximum number of UI elements in a single frame of the animation to be produced, or a value greater than the maximum number of UI elements in a single frame. For example, in a certain embodiment, N=80 may be set. If the number of UI elements in the UI animation frame is less than N, UI elements with attribute values of 0 are inserted at the end of tensor C until N UI elements are reached.
[0081] In specific implementation, N rows of 26-dimensional vectors can be used to represent tensor C; when the number of UI elements in the UI animation frame is less than N, tensor C is finally inserted with N-N' rows of 26-dimensional vectors whose elements are all 0, and N' is the actual number of UI elements contained in the UI animation frame.
[0082] Reference Figure 2 , a training method for a UI animation frame generation model proposed in this application includes the following steps St1-St4:
[0083] St1. Obtain a learning data set, which consists of a tensor C corresponding to T consecutive UI animation frames; T is a set value, which can be set to T=255, 200, 180, 150, 100, 80, etc.; construct an animation frame generation model, whose input is a tensor of a UI animation frame, and whose output is a continuous T-frame UI animation frame starting from the input UI animation frame;
[0084] In this way, the dimension of the learning data can be expressed as (26, N, T); 26 is the dimension of the UI element; N = 80, which is the number of UI elements contained in the UI animation frame; T = 180, which is the number of frames contained in the learning data.
[0085] The animation frame generation model includes a sequentially connected input layer, an encoder, a decoder and an output head; the input layer is used to obtain UI animation frames as input data, the encoder is used to encode the input data and then input it into the decoder; the decoder decodes the encoded features; the output head contains a linear transformation structure and an activation function; the decoded features are linearly transformed by the linear transformation function and then activated by the activation function to obtain continuous T-frame UI animation frames starting with the input data.
[0086] Specifically, the encoder and decoder can adopt the existing Transformer model structure. The encoder part contains a multi-layer structure with a self-attention mechanism and a feedforward fully connected neural network. The input data sequence is processed in the self-attention mechanism link, and a context importance vector is calculated for each UI element to reflect the weight of reference to other elements. The decoder has a similar structure to the encoder, and in order to prevent the prediction of future information, a mask can be used in the decoder to restrict the influence of the right position.
[0087] St2. Extract multiple learning data from the learning data set as training samples, use the first frame of the UI animation frame in the learning data as the input of the animation frame generation model, use the learning data as the output of the animation frame generation model, and let the animation frame generation model perform machine learning on the training samples;
[0088] St3, extract multiple learning data from the learning data set as verification samples, let the animation frame generation model calculate the loss on the verification samples, and update the model according to the model loss;
[0089] In this implementation, the model loss calculation formula is:
[0090]
[0091] x(t,n) represents the annotated attribute value of the nth UI element in the tth UI animation frame, and x'(t,n) represents the attribute value of the nth UI element in the tth UI animation frame predicted by the animation frame generation model.
[0092] In step St3, the Adam algorithm is specifically used in combination with the model loss to update the animation frame generation model.
[0093] St4, determine whether the animation frame generation model converges; if not, return to step St2; if yes, fix the animation frame generation model and output it.
[0094] In specific implementation, the learning data set can be divided into a training set, a validation set, and a test set in a ratio of 8:1:1. The training set is used to provide training samples, and the validation set is used to provide validation samples. The test set is used to test the performance of the model. In this embodiment, the number of training rounds can be set to 100, and an early stopping rule can be set. The early stopping rule is used during the training process to avoid overfitting, that is, during the model training process, the model is judged to have converged until 100 training cycles are reached or the early stopping condition is met, and the training is stopped.
[0095] Reference Figure 3 , the method for constructing the learning data set in step St1 includes the following steps:
[0096] St1.1, obtain continuous UI animation frames, and process each UI animation frame using the above steps S1-S3 to obtain the tensor of each UI animation frame;
[0097] St1.2, obtain the tensors corresponding to the continuous T frames to form learning data; when the number of continuous UI animation frames is less than the T value, copy the last frame of UI animation and arrange them backwards until the learning data containing the T frame tensor is obtained;
[0098] St1.3. Collect learning data and build a learning data set.
[0099] Thus, in this embodiment, a single-frame UI animation frame is first processed to convert the tensor; then, the tensor of the UI animation frame is combined to construct learning data consisting of T-frame animation frames to train the animation frame generation model. When it is necessary to generate an animation, only a few UI animation frames with time intervals need to be constructed as original frames, and then each original frame is output to the UI animation frame generation model to obtain a fragment containing T-frame animation frames corresponding to the original frame; the obtained fragments are sorted according to the corresponding original frames, and the animation production can be completed intelligently and efficiently.
[0100] Through this application, animation production is transformed into a simple production of a few images.
[0101] Of course, for those skilled in the art, the present application is not limited to the details of the above exemplary embodiments, but also includes the same or similar structures that can be implemented in other specific forms without departing from the spirit or basic characteristics of the present application. Therefore, no matter from which point of view, the embodiments should be regarded as exemplary and non-restrictive, and the scope of the present application is defined by the attached claims rather than the above description, so it is intended to include all changes that fall within the meaning and scope of the equivalent elements of the claims. Any figure mark in the claims should not be regarded as limiting the claim involved.
[0102] In addition, it should be understood that although the present specification is described according to implementation modes, not every implementation mode contains only one independent technical solution. This description of the specification is only for the sake of clarity. Those skilled in the art should regard the specification as a whole. The technical solutions in each embodiment may also be appropriately combined to form other implementation modes that can be understood by those skilled in the art.
[0103] The technologies, shapes, and structural parts not described in detail in this application are all well-known technologies.
Claims
1. A tensor construction method for expressing UI animation frames, characterized in that: First, the original attributes of the UI animation frame are obtained and normalized; the original attributes include the position, size, scaling value, rotation angle and color of each UI element; then the differential value is calculated based on the normalized attribute value of the UI animation frame, and the differential value is the difference between the normalized attribute values of the attribute in two adjacent frames; Construct a tensor of UI animation frames, which contains N UI elements. Each UI element is represented as a vector consisting of the normalized value and the differential value of the original attribute. N is a set value. If the number of UI elements in a UI animation frame is less than N, UI elements with attribute values of 0 are used to fill the end of the tensor until N UI elements are reached.
2. The tensor construction method for expressing UI animation frames according to claim 1, characterized in that: The positions and sizes of UI elements in UI animation frames are normalized in the following ways: First, set a rectangular canvas, and then expand the rectangular canvas outward by a times the original height in the vertical direction and a times the original width in the left and right directions; Then use the following formula to calculate: x'=(x+w) / [w+2aw] y'=(y+h) / [h+2ah] width'=width / [w+2aw] height'=height / [h+2ah] Among them, x is the horizontal coordinate of the UI element on the original canvas, y is the vertical coordinate of the UI element on the original canvas, width is the original width of the UI element, and height is the original height of the UI element; x' is the normalized horizontal coordinate of the UI element, y' is the normalized vertical coordinate of the UI element, width' is the normalized width of the UI element, and height' is the normalized height of the UI element.
3. The tensor construction method for expressing UI animation frames according to claim 1, characterized in that: The normalized value of the rotation property is calculated using the following formula: R'x=(Rx mod 360) / 360 R'y=(Ry mod 360) / 360 R'z=(Rz mod 360) / 360 Among them, R'x is the normalized x-axis rotation value, R'y is the normalized y-axis rotation value, and R'z is the normalized z-axis rotation value; Rx is the x-axis rotation value of the UI element, Ry is the y-axis rotation value of the UI element, and Rz is the z-axis rotation value of the UI element; mod means remainder.
4. The tensor construction method for expressing UI animation frames according to claim 1, 2 or 3, characterized in that: A single UI element is represented by the vector {x', y', width', height', S'x, S'y, R'x, R'y, R'z, R, G, B, A}; wherein x' is the normalized horizontal coordinate of the UI element, y' is the normalized vertical coordinate of the UI element, width' is the normalized width of the UI element, and height' is the normalized height of the UI element; S'x is the normalized horizontal scaling value, and S'y is the normalized vertical scaling value; R'x is the normalized x-axis rotation value, R'y is the normalized y-axis rotation value, and R'z is the normalized z-axis rotation value; R represents the red value, G represents the blue value, B represents the green value, and A represents transparency.
5. A training method for a UI animation frame generation model using the tensor construction method for expressing UI animation frames as described in any one of claims 1 to 4, characterized in that: First, a learning dataset and an animation frame generation model are constructed; then the animation frame generation model is made to perform machine learning on the learning dataset until convergence; The learning data consists of a tensor C corresponding to T consecutive UI animation frames; T is the set value; The animation frame generation model includes an input layer, an encoder, a decoder, and an output head connected in sequence; the input layer is used to obtain the UI animation frame as input data, and the encoder is used to encode the input data and then input it into the decoder; The decoder decodes the encoded features; The output head contains a linear transformation structure and an activation function; The decoded features are linearly transformed by a linear transformation function and then activated by an activation function to obtain a continuous T-frame UI animation frame starting with the input data.
6. The training method for the UI animation frame generation model according to claim 5, characterized in that: The method for constructing the learning data set is as follows: first, obtain continuous UI animation frames to obtain the tensors of each UI animation frame; obtain the tensors corresponding to continuous T frames to constitute the learning data; when the number of continuous UI animation frames is less than the T value, copy the last frame of UI animation and arrange it backwards until the learning data containing T frame tensors is obtained.
7. The training method for the UI animation frame generation model according to claim 5 or 6, characterized in that: The loss function used in the model training process is: Among them, x(t,n) represents the annotated attribute value of the nth UI element in the tth UI animation frame, x'(t,n) represents the attribute value of the nth UI element in the tth UI animation frame predicted by the animation frame generation model; N represents the number of UI elements contained in the UI animation frame.
8. The training method for the UI animation frame generation model according to claim 7, characterized in that: During the model training process, the Adam algorithm is used in combination with the model loss to update the animation frame generation model.
9. A method for generating UI animation using the training method of the UI animation frame generation model according to any one of claims 5 to 8, characterized in that: First, multiple frames of UI animation frames are constructed as original frames and sorted; then each original frame is output to the UI animation frame generation model to obtain a fragment containing T-frame animation frames corresponding to the original frame; the obtained fragments are sorted according to the corresponding original frames to complete the animation production.
10. A UI animation generation system, characterized in that: It comprises a memory and a processor, wherein a computer program is stored in the memory, the processor is connected to the memory, and the processor is used to execute the computer program to implement the UI animation generation method as claimed in claim 9.