Animation File Generation with Keyframe Reduction for Web Playback

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Traditional animation development methods are lengthy and prone to errors due to cumbersome communication between designers and webpage developers, leading to suboptimal animation effects.

Innovation Solution

An animation file generation method that directly processes animation design files to determine keyframe animation information and attribute change trajectories, performing keyframe reduction to generate a target animation file efficiently, thereby reducing file volume and improving playback performance.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Manufacturing precision

If traditional animation development methods are used with designer-developer communication, then animation design can be completed, but the development cycle becomes lengthy and errors occur

Engineering Contradiction:

Improveanimation effect accuracyVSAvoiddevelopment cycle

Core Design Contradiction:

Manufacturing precisionVSLoss of time

Solution Approach 1:

The patent uses After Effects animation design files as a template or copy that directly defines the animation behavior. Instead of manually translating designer intent through communication, the system parses the After Effects file structure (XML format) to automatically extract animation parameters, layer information, and keyframe data, thereby eliminating communication errors and reducing development time

Inventive Principle:

Principle #26Copying

Solution Approach 2:

The patent replaces the mechanical communication process between designers and developers with an automated parsing system. The system uses programmatic analysis of After Effects project files to directly obtain animation data, substituting human-to-human communication with a computer-to-computer data extraction process that is both faster and more accurate

Inventive Principle:

Principle #28Mechanics substitution (Replace mechanical system)

2Ease of manufacture

If manual frame-by-frame restoration is performed by webpage developers, then animation can be implemented, but the process is lengthy and error-prone

Engineering Contradiction:

Improveanimation implementationVSAvoidanimation development speed

Core Design Contradiction:

Ease of manufactureVSProductivity

Solution Approach 1:

The system enables self-service by allowing the After Effects animation file to serve as its own specification document. The parsing system automatically extracts all necessary animation data directly from the design file without requiring developer interpretation or manual restoration, making the process both easier and faster

Inventive Principle:

Principle #25Self-service

Solution Approach 2:

The patent performs preliminary action by pre-organizing animation data in the After Effects project file structure before the web implementation stage. All animation parameters, layer properties, and timing information are预先 (pre) calculated and stored in the AE file, so that the parsing process only needs to extract and translate the data rather than create it from scratch

Inventive Principle:

Principle #10Preliminary action

3Manufacturing precision

If constant confirmation of details occurs between developers and designers, then animation accuracy can be maintained, but the process becomes lengthy

Engineering Contradiction:

Improveanimation detail accuracyVSAvoidprocess complexity

Core Design Contradiction:

Manufacturing precisionVSDevice complexity

Solution Approach 1:

The system creates a direct digital copy of the animation specification from the After Effects file structure. By parsing the XML-based project file, the system captures animation details in their original form without requiring repeated confirmation cycles, as the data structure itself serves as the authoritative specification

Inventive Principle:

Principle #26Copying

4Manufacturing precision

If animation files are generated without keyframe reduction, then animation quality is maintained, but file volume increases and playback performance decreases

Engineering Contradiction:

Improveanimation qualityVSAvoidplayback performance

Core Design Contradiction:

Manufacturing precisionVSSpeed

Solution Approach 1:

The patent extracts only the essential keyframe information from the complete After Effects animation data. By identifying and extracting only the critical keyframes that define animation changes rather than including all frame data, the system reduces file volume while maintaining animation quality and improving playback performance

Inventive Principle:

Principle #2Taking out (Extraction)

Data Source

PatentUS20260105668A1Method for generating animation files and products thereof

Publication Date: 2026.04.16 NANJING XIYIN ECOMMERCE CO LTD

AI summary

An animation file generation method includes obtaining an animation design file, determining keyframe animation information corresponding to each keyframe based on the animation design file, determining an attribute change trajectory of layer animation attributes corresponding to each layer in the animation design file based on layer animation information corresponding to each layer and the keyframe animation information corresponding to each keyframe in the animation design file, performing keyframe reduction on each layer based on the attribute change trajectory of the layer animation attributes corresponding to each layer to obtain a set of target keyframes corresponding to each layer, and generating a target animation file based on the set of target keyframes corresponding to each layer. It enables efficient and convenient generation of animation files, shortens the animation development cycle, improves the playback performance of animation files, thereby facilitating the creation of advertisement pages, and enhancing customer acquisition efficiency.