Animation processing method and apparatus

Abstract

The application mainly relates to an animation processing method and device. The method comprises the following steps: acquiring a sequence frame in SVG format of an animation to be played; dividing animation objects contained in each frame image in the sequence frame into multiple animation elements; acquiring a bitmap image of each animation element as an element bitmap corresponding to the animation element; generating an animation description file according to animation elements contained in each frame image and animation parameters of the animation elements in the frame image; and taking the animation description file and the element bitmaps corresponding to the animation elements as animation source files of the animation to be played.

Description

[0001] This application is a divisional application of Chinese patent application filed on December 22, 2016, with application number 2016112016476 and entitled "Animation Processing Method and Apparatus". Technical Field

[0002] This application relates to the field of computer technology, and in particular to animation processing methods and apparatus. Background Technology

[0003] In today's computer technology, animation technology is gradually becoming a hot topic in internet applications. Especially with the rise of online live streaming, the demand for high-performance, low-power animation technologies has increased. Commonly used technologies for animation include A-PNG (Animated Portable Network Graphics), Flash (an interactive vector graphics and web animation standard), and SVG (Scalable Vector Graphics).

[0004] However, loading and playing animations produced using the aforementioned technologies consumes a great deal of processor and memory, resulting in low animation processing efficiency. Summary of the Invention

[0005] This application provides an animation processing method, including the following steps: obtaining a sequence of SVG format frames of the animation to be played; dividing the animation objects contained in each frame image within the sequence of frames into multiple animation elements; obtaining the bitmap image of each animation element as the element bitmap corresponding to that animation element; generating an animation description file based on the animation elements contained in each frame image and the animation parameters of the contained animation elements in that frame image; and using the animation description file and the element bitmaps corresponding to each animation element as the animation source file of the animation to be played.

[0006] In some implementations, obtaining a sequence of SVG format frames of the animation to be played includes: converting the Flash format animation to be played into a sequence of SVG format frames using a Flash editor; or, converting the AE format animation to be played into a sequence of SVG format frames using BodyMovin.

[0007] In some implementations, the animated objects contained in each frame of the sequence are divided into multiple animated elements, including: comparing each sequence frame one by one to obtain comparison information between adjacent frames, wherein the comparison information includes the same animated objects between adjacent frames, the change parameters between the same animated objects, different animated objects, and the positional relationship between different animated objects; based on the comparison information, the parts of the vectors in each animated object that have not changed and the parts of the vectors that have changed are respectively regarded as different animated elements.

[0008] In some implementations, the animation description file includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in each frame.

[0009] In some implementations, animation parameters include position parameters, transparency parameters, size parameters, and layer order parameters.

[0010] In some implementations, animation attributes include the total number of frames in the animation, the identifier of each frame, the FPS, and the animation size.

[0011] In some implementations, the method further includes the following steps: compressing the animation source file; and transferring the compressed animation source file to a specified address so that the animation playback terminal can obtain the animation source file from the specified address.

[0012] This application provides an animation processing method, including the following steps: obtaining the animation source file of the animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element; rendering all element bitmaps to generate animation layers for each animation element; obtaining animation playback information from the animation description file, wherein the animation playback information includes animation attributes, animation elements contained in each frame image, and animation parameters of the contained animation elements in that frame image; and combining the animation layers of the animation elements contained in each frame image according to the animation parameters based on the animation playback information to realize the playback of the animation to be played.

[0013] In some implementations, the element bitmap is a bitmap image of the animated elements contained in the animation to be played, and the animation description file includes animation attributes, the animated elements contained in each frame image, and the animation parameters of the contained animated elements in each frame image.

[0014] In some implementations, based on animation playback information, the animation layers of the animation elements contained in each frame are combined according to animation parameters to achieve playback of the animation to be played. This includes: obtaining comparison information between adjacent frames by comparing the animation elements contained in each frame and the animation parameters of the contained animation elements in each frame, wherein the comparison information includes the same animation elements between adjacent frames, the variation parameters between the same animation elements, different animation elements, and the hierarchical relationship between various animation elements; based on the obtained comparison information, the playback of the subsequent frame is achieved by adjusting the type of animation layer of the preceding frame, the stacking order of each animation layer, the stacking position of each animation layer, and other animation parameters of each animation layer.

[0015] This application provides an animation processing apparatus, comprising: a sequence frame acquisition module for acquiring a sequence of SVG format frames of an animation to be played; an element segmentation module for dividing the animation objects contained in each frame image within the sequence frame into multiple animation elements; a bitmap acquisition module for acquiring the bitmap image of each animation element as the element bitmap corresponding to that animation element; a file generation module for generating an animation description file based on the animation elements contained in each frame image and the animation parameters of the contained animation elements in that frame image; and a source file determination module for using the animation description file and the element bitmaps corresponding to each animation element as the animation source file of the animation to be played.

