Source-linked AI summary
Vector Prism: Animating Vector Graphics by Stratifying Semantic Structure
Jooyeol Yun, Jaegul Choo
TL;DR
VLMs struggle to animate SVGs because their structures obscure meaningful parts, despite advances in planning and code generation. Vector Prism infers semantic labels from multiple weak predictions and reorganizes SVGs into meaningful groups. The paper reports best scores across its metrics and identifies primitive granularity as a boundary on animation flexibility.
Problem
SVG primitives are often fragmented or grouped for draw order rather than semantics, while native hierarchies rarely provide the structure VLMs need to animate meaningful parts.
Source: §1 · p. 2, §3.3 · p. 3Method
Vector Prism uses statistical inference to turn noisy labels from multiple views into semantic labels, then restructures SVG primitives into animation-ready hierarchies.
Source: §1 · p. 2Results
The method achieves the best scores across all evaluated metrics and outperforms video models without training on large-scale video-text datasets.
Source: §4.4 · p. 5Takeaways & Limitations
The authors conclude that semantic anchors let VLMs reason about meaningful SVG parts and generate targeted motion without extensive domain-specific fine-tuning.
Source: §6 · p. 8Primitives remain atomic, so SVGs with overly coarse elements can limit animation flexibility when an instruction requires subdividing a shape.
Source: §5.3 · p. 8
Abstract
from arXiv · showhide
Scalable Vector Graphics (SVG) are central to modern web design, and the demand to animate them continues to grow as web environments become increasingly dynamic. Yet automating the animation of vector graphics remains challenging for vision-language models (VLMs) despite recent progress in code generation and motion planning. VLMs routinely mis-handle SVGs, since visually coherent parts are often fragmented into low-level shapes that offer little guidance of which elements should move together. In this paper, we introduce a framework that recovers the semantic structure required for reliable SVG animation and reveals the missing layer that current VLM systems overlook. This is achieved through a statistical aggregation of multiple weak part predictions, allowing the system to stably infer semantics from noisy predictions. By reorganizing SVGs into semantic groups, our approach enables VLMs to produce animations with far greater coherence. Our experiments demonstrate substantial gains over existing approaches, suggesting that semantic recovery is the key step that unlocks robust SVG animation and supports more interpretable interactions between VLMs and vector graphics.
1. Introduction
SVG animation demand is growing, but VLMs often fail because SVGs organize shapes for rendering rather than semantic clarity. Vector Prism recovers semantic groups from noisy predictions, enabling more coherent animation.
1. Introduction
- VLM-generated animations often break because visually coherent elements are fragmented or grouped by draw order, obscuring which parts should move together.SVGs are optimized for rendering efficiency rather than semantic clarity; Figure 2 contrasts unclear, fragmented elements with descriptive semantic tags.Source: §1 · pp. 1–2, Figure 2 · p. 2
- The paper targets the overlooked step of restructuring SVGs so VLMs can reference semantic units and attach motion to the correct parts.The native SVG hierarchy rarely supplies the semantic structure needed for animation.Source: §1 · p. 2
- Vector Prism aggregates weak semantic labels from multiple focused visualizations through statistical inference and a Bayes decision rule.The method analyzes agreement patterns rather than using simple majority voting to infer plausible part labels.Source: §1 · p. 2
- It restructures primitives into animation-ready hierarchies, aligning SVG syntax with visual semantics so VLMs can animate meaningful parts coherently.The resulting motion is described as visually stable and semantically consistent.Source: §1 · p. 2
- Vector Prism significantly improves animation quality and instruction faithfulness over state-of-the-art methods, including commercial Sora 2.The introduction attributes these gains to inferring robust semantics from weak labels across multiple focused visualizations.Source: §1 · p. 2
2. Related Work
Prior approaches optimize vector graphics through diffusion priors or scale performance through fine-tuning and data. The paper instead focuses on recovering element-level semantics in complex SVGs for downstream animation.
2. Related Work
- Diffusion-prior optimization acts on rasterized renderings, resists large part rearrangements, and can yield repetitive, visibly jittery motion without temporal regularization.These methods typically optimize vector or animation parameters using gradients from pretrained image or video diffusion priors.Source: §2 · p. 2
- Fine-tuned LLM approaches produce vector parameters or animation commands, but performance scales primarily with data and can require millions of examples.The paper’s approach is orthogonal to this data-scaling strategy: it recovers semantics from input SVG elements.Source: §2 · p. 2
- Raw vector representations are designed for rendering and manipulation, making them difficult for people and models to inspect and understand.Prior VLM understanding of rasterized vectors is reported to falter on individual parts in complex real-world graphics.Source: §2 · pp. 2–3
- The paper targets complex real-world SVGs by labeling individual primitives through statistical inference, without fine-tuning VLMs.The authors identify primitive-level labeling as a capability required for animation.Source: §2 · p. 3
3. Method
The pipeline plans motion from a rendered scene, restructures SVG primitives using statistically inferred semantic labels, then generates animation code. Vector Prism bridges visual reasoning and SVG syntax by making noisy predictions usable for organizing parts.
3.1. The overview
- The overview pipeline proceeds from animation planning to semantic wrangling and then to executable animation-code generation.The restructuring stage connects the VLM’s semantic scene plan with code-level SVG representation.Source: §3.1 · p. 3
3.2. Animation planning
- For planning, a VLM reads a rasterized SVG and user instruction to identify semantic components and propose their motions and relationships.For “make the sun rise,” it identifies the sun and sky and proposes upward sun motion and gradual sky brightening; restructuring bridges the plan to SVG syntax.Source: §3.2 · p. 3
3.3. Vector Prism
- Vector Prism renders each primitive through complementary views for VLM labeling and assumes each rendering method has an accuracy, with errors distributed uniformly across other labels.Views include highlighting, bounding-box overlays, zoomed crops, and isolation on a blank background.Source: §3.3 · p. 4
- Pairwise agreement across renderings is adjusted for chance agreement to estimate method reliability, which informs a Bayes weighted vote over candidate labels.When rendering methods are equally reliable, the decision rule reduces to majority voting; differing reliabilities give it a strict advantage over majority voting, per the paper’s stated bound.Source: §3.3 · p. 4
- The restructuring step groups primitives by reliable semantic labels while preserving appearance and original paint order, turning meaning into SVG organization.It flattens the hierarchy to apply visual properties directly to primitives and checks overlaps between differently labeled groups for rendering changes.Source: §3.3 · p. 4
3.4. Animation generation
- Animation code is generated as CSS by semantic category in iterations, retaining completed animations in context and enforcing mutual exclusivity between effects.The authors chose CSS for simplicity and state that the approach can extend to JavaScript or specialized libraries.Source: §3.4 · p. 4
4. Experiments
The experiments evaluate animation generation across varied SVG tasks, baseline methods, quantitative and qualitative measures, and human preferences. Results favor Vector Prism on reported metrics and in human comparisons, while qualitative analysis highlights distinct limitations of video-generation baselines.
4.1. Dataset
- The test set contains 114 curated SVG–instruction pairs spanning simple movements through complex actions such as 3D rotations and synchronized transitions.SVGs were sourced from SVGRepo and include animals, logos, buildings, and natural elements.Source: §4.1 · p. 5
4.2. Baselines
- The baselines include optimization-based AniClipart, GPT-5 with the shared planning and animation pipeline, and raster-video models Wan 2.2 and Sora 2.The video models are included for their instruction following and video quality, although they do not produce vector files.Source: §4.2 · p. 5
4.3. Implementation Details
- Implementation uses GPT-5-nano for planning and semantic labeling, GPT-5 for animation generation, and 512 × 512 primitive renderings for VLM analysis.Agreement patterns are collected in one full pass per SVG, and agreement matrices are not shared across SVGs because rendering-method reliability varies with SVG complexity and structure.Source: §4.3 · p. 5
4.4. Quantitative Evaluation
- Vector Prism achieves the best scores across all reported metrics, with advantages in motion realism and instruction faithfulness.Table 1 reports the quantitative comparison; the evaluation also notes that the method outperforms video models without large-scale video-text training.Source: §4.4 · p. 5, Table 1 · p. 5
4.5. Qualitative Analysis
- AniClipart and GPT-5 often produce uniform, swaying, or barely moving animations, while Wan 2.2 and Sora 2 can collapse into static frames or distorted scenes for dynamic instructions.The latter produce rasterized video rather than vector graphics; Figure 4 presents examples generated by each method.Source: Figure 4 · p. 6, §4.5 · p. 7
4.6. User Study
- In 760 pairwise comparisons from 19 participants, human preferences consistently favor Vector Prism, including against Sora 2 and Wan 2.2.Figure 5 summarizes the aggregated preferences.Source: §4.6 · p. 7, Figure 5 · p. 7
5. Analysis
The analysis examines vector-animation encoding efficiency, semantic grouping stability, and the limits imposed by input SVG granularity. It reports a 54× file-size gap versus Sora 2 and substantially lower clustering error than original groupings or majority voting, while noting that coarse primitives constrain animation flexibility.
5.1. Encoding efficiency of vector-based animations
- Sora 2 produces average files 54× larger than Vector Prism’s, and the gap widens as video resolution and duration increase.Vector animations encode motion through compact CSS keyframes rather than generating every pixel; file size depends primarily on SVG complexity and animation-code length, not output resolution or frame rate.Source: §5.1 · p. 7
5.2. Stability compared to majority voting
- Davies-Bouldin index falls from 33.8 for original groupings and 12.6 for majority voting to 0.82 for Vector Prism.The analysis treats semantic groups as clusters and computes distances in DINO v3 feature space; Vector Prism estimates rendering-method reliability to downweight noisy responses.Source: §5.2 · pp. 7–8
5.3. Failure Cases
- Animation flexibility is bounded by the input SVG’s primitive granularity: an atomic path cannot be subdivided to satisfy instructions such as shattering into pieces.The paper suggests user refinement with vectorization tools or future automatic primitive subdivision as possible ways to address this limitation.Source: §5.3 · p. 8, Figure 8 · p. 8
6. Conclusion
Vector Prism uses multi-view statistical inference to turn noisy VLM predictions into semantic labels and restructure SVGs for animation. The authors report improved animation quality and instruction fidelity over vector animation techniques and raster video generation models, and argue that semantic-structure alignment may generalize across symbolic domains.
6. Conclusion
- Vector Prism's multi-view statistical inference transforms noisy VLM predictions into robust semantic labels, supporting animation-ready SVG hierarchies without extensive domain-specific VLM fine-tuning.The reported evaluations show improvements in animation quality and instruction fidelity over existing vector animation techniques and state-of-the-art raster video generation models.Source: §6 · p. 8
- The authors view bridging the semantic-syntactic gap as a generalizable step for VLMs across symbolic domains, including vector graphics and 3D assets and scenes.They propose aligning human semantic intent with machine-readable structure as a way to broaden language-model capabilities.Source: §6 · p. 8
Supplementary Material
The supplementary material lists supporting sections on reliability estimation, evaluation alignment, data coverage, prompts, and SVG restructuring. It also situates the work among vector-graphics generation and domain-specific SVG understanding approaches.
Supplementary Material
- The supplementary material lists sections on confidence bounds, video-text alignment, dataset composition, VLM prompts, and restructuring SVG files with semantic labels.Its contents also include extended related work and two subsections on confidence-bound derivation and reliability estimation.Source: Supplementary Material · p. 11
A.1. Vector graphics generation and decomposition
- Prior vector-graphics work includes diffusion-prior optimization, hierarchical vector generation, layered decomposition, and resource-efficient animated-sticker generation; this method assumes a user-provided SVG but can combine with image-to-SVG or text-to-SVG models.The cited approaches include DeepSVG [3], LayerPeeler [34], and Yuan et al. [41].Source: §A.1 · p. 12
A.2. Domain-specific SVG understanding
- SVG chart understanding uses domain-specific parsing and labeled chart corpora, whereas this framework targets general-purpose illustrations and icons whose semantic parts are visual objects rather than data encodings.The passage cites Mystique and VisAnatomy [6] as chart-focused work.Source: §A.2 · p. 12
A.3. Language models for design tasks
Related design work suggests that structuring visual representations can help language models reason about design. The supplementary proof formalizes how pairwise agreement relates to method reliability and motivates reliability-weighted inference over majority voting.
A.3. Language models for design tasks
- LayoutPrompter [14] and PosterO [12] structure spatial relationships or layout trees for language-model design reasoning, aligning with the view that models are not inherently incapable of design [38].The passage says their potential emerges when design representations align with natural-language structures.Source: §A.3 · p. 12
B. Confidence Bounds for Reliability Estimation
- The confidence-bound appendix derives method reliabilities from pairwise agreement and proves that a Bayes-weighted vote is superior to majority voting.The proof sections cover agreement-based reliability derivation and an error-bound comparison.Source: B. Confidence Bounds for Reliability… · p. 12
B.1. Decomposing agreements and deriving the rank-one structure
- Under the symmetric Dawid-Skene model, pairwise agreement reflects cases where both methods are correct or both share the same wrong label, yielding a centered agreement matrix with rank-one expectation.The matrix structure is proportional to the outer product of the centered reliability vector, when that vector is nonzero.Source: §B.1 · pp. 12–13
B.2. Reliability estimation via eigenvector analysis
The appendix argues that Bayes-weighted voting has a strictly better error exponent than majority voting when VLM reliabilities differ. It describes estimating method skill from agreement structure and bounding Bayes-decision errors using Hoeffding's inequality.
B.2. Reliability estimation via eigenvector analysis
- The expected centered agreement matrix is proportional to the rank-one outer product of the skill vector, so its dominant eigenvector enables recovery of method reliabilities; the estimation error decreases as more SVG primitives are processed.The passage associates the error bound with the Davis-Kahan theorem.Source: §B.2 · p. 13, §B.3.1 · p. 13
B.3. Bayes decision rule and error bounds vs. Majority voting
- Bayes-weighted voting achieves a strictly better error exponent than majority voting whenever VLM reliabilities differ.The appendix states this result in Corollary B.5.Source: §B.3 · p. 13
B.3.1. Setup and the log-likelihood ratio
- For each method, the log-likelihood-ratio contribution is bounded, has conditional expectation equal to its Bayes weight times its discrimination parameter, and is independent across methods under the Dawid-Skene assumption.The setup defines the discrimination parameter from correct-label and specific-wrong-label probabilities.Source: §B.3.1 · p. 13
B.3.2. Error bound for Bayes decision rule
- Hoeffding's inequality supplies an error bound for the Bayes decision rule using bounded independent log-likelihood-ratio contributions; the bound's exponent indicates how quickly error probability decays.Larger exponents correspond to exponentially smaller error rates.Source: §B.3.2 · p. 14
B.3.3. Comparison with majority voting and proof of superiority
The section compares Bayes weighting with uniform-weight majority voting and shows that exploiting heterogeneous method reliabilities improves the error exponent, while equal reliabilities make the approaches equivalent.
B.3.3. Comparison with majority voting and proof of superiority
- Majority voting assigns uniform weights, whereas the small-error approximation for Bayes weighting makes weights proportional to method reliability.The approximation is derived from the reliability and distance terms in the theorem.Source: §B.3.3 · pp. 14–15
- In the small-error regime, Bayes weighting is strictly better than majority voting when method reliabilities differ.The approaches are equivalent when all reliabilities are equal.Source: §B.3.3 · p. 14
- The improvement factor grows with the diversity of method reliabilities; identical reliabilities yield no advantage over majority voting.The factor is expressed in terms of the variance and mean of d.Source: §B.3.3 · p. 15
C. GPT-Human Alignment on Video-Text Alignment
GPT-T2V preferences align with human pairwise judgments more often than CLIP-T2V preferences do. The paper also reports that LLM evaluators can reason about simple animation motion when given clear criteria.
C. GPT-Human Alignment on Video-Text Alignment
- 83.4% GPT-T2V agreement with user preferences exceeds 53.4% CLIP-T2V agreement in pairwise comparisons.The authors present this alignment as evidence that GPT-T2V is a more reliable proxy for human evaluation in this setting.Source: C. GPT-Human Alignment on Video-Text… · p. 16
- State-of-the-art LLMs show robust ability to interpret simple animations and reason about their motion when evaluation criteria are clear.Figure 9 provides an example of the evaluation criteria.Source: C. GPT-Human Alignment on Video-Text… · p. 16, Figure 9 · p. 16
- The authors distinguish LLM evaluation from animation generation, describing evaluation as more straightforward because it requires consistency and comparison rather than creative synthesis.Source: C. GPT-Human Alignment on Video-Text… · p. 16
D. Dataset Composition and Coverage
The test set covers diverse animation instructions and SVGs; the pipeline separates semantic planning from per-class code generation and restructures labeled primitives while preserving their appearance and paint order.
D. Dataset Composition and Coverage
- The test dataset contains 114 hand-crafted instructions across 57 SVG files, averaging two animation scenarios per file.Source: D. Dataset Composition and Coverage · p. 17
- Nature/Environment (31.6%) and Objects/Miscellaneous (26.3%) are the largest subject categories in the test dataset.Source: D. Dataset Composition and Coverage · p. 17, Table 2 · p. 17
- Appearance/Reveal (28.1%) and State Transition (13.2%) are prominent interaction patterns, alongside Organic/Natural Movement (12.3%) and Rotational Movement (8.8%).Source: D. Dataset Composition and Coverage · p. 17, Table 3 · p. 17
E. VLM Prompts for Planning and Animation Generation
- The generator uses typed CSS-property lanes and a composer rule to keep motions from overwriting one another across iterative generations.CSS is generated incrementally by semantic class to manage long outputs.Source: E. VLM Prompts for Planning and… · p. 18, Figure 11 · p. 19
- The planning prompt focuses on semantic intent and human-interpretable motion descriptions, while per-class generation translates each plan into CSS.The planner is instructed to reason visually and symbolically rather than understand SVG syntax.Source: E. VLM Prompts for Planning and… · p. 18, Figure 10 · p. 18
F. Restructuring SVG Files with Semantic Labels
- The restructuring algorithm flattens primitives, preserves paint order, and merges same-label parts only when intervening differently labeled elements do not overlap.Resulting groups receive bounds, geometric centers, and parent-child metadata for animation.Source: F. Restructuring SVG Files with… · p. 20