PinePaper Lottie Compatibility Guide

Reference for what survives a Bodymovin (After Effects) ↔ PinePaper round-trip, and what doesn’t. Last verified against v0.5.0-beta.

TL;DR — round-trip score: 7/10

PinePaper’s Lottie import and export are designed for round-tripping simple-to-intermediate animations between After Effects (via Bodymovin) and PinePaper. Core animation data — shapes, transforms, keyframes, timing — round-trips reliably. Advanced features like masks, gradients, effects, and 3D motion paths are out of scope for v0.5 and are documented below as known limitations.

Quick reference

Feature class Round-trip Notes
Shape geometry (rect, ellipse, path, star, group) ✅ Solid All five shape types preserved
Layer transforms (position, scale, rotation, opacity) ✅ Solid XY only — 3D z is ignored
Keyframe animations (with cubic bezier easing) ✅ Solid Linear, ease in/out, custom bezier all preserved
Fill & stroke (static + animated) ✅ Solid Color, width, line caps
Trim paths (start, end, offset) ✅ Good Animated trim values preserved
Text layers (content, font, size, color) ✅ Good No text animators
Layer timing (in-point, out-point, frame rate) ✅ Solid Honored on both sides
Hold keyframes ⚠️ Behavioral round-trip Converted to two near-identical KFs internally; visual result identical, JSON shape differs
Anchor points ⚠️ Reset on export Imported correctly; exported as [0, 0, 0]. Position is correct, but rotation center shifts.
Null layers / precomp parenting ⚠️ Flattens Imported as invisible anchors; not re-emitted on export — children become independent
Animated stroke color on text ⚠️ Imported, not exported
Gradients (fill and stroke) ❌ Falls back to solid Parser exists in LottieColorUtils.js but currently unused; gradients import as solid black
Masks (alpha / subtract / track matte) ❌ Not supported Drop on import
Effects (blur, glow, color correction, etc.) ❌ Not supported Drop on import
Repeater shapes ❌ Not supported Drop on import
Merge paths, Round corners, Offset path ❌ Not supported Drop on import
Skew transforms ❌ Not supported Use rotation instead
3D layers (ddd: 1) ❌ Treated as 2D z-axis ignored
Spatial bezier (3D motion paths) ❌ Converted to scalar easing 2D paths only
Image layers ❌ Skipped on import
Text animators (per-character animation) ❌ Not supported

Migration notes

If you have a Bodymovin file that uses unsupported features and you want it to round-trip cleanly through PinePaper:

  1. In After Effects, before exporting:

    • Bake or remove gradients (replace with solid colors)
    • Remove masks and effects
    • Convert text animators to keyframe animation on the whole text layer
    • Flatten any 3D layers to 2D
    • Replace skew with rotation if you need rotation-like distortion
  2. After importing into PinePaper:

    • Manually recreate the dropped features using PinePaper’s native systems:
      • Gradients → use the FilterSystem’s gradient fill
      • Masks → use the MaskingSystem (14 mask presets)
      • Effects → use the EffectSystem or FilterSystem
      • 3D motion → use the camera_animates relation
  3. Re-export will omit unsupported features. A scene that uses PinePaper-only features (rigging, knowledge graph relations, math generators) will lose those features when exported to Lottie. Lottie is the lossy bridge to AE — use it when you need AE-compatible output, not as PinePaper’s primary export format.

What works exceptionally well

These are the strengths of the current implementation — features users can rely on without surprises:

Shape preservation

All five Lottie shape types (rectangle, ellipse, path, star, group) survive a full round-trip with bezier handles intact. Path morphing animations (shapeKey keyframes) preserve segment positions to within ±0.5 vertex precision.

Easing curves

Custom cubic bezier easing curves are preserved on both sides via the [x1, y1, x2, y2] array format. Named easings (linear, easeIn, easeOut, easeInOut) are emitted as their canonical bezier curves and re-imported correctly. Elastic and bounce easings are emulated as bezier approximations and survive the round-trip.

Group hierarchy

Nested groups (group A contains group B contains path) round-trip with transform inheritance — child items inherit their parent group’s scale and rotation correctly.

Layer timing

ip (in-point), op (out-point), and fr (frame rate) are honored on both sides. A layer that appears at 1.5s and disappears at 4.0s in After Effects will appear and disappear at the same times in PinePaper, and re-export to Lottie will set ip and op correctly.

Color animation

Animated fill colors interpolate correctly between keyframes on import and export. The interpolation algorithm matches Lottie’s expected behavior.

Suggested verification when you import a Lottie file

  1. Open the imported scene in PinePaper
  2. Press K to play the timeline — does the animation match what you saw in After Effects?
  3. Check the shapes — are all the shapes from your AE composition present?
  4. Check the colors — are fill colors correct?
  5. Re-export to Lottie via app.exportLottie()
  6. Open the re-exported file in lottiefiles.com viewer — does it still play correctly?

If any of those steps fail, the cause is most likely one of the unsupported features above. Check the browser console for warnings — the importer logs when it encounters unsupported features.

Known limitations vs. roadmap

The known limitations above are deliberate v0.5 scope constraints, not bugs. Several may be addressed in v0.6 or later if there’s user demand:

Likely to be addressed in v0.6:

  • Hold keyframe export as h: 1 (currently round-trips correctly via duplicate KFs, but JSON is verbose)
  • Anchor point preservation on export (currently resets to [0, 0, 0])
  • Null layer / precomp parenting on export

Not on the roadmap:

  • Effects (blur, glow, etc.) — PinePaper has its own EffectSystem with different conventions; no plan to translate
  • Track mattes — PinePaper’s MaskingSystem is not Lottie-equivalent
  • Text animators — fundamentally different model from PinePaper’s letter collage
  • 3D layers — out of scope (see decision_ecosystem_positioning.md)

If you hit a limitation that’s blocking real work, file feedback and we’ll prioritize accordingly.

File reference for developers

For contributors who want to extend the Lottie module:

File Purpose Lines
js/lottie/LottieImporter.js Lottie JSON → PinePaper scene 652
js/lottie/LottieExporter.js PinePaper scene → Lottie JSON 847
js/lottie/LottieKeyframes.js Keyframe time/value/easing extraction 310
js/lottie/LottieShapeParser.js Shape parsing (rect, ellipse, path, star, etc.) 529
js/lottie/LottieColorUtils.js Color conversion (RGB[0-1] ↔ CSS); gradient parsing exists but unused 163
js/lottie/LottieTokenizer.js Round-trip Lottie ↔ compact tokens for LLM training 491

Last updated

2026-04-09 — round-trip audit pass for v0.5.0-beta release. Verified against:

  • Bodymovin 5.10.x output samples
  • PinePaper LottieExporter v0.5