[0016] In some implementations, the sequence frame acquisition module includes: a first acquisition module, used to convert a Flash-formatted animation to be played into an SVG-formatted sequence frame using a Flash editor; or, a second acquisition module, used to convert an After Effects-formatted animation to be played into an SVG-formatted sequence frame using BodyMovin.

[0017] In some implementations, the element partitioning module includes: a frame-by-frame comparison module, used to compare each sequence frame frame by frame and obtain comparison information between adjacent frames, wherein the comparison information includes the same animation objects between adjacent frames, the change parameters between the same animation objects, different animation objects, and the positional relationship between different animation objects; and an element partitioning submodule, used to, based on the comparison information, treat the parts of the vectors in each animation object that have not changed and the parts of the vectors that have changed as different animation elements.

[0018] In some implementations, the animation description file includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in each frame.

[0019] In some implementations, animation parameters include position parameters, transparency parameters, size parameters, and layer order parameters.

[0020] In some implementations, animation attributes include the total number of frames in the animation, the identifier of each frame, the FPS, and the animation size.

[0021] In some embodiments, the apparatus further includes: a file compression module for compressing the animation source file; and a file transfer module for transferring the compressed animation source file to a specified address so that the animation playback terminal can obtain the animation source file from the specified address.

[0022] This application provides an animation processing apparatus, comprising: a source file acquisition module for acquiring an animation source file of an animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element; a bitmap rendering module for rendering all element bitmaps and generating animation layers for each animation element; an information acquisition module for acquiring animation playback information from the animation description file, wherein the animation playback information includes animation attributes, animation elements contained in each frame image, and animation parameters of the contained animation elements in that frame image; and an animation playback module for combining the animation layers of the animation elements contained in each frame image according to the animation parameters based on the animation playback information, thereby realizing the playback of the animation to be played.

[0023] In some implementations, the animation playback module includes: a comparison information acquisition module, used to acquire comparison information between adjacent frames by comparing the animation elements contained in each frame image and the animation parameters of the contained animation elements in each frame image frame by frame, wherein the comparison information includes the same animation elements between adjacent frames, the change parameters between the same animation elements, different animation elements, and the hierarchical relationship between various animation elements; and a layer adjustment module, used to adjust the earlier frame image to achieve playback of the later frame image based on the acquired comparison information.

[0024] In some implementations, the element bitmap is a bitmap image of the animated elements contained in the animation to be played, and the animation description file includes animation attributes, the animated elements contained in each frame image, and the animation parameters of the contained animated elements in each frame image; the layer adjustment module is used to realize the playback of the subsequent frame image by adjusting the type of animation layer of the preceding frame image, the stacking order of each animation layer, the stacking position of each animation layer, and other animation parameters of each animation layer based on the acquired comparison information. Attached Figure Description

[0025] Figure 1 This is a flowchart of an embodiment of the animation processing method of this application;

[0026] Figure 2a This is a flowchart of another embodiment of the animation processing method of this application;

[0027] Figure 2b This is a first schematic diagram illustrating an animated element according to an exemplary embodiment of this application;

[0028] Figure 2c This is a second schematic diagram illustrating an animated element according to an exemplary embodiment of this application;

[0029] Figure 3 This is a block diagram of one embodiment of the animation processing apparatus of this application;

[0030] Figure 4This is a block diagram of another embodiment of the animation processing apparatus of this application;

[0031] Figure 5 This is a hardware structure diagram of the animation processing device of this application. Detailed Implementation

[0032] Exemplary embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numbers in different drawings denote the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with this application. Rather, they are merely examples of apparatuses and methods consistent with some aspects of this application as detailed in the appended claims.

[0033] The terminology used in this application is for the purpose of describing particular embodiments only and is not intended to be limiting of the application. The singular forms “a,” “the,” and “the” used in this application and the appended claims are also intended to include the plural forms unless the context clearly indicates otherwise. It should also be understood that the term “and / or” as used herein refers to and includes any or all possible combinations of one or more of the associated listed items.

[0034] It should be understood that although the terms first, second, third, etc., may be used in this application to describe various information, such information should not be limited to these terms. These terms are only used to distinguish information of the same type from one another. For example, without departing from the scope of this application, first information may also be referred to as second information, and similarly, second information may also be referred to as first information. Depending on the context, the word "if" as used herein may be interpreted as "when," "when," or "in response to determination."

[0035] With the development of network technology, static text and images have become insufficient to meet the needs of content display in network application environments, giving rise to animation technology that can dynamically display scene information. The rise of online live streaming, in particular, has driven the industry's demand for high-performance, low-consumption animation technology. For example, in an online live streaming scenario, when a user purchases a virtual item, a celebratory animation can be loaded on the live stream page, giving the user a strong sense of accomplishment. However, using celebratory animations consumes server resources to construct and load them. When there is a large amount of similar celebratory animation content to load, a high-performance, low-consumption animation technology becomes particularly important. In network application environments, the computing resources of both the server and client are limited, and network bandwidth is also limited. Therefore, when applying animation technology, the animation construction and playback process should not be too complex to reduce the high hardware requirements on the server and client; the animation size should also not be too large to avoid high bandwidth consumption. Extending to environments such as web pages, desktop applications, and mobile platform applications on smart terminals, all application scenarios involving animated content require a high-performance, low-consumption animation technology.

[0036] This application proposes an animation processing method that decomposes the animated object contained in each frame of a sequence of SVG (Scalable Vector Graphics) format animation to be played into multiple animated elements. Then, it obtains the bitmap image of each animated element and generates an animation description file that describes the animation attributes, the animated elements contained in each frame, and the animation parameters of the animated elements within each frame. Finally, it determines the animation description file and the bitmap images of each animated element as the animation source file for the animation to be played. The animation source file only includes the bitmap images of the animated elements and the animation description file, and its size is much smaller than that of the original frame images that repeatedly contain bitmap images of various animated elements. Therefore, it can effectively reduce the size of the animation file and solve the problem of excessively large animation file sizes in existing technologies.

[0037] Furthermore, when implementing animation playback by processing the animation source file, the process involves obtaining the animation source file, which includes the animation description file and bitmap images of various animation elements. All bitmap images are rendered, generating animation layers for each animation element. Then, animation playback information is obtained from the animation description file. Based on this information, the animation layers of the animation elements in each frame are combined according to the animation parameters to achieve playback of the animation. This eliminates the need to repeatedly render the same bitmap images of animation elements when playing different frames of animation, thus enabling fast animation playback while effectively reducing processor and memory consumption.

[0038] The animation involved in this application uses the concept of a frame to represent a single image frame, the smallest unit in the animation. For example, an animation has 20 frames per second, meaning that the animation consists of 20 images per second. This can be one image per frame or the same image repeated multiple times. Each frame represents the movement or change of a character or object, and the character or object in each frame is represented by the concept of an "animation object" in this application.

[0039] The present application will now be described through specific embodiments and in conjunction with specific application scenarios.

[0040] Figure 1 This is a flowchart of an embodiment of the animation processing method of this application, which can be used in a terminal and includes the following steps 101-105:

[0041] Step 101: Obtain the sequence frames of the animation to be played in SVG format.

[0042] The terminal involved in the embodiments of this application can be a terminal with animation editing function, such as: animation player, desktop computer, tablet computer, handheld computer, digital TV, smartphone and similar devices. The animation involved can be gift animation, special effects animation, bullet screen animation, etc. in live broadcast application, or other types of animation in this field. This application does not limit it.

[0043] When the animation to be played is a gift animation in a live streaming application, it is generally an original animation manuscript edited by animation designers, such as an animation manuscript in Photoshop format, Flash format, or AE format.

[0044] For animations of different formats to be played, they can be converted into SVG format sequence frames using different conversion methods. In one optional implementation, the SVG format sequence frames of the animation to be played can be obtained through the following operations:

[0045] Convert the Flash animation to be played into a sequence of SVG format using a Flash editor;

[0046] or,

[0047] BodyMovin converts an AE-formatted animation into a sequence of SVG frames.

[0048] In other embodiments of this application, for animations of other formats to be played, a corresponding animation editor can be used to convert them into SVG format sequence frames.

[0049] Step 102: Divide the animated objects contained in each frame of the sequence into multiple animated elements.

[0050] In adjacent frames of an animation to be played, an animated object may only undergo partial changes between two consecutive frames, while other parts remain unchanged. If, when rendering a later frame, the entire object is rendered to show the partial changes of an animated object, the unchanged parts are obviously rendered repeatedly, resulting in an increase in the size of the animation file and a waste of loading resources. To reduce the size of the animation and minimize the waste of loading resources, this embodiment of the application can decompose the animation to be played into individual frames. The animated object within each frame is then broken down into several animation elements according to rules that conform to its composition, thereby decomposing each frame into various animation elements and the animation parameters of each animation element within that frame. For example, if the animated object in each frame of the animation to be played is a character object, this character object can be broken down into elements such as head, torso, hands, and feet.

[0051] When decomposing an image into animation elements, it is necessary to compare the images frame by frame to find the similarities and differences between adjacent frames before decomposition. In one example, the animation objects contained in each frame of the sequence can be divided into multiple animation elements through the following operations:

[0052] Each sequence of frames is compared frame by frame to obtain comparison information between adjacent frames. The comparison information includes the same animation objects between adjacent frames, the change parameters between the same animation objects, different animation objects, and the positional relationship between different animation objects.

[0053] Based on the comparison information, the unchanged parts of the vectors in each animation object and the parts where the vectors have changed are respectively regarded as different animation elements.

[0054] In this example, after dividing each frame of the image, the same animation elements are found, and then one animation element is retained from multiple identical animation elements as an animation element. The frame to which each animation element belongs is recorded, as well as the combination relationship and animation parameters of each animation element in each frame of the image. The combination relationship is used to describe how to combine different animation elements into the original animation objects contained in each frame of the image. The animation parameters are used to describe the feature information of each animation element in each frame of the image, which may include position parameters, transparency parameters, size parameters, layer order parameters, etc.

[0055] Step 103: Obtain the bitmap image of each animation element as the element bitmap corresponding to that animation element.

[0056] In this embodiment, a bitmap image, also known as a raster image or a drawn image, is composed of individual points called pixels. These points can be arranged and colored differently to form a pattern. Bitmap images of various animation elements can be obtained using relevant techniques in the art. For the same animation element, only the bitmap image of one of them is obtained.

[0057] Step 104: Generate an animation description file based on the animation elements contained in each frame and the animation parameters of the contained animation elements in that frame. The animation description file includes animation attributes, the animation elements contained in each frame, and the animation parameters of the contained animation elements in each frame.

[0058] In this embodiment, the animation parameters may include position parameters, transparency parameters, size parameters, layer order parameters, etc. The animation attributes describe the overall animation characteristics of the animation to be played, and may include the total number of frames, the identifier of each frame, FPS (frames per second in the image processing field, commonly referred to as the number of frames in an animation or video), animation size, etc. The identifier of each frame may include the name of each frame, playback order, etc.

[0059] Step 105: Determine that the animation description file and the element bitmaps corresponding to each animation element are used as the animation source file for the animation to be played.

[0060] In this embodiment of the application, in order to reduce the size of the animation description file, the element bitmap of one animation element can be retained among multiple identical animation elements, so the contained element bitmaps can be different from each other.

[0061] After determining the source file of the animation to be played, the source file can be compressed. The compressed source file is then transferred to a designated address so that the animation playback device can retrieve the source file from that address. This designated address can be the address of an animation database, an animation server, or an animation shared cloud drive, etc.

[0062] Figure 2a This is a flowchart of another embodiment of the animation processing method of this application, which can be used in a terminal and includes the following steps 201-204:

[0063] Step 201: Obtain the animation source file of the animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element, the bitmaps of each element are bitmap images of the animation elements contained in the animation to be played, and the animation description file includes animation attributes, the animation elements contained in each frame image, and the animation parameters of the contained animation elements in each frame image.

[0064] The terminal involved in the embodiments of this application can be a terminal with animation playback function, such as: animation player, desktop computer, tablet computer, handheld computer, digital TV, smartphone and similar devices. The animation involved can be gift animation, special effects animation, bullet screen animation, etc. in live broadcast application, or other types of animation in this field. This application does not limit it.

[0065] The terminals involved, which have animation playback capabilities, can be equipped with an SVGA player. Before playing an animation, the animation source file to be played can be downloaded from a specified address. The downloaded animation source file is attached... Figure 1 This is generated using the corresponding animation processing method. After downloading the animation source file, if the animation source file is a compressed file, you can obtain its image description file and bitmaps of each element by decompressing it.

[0066] Step 202: Render all element bitmaps and generate animation layers for each animated element.

[0067] In this embodiment of the application, after generating the animation layers for each animation element, the same layer can be reused in different frame images of the animation to be played.

[0068] Step 203: Obtain animation playback information from the animation description file. The animation playback information includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in that frame.

[0069] In this embodiment of the application, the animation attributes and the animation parameters are... Figure 1 The animation attributes and parameters described in the animation processing method are as follows. Animation playback information can be directly read from the animation description file.

[0070] Step 204: Based on the animation playback information, combine the animation layers of the animation elements contained in each frame of the image according to the animation parameters to realize the playback of the animation to be played.

[0071] In this embodiment of the application, based on the animation playback information, the playback order of each frame image, the animation layers of the contained animation elements, the loading order of each animation layer, the positional relationship of each animation layer, and the animation parameters of each animation layer in each frame image can be obtained. Then, based on this information, the animation layers are loaded in sequence and the animation parameters of each animation layer are set, and each frame image is rendered to realize animation playback.

[0072] Furthermore, when rendering each frame, by comparing the playback order of each frame, the animation elements contained in each frame, and the animation parameters of the contained animation elements in each frame, the differences and similarities between adjacent frames can be obtained. Based on these differences and similarities, only the animation elements that have changed can be rendered, while the animation elements that have not changed are not processed, thereby saving the overhead of loading resources.

[0073] To save on animation size and processor overhead, this application introduces a description file mechanism to centrally record the loading order (playback order) of each frame image. The description file also includes preset parameters (animation parameters) for the rendered transformation of each animation element in the current keyframe image. By reading and executing the description file, the transformation of each animation element in each keyframe image can be rendered sequentially. The frames are loaded according to the loading order to create the animation.

[0074] Because the description file centrally records the change parameters of each animation element, the resources needed to render the shape changes of each animation element can be preloaded before rendering the first frame. This avoids the need to calculate in real time which animation elements need to be rendered in each frame and dynamically query the resources required to render the shape changes of these animation elements. This avoids the consumption of computational resources that would otherwise be consumed during real-time, dynamic querying, loading, and calculation. Therefore, introducing a description file mechanism to optimize the animation process can reduce the consumption of computational resources for animation.

[0075] In one alternative implementation, the animation layers of the animation elements contained in each frame of the image can be combined according to the animation parameters based on the animation playback information to achieve the playback of the animation to be played:

[0076] By comparing the animation elements contained in each frame of an image and the animation parameters of the animation elements in each frame of an image, comparison information between adjacent frames of an image is obtained. The comparison information includes the same animation elements between adjacent frames of an image, the change parameters between the same animation elements, the different animation elements, and the hierarchical relationship between the various animation elements.

[0077] Based on the acquired comparison information, the playback of the subsequent frame is achieved by adjusting the type of animation layer, the stacking order of each animation layer, the stacking position of each animation layer, and other animation parameters of each animation layer in the preceding frame.

[0078] In this method, one type of animation layer corresponds to one type of animation element. The stacking order and position of each animation layer are set by the designer based on the animation effect during the animation design process. Other animation parameters may include the transparency, deformation, displacement, container size, etc. of the animation layers.

[0079] Furthermore, during the animation loading (rendering) process, some animated elements appear in the animation for the first time in the first frame, while others do not appear until the tenth frame. For example... Figure 2b As shown, for animation element A1, which needs to be displayed for the first time in the first frame, its initial state is visible in the first frame. For animation elements B1 and C1, which are rendered and displayed for the first time in subsequent frames, their initial changes in form can be invisible in the first frame. When the description file loads to the frame where these animation elements are first rendered and displayed, the changes in form of these animation elements are made visible by setting their animation parameters. Figure 2c As shown, animation element A1 is still visible as animation element A2 in this image. By setting the animation parameters of animation element B1, it is made to appear in the first image as visible as animation element B2. Animation element C1 is still invisible as animation element C2 in this image. Therefore, all animation elements are pre-rendered before rendering the first frame of the animation (animation elements not displayed in the first frame can be set to invisible). When loading a frame where previously undisplayed animation elements need to be displayed, their visibility can be modified simply by setting their animation parameters, thus displaying these animation elements without needing to re-render them to a displayable state.

[0080] In terms of resource overhead for rendering animated elements alone, static pre-rendering of animated elements before displaying the first frame has significantly lower resource overhead than dynamic rendering of animated elements when rendering each frame. Moreover, compared to re-rendering an animated element, simply changing the visibility state of the animated element can significantly reduce the loading overhead of the animation.

[0081] Generally, the visibility of an animated element can be changed by setting the following parameters: position, opacity, container size (size parameter), shape, displacement, and layer order:

[0082] Setting the position parameters of animated elements allows you to control their initial position in each frame of the image.

[0083] Setting the opacity of an animated element controls whether it is visible in the sequence of frames. For example, when the opacity is 100%, the animated element is fully visible; when the opacity is 0%, the animated element is completely invisible; when the opacity is between 100% and 0%, the animated element exhibits different degrees of perspective effect.

[0084] Setting the transparency of animated elements also allows you to control their color. By changing the transparency of the three primary colors of the animated element—red, yellow, and blue—you can achieve a color-matching process and change the color of the animated element.

[0085] Setting the shape variable of an animated element allows you to control its shape changes.

[0086] Setting the container size of an animated element controls the display range of the animated element within the sequence frames.

[0087] Setting the displacement of an animated element allows you to control the distance the animated element moves relative to its initial position.

[0088] Setting the order of animated elements within the same layer allows you to differentiate and control the same animated elements in the same frame (which can refer to the same animated elements in different layers within the same sequence of frames), and also controls the mutual occlusion relationships of various animated elements in different frames.

[0089] As can be seen from the above embodiments: The sequence of SVG format frames of the animation to be played is obtained; then, the animation objects contained in each frame are split into multiple animation elements; the bitmap image of each animation element is obtained; and then an animation description file is generated to describe the animation attributes, the animation elements contained in each frame, and the animation parameters of the contained animation elements in each frame. Finally, the animation description file and the bitmap images of each animation element are determined as the animation source file of the animation to be played. Because the animation source file only includes the bitmap images of the animation elements and the animation description file, its space size is much smaller than that of the original frame images that repeatedly contain bitmap images of each animation element. Therefore, the size of the animation file can be effectively reduced, solving the problem of excessively large animation file size in the prior art.

[0090] Furthermore, when implementing animation playback by processing the animation source file, the process involves obtaining the animation source file, which includes the animation description file and bitmap images of various animation elements. All bitmap images are rendered, generating animation layers for each animation element. Then, animation playback information is obtained from the animation description file. Based on this information, the animation layers of the animation elements in each frame are combined according to the animation parameters to achieve playback of the animation. This eliminates the need to repeatedly render the same bitmap images of animation elements when playing different frames of animation, thus enabling fast animation playback while effectively reducing processor and memory consumption.

[0091] When applied to live streaming, the CPU usage during animation playback is only half that of the original playback scheme, with only a slight increase in GPU usage and memory usage also only half that of the original scheme. The size of the animation source file is only 10% of the original playback scheme.

[0092] Corresponding to the embodiments of the aforementioned animation processing method, this application also provides embodiments of an animation processing apparatus.

[0093] See Figure 3 , Figure 3 This is a block diagram of an embodiment of the animation processing apparatus of this application. The apparatus may include: a sequence frame acquisition module 310, an element division module 320, a bitmap acquisition module 330, a file generation module 340, and a source file determination module 350.

[0094] The sequence frame acquisition module 310 is used to acquire SVG format sequence frames of the animation to be played.

[0095] The element division module 320 is used to divide the animation objects contained in each frame of the sequence frame into multiple animation elements.

[0096] Bitmap acquisition module 330 is used to acquire the bitmap image of each animation element as the element bitmap corresponding to that animation element.

[0097] The file generation module 340 is used to generate an animation description file based on the animation elements contained in each frame image and the animation parameters of the contained animation elements in the frame image. The animation description file includes animation attributes, the animation elements contained in each frame image, and the animation parameters of the contained animation elements in each frame image.

[0098] The source file determination module 350 is used to determine the animation description file and the element bitmaps corresponding to each animation element as the animation source file of the animation to be played.

[0099] In an alternative implementation, the sequence frame acquisition module 310 may further include ( Figure 3 (not shown in the image)

[0100] The first acquisition module is used to convert the Flash-format animation to be played into a sequence of SVG format frames using a Flash editor.

[0101] or,

[0102] The second acquisition module is used to convert the AE format animation to be played into a sequence of SVG format frames using BodyMovin.

[0103] In another alternative implementation, the element partitioning module 320 may also include ( Figure 3 (not shown in the image)

[0104] The frame-by-frame comparison module is used to compare each sequence of frames one by one and obtain comparison information between adjacent frames. The comparison information includes the same animation objects between adjacent frames, the change parameters between the same animation objects, different animation objects, and the positional relationship between different animation objects.

[0105] The element segmentation submodule is used to, based on the comparison information, treat the unchanged parts of the vectors in each animation object and the changed parts of the vectors as different animation elements.

[0106] In another alternative implementation, the animation parameters include position parameters, transparency parameters, size parameters, and layer order parameters.

[0107] In another alternative implementation, the animation attributes include the total number of frames in the animation, the identifier of each frame, the FPS, and the animation size.

[0108] In another optional implementation, the animation processing apparatus of this application embodiment may further include ( Figure 3 (not shown in the image)

[0109] The file compression module is used to compress the animation source files.

[0110] The file transfer module is used to transfer the compressed animation source file to a specified address so that the animation playback terminal can obtain the animation source file from the specified address.

[0111] See Figure 4 , Figure 4 This is a block diagram of another embodiment of the animation processing apparatus of this application. The apparatus may include: a source file acquisition module 410, a bitmap rendering module 420, an information acquisition module 430, and an animation playback module 440.

[0112] The source file acquisition module 410 is used to acquire the animation source file of the animation to be played. The animation source file includes an animation description file and bitmaps of each element. The bitmaps of each element are bitmap images of the animation elements contained in the animation to be played. The animation description file includes animation attributes, the animation elements contained in each frame image, and the animation parameters of the contained animation elements in each frame image.

[0113] Bitmap rendering module 420 is used to render all element bitmaps and generate animation layers for various animation elements.

[0114] The information acquisition module 430 acquires animation playback information from the animation description file. The animation playback information includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in that frame.

[0115] The animation playback module 440 is used to combine the animation layers of the animation elements contained in each frame of the image according to the animation parameters based on the animation playback information, so as to realize the playback of the animation to be played.

[0116] In an alternative implementation, the animation playback module 440 may further include ( Figure 4 (not shown in the image)

[0117] The comparison information acquisition module is used to acquire comparison information between adjacent frames by comparing the animation elements contained in each frame image and the animation parameters of the contained animation elements in each frame image frame by frame. The comparison information includes the same animation elements between adjacent frames, the change parameters between the same animation elements, the different animation elements, and the hierarchical relationship between the various animation elements.

[0118] The layer adjustment module is used to adjust the animation layer type, stacking order, stacking position, and other animation parameters of the preceding frame image based on the acquired comparison information, so as to enable the playback of the following frame image.

[0119] The specific implementation process of the functions and roles of each unit (or module) in the above device can be found in the implementation process of the corresponding steps in the above method, and will not be repeated here.

[0120] For the device embodiments, since they basically correspond to the method embodiments, the relevant parts can be referred to in the description of the method embodiments. The device embodiments described above are merely illustrative. The units or modules described as separate components may or may not be physically separate. The components shown as units or modules may or may not be physical units or modules, that is, they may be located in one place or distributed across multiple network units or modules. Some or all of the modules can be selected to achieve the purpose of this application according to actual needs. Those skilled in the art can understand and implement this without creative effort.

[0121] Embodiments of the animation processing apparatus of this application can be applied to electronic devices. Specifically, they can be implemented by a computer chip or physical entity, or by a product with a certain function. In a typical implementation, the electronic device is a computer, which can be a personal computer, laptop computer, cellular phone, camera phone, smartphone, personal digital assistant, media player, navigation device, email sending and receiving device, game console, tablet computer, wearable device, internet TV, smart vehicle, smart home device, or any combination of these devices.

[0122] The device implementation can be achieved through software, hardware, or a combination of both. Taking software implementation as an example, as a logical device, it is formed by the processor of the electronic device reading corresponding computer program instructions from non-volatile memory or other readable media into memory for execution. From a hardware perspective, such as... Figure 5 The diagram shown is a hardware structure diagram of an electronic device containing the animation processing apparatus of this application. (Except for...) Figure 5 In addition to the processor, memory, network interface, and non-volatile memory shown, the electronic device in the embodiment may also include other hardware depending on its actual function, which will not be elaborated further. The storage processor of the electronic device may be a memory for executing instructions; the processor may be coupled to the memory to read program instructions stored in the memory and, in response, perform the following operations: acquire a sequence of SVG format frames of the animation to be played; divide the animation objects contained in each frame image within the sequence of frames into multiple animation elements; acquire the bitmap image of each animation element as the element bitmap corresponding to that animation element; generate an animation description file based on the animation elements contained in each frame image and the animation parameters of the contained animation elements in that frame image, the animation description file including animation attributes, the animation elements contained in each frame image, and the animation parameters of the contained animation elements in each frame image; determine that the animation description file and the element bitmaps corresponding to each animation element are used as the animation source file of the animation to be played.

[0123] In another embodiment, the storage processor of the electronic device may be a memory for executable instructions; the processor may be coupled to the memory for reading program instructions stored in the memory and, in response, performing the following operations: obtaining an animation source file of an animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element, the bitmaps being bitmap images of the animation elements contained in the animation to be played, the animation description file including animation attributes, animation elements contained in each frame image, and animation parameters of the contained animation elements in each frame image; rendering all element bitmaps to generate animation layers for each animation element; obtaining animation playback information from the animation description file, the animation playback information including animation attributes, animation elements contained in each frame image, and animation parameters of the contained animation elements in that frame image; and, based on the animation playback information, combining the animation layers of the animation elements contained in each frame image according to the animation parameters to realize the playback of the animation to be played.

[0124] In other embodiments, the operations performed by the processor can be referred to the relevant descriptions in the above method embodiments, and will not be repeated here.

[0125] The above description is merely a preferred embodiment of this application and is not intended to limit this application. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the scope of protection of this application.

Claims

1. An animation processing method, characterized in that, Includes the following steps: Get the sequence of SVG format frames of the animation to be played; The animated objects contained in each frame of the sequence are divided into multiple animated elements; Get the bitmap image of each animation element as the element bitmap corresponding to that animation element; An animation description file is generated based on the animation elements contained in each frame and the animation parameters of those elements within that frame. The animation description file and the element bitmaps corresponding to each animation element are used as the animation source file of the animation to be played. The step of dividing the animated objects contained in each frame of the sequence into multiple animated elements includes: Each sequence of frames is compared frame by frame to obtain comparison information between adjacent frames. The comparison information includes the same animation objects between adjacent frames, the change parameters between the same animation objects, different animation objects, and the positional relationship between different animation objects. Based on the comparison information, the parts of the vector that have not changed and the parts of the vector that have changed in each animated object are respectively regarded as different animation elements.

2. The method as described in claim 1, characterized in that, The process of obtaining the sequence of SVG format frames of the animation to be played includes: Convert the Flash animation to be played into a sequence of SVG format using a Flash editor; or, BodyMovin converts an AE-formatted animation into a sequence of SVG frames.

3. The method as described in claim 1, characterized in that, The animation description file includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in each frame.

4. The method as described in claim 3, characterized in that, The animation parameters include position parameters, transparency parameters, size parameters, and layer order parameters.

5. The method as described in claim 3, characterized in that, The animation attributes include the total number of frames, the identifier of each frame, the FPS, and the animation size.

6. The method according to any one of claims 1 to 5, characterized in that, The method further includes the following steps: Compress the animation source file; The compressed animation source file is transferred to a specified address so that the animation playback terminal can obtain the animation source file from the specified address.

7. An animation processing method, characterized in that, Includes the following steps: Obtain the animation source file of the animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element; Render all element bitmaps and generate animation layers for each animated element; Obtain animation playback information from the animation description file. The animation playback information includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in that frame. Based on the animation playback information, the animation layers of the animation elements contained in each frame are combined according to the animation parameters to realize the playback of the animation to be played; The step of combining the animation layers of the animation elements contained in each frame of the image according to the animation parameters based on the animation playback information to realize the playback of the animation to be played includes: By comparing the animation elements contained in each frame of the image and the animation parameters of the animation elements in each frame of the image, comparison information between adjacent frames of the image is obtained. The comparison information includes the same animation elements between adjacent frames of the image, the change parameters between the same animation elements, the different animation elements, and the hierarchical relationship between the various animation elements. Based on the acquired comparison information, the playback of the subsequent frame is achieved by adjusting the type of animation layer, the stacking order of each animation layer, the stacking position of each animation layer, and other animation parameters of each animation layer in the preceding frame.

8. The method as described in claim 7, characterized in that, The element bitmap is a bitmap image of the animated elements contained in the animation to be played, and the animation description file includes animation attributes, the animated elements contained in each frame image, and the animation parameters of the contained animated elements in each frame image.

9. An animation processing device, characterized in that, include: The sequence frame acquisition module is used to acquire SVG format sequence frames of the animation to be played. The element segmentation module is used to divide the animation objects contained in each frame of the sequence frame into multiple animation elements; The bitmap acquisition module is used to acquire the bitmap image of each animation element as the element bitmap corresponding to that animation element; The file generation module is used to generate an animation description file based on the animation elements contained in each frame and the animation parameters of the contained animation elements in that frame. The source file determination module is used to use the animation description file and the element bitmaps corresponding to each animation element as the animation source file of the animation to be played. The element partitioning module includes: The frame-by-frame comparison module is used to compare each sequence frame one by one and obtain the comparison information between each adjacent frame. The comparison information includes the same animation objects between adjacent frames, the change parameters between the same animation objects, different animation objects, and the positional relationship between different animation objects. The element segmentation submodule is used to, based on the comparison information, treat the unchanged parts of the vectors in each animation object and the parts where the vectors have changed as different animation elements.

10. The apparatus as claimed in claim 9, characterized in that, The sequence frame acquisition module includes: The first acquisition module is used to convert the Flash-format animation to be played into a sequence of SVG format frames using a Flash editor; or, The second acquisition module is used to convert the AE format animation to be played into a sequence of SVG format frames using BodyMovin.

11. The apparatus as claimed in claim 9, characterized in that, The animation description file includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in each frame.

12. The apparatus as claimed in claim 11, characterized in that, The animation parameters include position parameters, transparency parameters, size parameters, and layer order parameters.

13. The apparatus as claimed in claim 11, characterized in that, The animation attributes include the total number of frames, the identifier of each frame, the FPS, and the animation size.

14. The apparatus according to any one of claims 9 to 13, characterized in that, The device further includes: The file compression module is used to compress the animation source files; The file transfer module is used to transfer the compressed animation source file to a specified address so that the animation playback terminal can obtain the animation source file from the specified address.

15. An animation processing device, characterized in that, include: The source file acquisition module is used to acquire the animation source file of the animation to be played, wherein the animation source file includes an animation description file and bitmaps of each element; The bitmap rendering module is used to render all element bitmaps and generate animation layers for various animation elements; The information acquisition module acquires animation playback information from the animation description file. The animation playback information includes animation attributes, animation elements contained in each frame, and animation parameters of the contained animation elements in that frame. An animation playback module is used to combine the animation layers of the animation elements contained in each frame of the image according to the animation parameters based on the animation playback information, so as to realize the playback of the animation to be played. The comparison information acquisition module is used to acquire comparison information between adjacent frames by comparing the animation elements contained in each frame image and the animation parameters of the contained animation elements in each frame image frame by frame. The comparison information includes the same animation elements between adjacent frames, the change parameters between the same animation elements, the different animation elements, and the hierarchical relationship between the various animation elements. The layer adjustment module is used to adjust the previous frame of an image to enable playback of the next frame based on the acquired comparison information.

16. The apparatus as claimed in claim 15, characterized in that, The element bitmap is a bitmap image of the animation elements contained in the animation to be played, and the animation description file includes animation attributes, the animation elements contained in each frame image, and the animation parameters of the contained animation elements in each frame image. The layer adjustment module is used to adjust the animation layer type, stacking order, stacking position, and other animation parameters of the preceding frame image based on the acquired comparison information, so as to enable the playback of the following frame image.

Images