Bodymovin - Lottie
-
Compatibility After Effects Please check exact version compatibility under the "COMPATIBILITY" tab below
Exports animations to json files and pngs (if necessary).
Animations can be played on the web via the bodymovin player or natively in iOS and Android through Lottie.
For playing the animations, get the player in the extension panel, and load it in a browser.
Supported Features
- Shapes
- paths, ellipses, stars, rectangles
- fills, stroke, gradient fills and gradient strokes
- dashes
- trim paths (partial)
- rounded corners
- transforms (position, anchor point, rotate, scale, opacity, skew, skew axis)
- Solids
- Images
- Comps
- Nulls
- Texts
- Most fonts are supported, they can be exported as shapes or as text provided you load the font on the browser
- A single text declination is supported per textbox.
- Not supported: text decorations like Small caps, or Vertical Scale.
- Cameras (partial)
- Expressions
- Expressions. Partially supported. More and more expressions are supported on each release.
- If you have any trouble with one, let us know.
- Expression sliders are supported.
General supported properties
- transform (rotate,scale,position,anchor point, opacity)
- time remap
- masks (additive, and in some cases difference, inverted and subtractive)
- luma and alpha masks (with the svg renderer)
Supported effects (with the svg/html renderer)
- fill
- pro levels
- drop shadow
- tint
- tritone
Audio support
Audio layers are supported starting from AE 2019 and above.
Check the wiki to see how to implement it
https://github.com/airbnb/lottie-web/wiki/Audio
New track matte masking support. On web only for now. ios and android are on their way
Exporting Tutorial
After Effects | 2024, 2023, 2022, 2021, 2020, CC 2019, CC 2018, CC 2017, CC 2015.3, CC 2015, CC 2014 |
---|
5.12.1 (Current version) - Jun 12, 2023
- FIX: Transform Effect opacity reset
- FEATURE: esm support
- FIX: Fix transform matrix precalc when adding effects
- IMPROVEMENT: canvas renderer signifcantly improved in performance
- IMPROVEMENT: improved text support for emojis
- IMPROVEMENT: text renderer performance improvement when rendering out of the work area
- FIX: canvas expressions render order
5.12.0 - May 30, 2023
- FEATURE: Transform Effect support
- FIX: play / pause behavior on worker
- IMPROVEMENT: move text rendering to render phase
- FEATURE: expose global object _lottieGlobal for expressions
5.11.0 - Apr 10, 2023
- FEATURE: slots support
- FIX: update data when updateDocumentData is called
- FIX: using unregistered renderer or missing path
- FIX: added destroy null check
- FEATURE: Implement setLoop in Web Worker
5.10.2 - Jan 23, 2023
- FEATURE: support for all matte masks in canvas
- FEATURE: support for alpha matte in canvas worker
- FEATURE: support for canvas renderer in Safari
- FEATURE: add DOM loaded event for canvas worker
- FIX: tint effect opacity
5.10.1 - Dec 30, 2022
5.10.0 - Nov 28, 2022
- FEATURE: Add support for new track masks by layer index
- FEATURE: Add support for zigzag (thanks @mbasaglia)
- FEATURE: Add support for offset path (thanks @mbasaglia)
- FEATURE: Customizable canvas renderer width and height
- FIX: Workaround for banner validation
5.9.6 - Jul 1, 2022
- FIX: Disambiguate bevelEmboss properties (thanks @mbasaglia)
- FEATURE: Add support for image export individual settings via annotations
5.9.5 - Jun 27, 2022
- FEATURE: support filter size on drop shadow property
- FIX: canvas worker - handle destroying animation instance before data is loaded
- FIX: canvas worker = pass own canvas fix
- FIX: bodymovin extension out of storage
- FEATURE: integration with canilottie
5.9.4 - May 2, 2022
- FIX: improve composable filters
- FIX: strokes with correct width on fonts
5.9.3 - Apr 24, 2022
- FEATURE: Adds support for changing volume based on the audio layer data
- FEATURE: add support for removeEventListener on worker
- FEATURE: add support for updateDocumentData on worker
- FEATURE: add text as font support on worker
- FIX: avoid crash when script does not have src
5.9.2 - Apr 8, 2022
- FIX: Fix ts typing for loadAnimation parameter
- FEATURE: allows to set width and height of svg from config
- FIX: Fix getMarkerData bug
- FEATURE: Add type for goToAndPlay & goToAndStop
- FIX: add time to list of code for preventing removal
- FIX: glyphs removed from DOM before reloading
5.9.1 - Mar 4, 2022
5.9.0 - Mar 3, 2022
- FIX: added methods used by expressions to an array to prevent treeshaking
- DEV: Migrated code to imports
- DEV: Use Rollup for build process
5.8.1 - Nov 9, 2021
5.8.0 - Nov 8, 2021
- FEATURE: added content-visibility prop support
- FEATURE: added header check for json type (improves initial parsing specially on large files)
- FEATURE: added lottie.useWebWorker method to support loading file on a separate web worker (different than the first feature)
- FEATURE: added frame rate to comp on export (not supported by payers yet)
- FIX: random seed expression fix
5.7.14 - Oct 11, 2021
- FEATURE: added support for animated text path properties
- FEATURE: added support for exporting source names as ids
- FEATURE: added clear cache button
- FIX: fixed importer with last keyframe
5.7.13 - Aug 12, 2021
- FEATURE: added support for metadata export on json files
5.7.12 - Jul 13, 2021
- FIX: callbacks list executing beyond index list
- FIX: missing TextExpressionSelectorPropFactor
- FEATURE: exporter improvements
5.7.11 - Jun 4, 2021
5.7.10 - Jun 4, 2021
5.7.9 - Jun 1, 2021
- FEATURE: security updates
- FIX: fix image sequencing preloading
- FEATURE: added support for gradient fill expressions
5.7.8 - Apr 4, 2021
- FEATURE: added FootageElement that supports json data layer types with expressions
5.7.7 - Mar 22, 2021
- FEATURE: added markers support
- FIX: repeaters with reduced copies
- FIX: unintentional stroke clipping on shapes with large stroke-width (thanks Manan Jadhav)
- FIX: ie11 append missing
- FIX: repeater calling trim twice
5.7.6 - Jan 17, 2021
- IMPROVEMENT: added linting rules
- FIX: seedrandom and main fix
- FIX: image export fix
5.7.5 - Dec 8, 2020
- FIX: lottie-light effects breaking on destroy
- FIX: loaded_images event fired in safari
- FIX: original asset names for audios
5.7.4 - Nov 2, 2020
- EXPRESSIONS: added support for toWorldVec, fromWorldVec and getValueAtTime for transforms
- EXPRESSIONS: fixed propertyGroup expression
- FIX: added svg effects placeholder
- FIX: added check for wrapper on destroy canvas
- EXPORTER: missing layer styles
- EXPORTER: export only work area
5.7.3 - Aug 23, 2020
5.7.2 - Aug 20, 2020
- FIX: make callback parameter of removeEventListener optional
- FEATURE: Audio Support
5.7.1 - Jul 20, 2020
- FIX: Expressions separate dimensions
- FIX: propertyGroup for expressions (Duik bones are supported)
- FEATURE: supported Pucked and Bloat
5.7.0 - Jun 28, 2020
- FEATURE: Extension: baking keyframes for unsupported expressions
- FEATURE: Extension: improved preview and added Skottie preview
5.6.10 - May 10, 2020
- FIX: removing sans-serif and monospace from font preloader to calculate correctly when font is loaded
- FIX: improved image caching when preloading svg image tags
- updated definitions
5.6.9 - Apr 12, 2020
- initialization improvement
5.6.8 - Apr 6, 2020
- added support for exporting video layers (only export, players don't support them)
- fix for path properties open without nodes
5.6.7 - Mar 29, 2020
- added default filter values for banner template
- added option to load local file as lottie player
- initialSegment set before animation configuration
5.6.6 - Mar 5, 2020
- fixed inlined json objects with carriage returns
- added loop support for banners
- exporting adjustment layers as null layers
- added checkbox to select comp names as default
- added filter size configuration and defaulting to 100%
- Add missing animation event name definitions
5.6.5 - Feb 24, 2020
- fix for zip file without root folder
- support for including json in banner html template
- Export 'blur' text animator property
5.6.4 - Feb 12, 2020
- Improved log error fix
- Fixed missing assets during export
5.6.3 - Jan 30, 2020
- Improved lottie import
5.6.2 - Jan 16, 2020
- Added hidden layers and hidden properties support for importer
- Improved error messaging
- Added assetsPath configuration for typescript
- fixed mangled lottie declaration
5.6.1 - Jan 9, 2020
- Support new export mode: Rive
- Support new export mode: Banner
- Improved existing export modes
- Improved image compression solution (now PNGs get well compressed as jpegs)
- Support for importing Lottie Animations!
- fixed build to prevent polluting global scope
- text animator multiplier fix
- fixes #1883 text offset
- fixes #1878 supports id attribute for container
5.5.10 - Nov 21, 2019
- Fix: subtract mask transformed fix
- Expressions: added posterize time support
- Fix: incorrect easing function calculation in TextSelectorProperty
- Fix: auto oriented properties with not keyframes
- New: Implement a new Canvas renderer that can run on worker threads
5.5.10 - Nov 21, 2019
- Fix: subtract mask transformed fix
- Expressions: added posterize time support
- Fix: incorrect easing function calculation in TextSelectorProperty
- Fix: auto oriented properties with not keyframes
- New: Implement a new Canvas renderer that can run on worker threads
5.5.9 - Sep 15, 2019
- Feature: added image sequence support
- FIX: clipping compositions in canvas renderer
- FIX: added precision to auto orient
5.5.8 - Sep 2, 2019
- FIX: Removed appending json at end of url
- FIX: Camera separate position properties
- Typing: Added animation event name to Lottie definitions
- Feature: Add focusable renderer setting for SVGs
- Feature: Added error handling for config and frame rendering
5.5.7 - Jul 20, 2019
- PERFORMANCE: big performance improvement on trim paths (and other modifiers) for paths that don't change over time
- NEW: improved support for astral plane characters (like emojis)
5.5.6 - Jul 5, 2019
- FIX: new expressions supported
5.5.5 - Jun 12, 2019
- FIX: fix for old json expressions in key function
5.5.4 - May 28, 2019
- FEATURE: support for new expressions
5.5.3 - May 19, 2019
- FEATURE: Add TypeScript type definitions (thanks D34THWINGS)
- FIX: removed warning of text when created by text formatted
- FIX: fixed merged characters in fonts
- FEATURE: added mutiple settings functionality to extension
- FEATURE: added support for mask opacity in expressions
- FIX: fixes #1552 html renderer wrong font measurement
- FIX: Fix masksProperties key name in JSON docs (thanks john-preston)
5.5.2 - Apr 21, 2019
- FIX: eroded masks in svg renderer
- FIX: text alognment in text boxes
5.5.1 - Apr 8, 2019
- IMPROVEMENT: forcing a rerender when resize is called in canvas
- ACCESSIBILITY: added title, description and aria label for text layers for svg renderer
- FIX: text align for box texts
5.5.0 - Mar 22, 2019
- FEATURE: Bodymovin panel with new advanced settings to reduce filesize.
- FIX: honor `forceFlag` when calling `playSegments` (thanks @mrmos)
- FIX: added source-over as default blending mode for canvas renderer resetting
- FIX: fixed bezier easing property validation
- FIX: fixed property caching by index instead of bezier data
- FIX: added thisProperty expression value
5.4.4 - Feb 14, 2019
- FIX: fixed enterFrame direction property
- FIX: explicitly iterating math methods
- FIX: added missing expression properties
- FIX: setting class attribute via setAttribute
- FIX: added value property in key method expression
- FIX: text animator expression fix
- FIX: added smooth expression support
- FIX: hcamera expression fix
- FIX: fix animated dash property canvas
- NEW: sourceRectAtTime for images fix
- NEW: Advanced option in Bodymovin extension to skip expression properties
- NEW: removed some unused json properties
5.4.3 - Jan 1, 2019
- NEW: removed random ids in favour of incremental ids
- NEW: added new players
- NEW: updated build process. Removed vulnerable dependencies.
- FIX: canvas repeater fix
- FIX: Replaced typekit with Adobe Fonts support
- FIX: subtracting offsetTime for valueAtTime calculation on shapes
- FIX: expressions targetting keys fix
- FIX: multidimensional easing using first dimension value when set to 0
5.4.2 - Nov 24, 2018
- FIX: font measuring fix for white spaces
- FIX: supporting Effects property on layers in expressions
- FIX: canvas sibling shapes with same style fix
- FIX: caching valueAtTime correctly
- FIX: AVD exporter fix on clip paths
- FIX: AVD exporter fix on initial and end values
- FIX: formatResponse if responseText
- NEW: renders class name for nested group elements
5.4.1 - Oct 26, 2018
- FIX: stroke effect fix with multiple children elements
- FIX: adding max and min values to trim path start and end
- EXPRESSIONS: added velocity property
- FIX(text): Fix charCode assignment and optimize FontManager (thanks @kwilliams-curago)
- FIX: fix for small trim paths
- EXPRESSIONS: added valueAtTime property to expression thisProperty variable
- FIX: added locationHref to gradient data
- EXPRESSIONS: big performance improvement for all expressions that use Expression Values heavily
5.4.0 - Oct 26, 2018
- FIX: stroke effect fix with multiple children elements
- FIX: adding max and min values to trim path start and end
- EXPRESSIONS: added velocity property
- FIX(text): Fix charCode assignment and optimize FontManager (thanks @kwilliams-curago)
- FIX: fix for small trim paths
- EXPRESSIONS: added valueAtTime property to expression thisProperty variable
- FIX: added locationHref to gradient data
- EXPRESSIONS: big performance improvement for all expressions that use Expression Values heavily
5.3.4 - Oct 9, 2018
- TEXT: End of Text character support
5.3.3 - Oct 2, 2018
- FIX: loading external assets before rendering the first frame of the animation on canvas renderer
- FIX: clearing caching spatial bezier data when previous frame is reached
- FIX: promoting text property to dynamic properties when using text update methods
- FIX: extra comps width and height properties supported
- FIX: multiple trims fixed
5.3.1 - Sep 18, 2018
- FIX: animated gradient in svgs
5.3.0 - Sep 17, 2018
- EXPRESSIONS: preprocessing expressions allows to prevent getting values if not needed on expressions
- EXPRESSIONS: support for position, scale and anchorPoint variables
- EXPRESSIONS: added numLayer property support to comp interfaces
- REPEATERS: support for start and end opacity
- FIX: Rendering effects before masks fixes some small render cases
- FIX: added orientation support for 3d cameras
- FIX: dashed lines were not resetted in some scenarios
5.2.1 - Aug 8, 2018
- EXPRESSIONS: Latest Duik version support
5.2.0 - Jul 27, 2018
- EXPRESSIONS: layer name support for expressions
- FIX: reverse play on non loops
- SUPPORT: Orient along path with separate dimensions
- FIX: trim cache issue fixed
5.1.20 - Jul 4, 2018
- FIX: text value on expressions fix
- FEATURE: new expressions supported
- FIX: Demo and Standalone export fix
5.1.19 - Jul 3, 2018
- FIX: linear method fix for inverted values
- FEATURE: Ignoring merge path's last path if square
- FIX: Camera zoom
- FIX: Validating if text data is complete on first render
- FIX: Loop counting when playing backwards
- FEATURE: Added inPoint and outPoint to layer's expressions
5.1.18 - Jun 21, 2018
- FEATURE: Added crossOrigin attribute to images to avoid tainted canvases
- FEATURE: Added imagePreserveAspectRatio to rendererSettings for image layers
- FIX: splitting animations in multiple files
5.1.17 - Jun 14, 2018
- FEATURE: Rove across time support
- FIX: bevel line support
5.1.16 - May 28, 2018
- FEATURE: if needed can skip images export once exported a first time.
5.1.15 - May 20, 2018
- FEATURE: Added getRegisterdAnimations method to get all current animations handled by lottie
- FEATURE: Exporting PNGs with render queue in order to fix black pixels around images
- FEATURE: Support for compressed jpgs when image is not transparent
- FEATURE: Support for exporting base 64 encoded images inlined in the json file
- FIX: Some small expression fixes
5.1.14 - May 16, 2018
- FIX: Canvas renderer skips hidden layers
- FIX: When clearCanvas is set to true on the canvas renderer, every frame is rendered
- FIX: calculation error on masks
5.1.13 - Apr 24, 2018
- EXPRESSIONS: operations supported for arrays
5.1.12 - Apr 23, 2018
- EXPRESSIONS: speedAtTime support
- FIX: trimmed paths fix
- FIX: destroy method fix
- SSR: checking for navigator to create library
5.1.11 - Apr 19, 2018
- PERFORMANCE: significant improvement on the svg and canvas renderers
- FIX: floating points fix
5.1.10 - Apr 5, 2018
- TEXT LAYERS: font measuring and some text fixes
- FIX: 2d and 3d layers stack fix
- FEATURE: added support for assetsPath when using animationData (@kwilliams-curago)
- FEATURE: added getDuration method. In frames and in seconds.
- FIX: fixed breaking change from AE 15.1 with text layers
5.1.9 - Mar 21, 2018
- EXPRESSIONS: adding name property to shape property group
- FIX: adding timeout before checking loaded fonts
- IMPROVEMENT: html elements now hide their base container when off render time bounds
- FIX: undeclared variable in reverse method
- FIX: text font issues
5.1.8 - Mar 5, 2018
- FIX: centered tracking
- FIX: augmenting linearity threshold
- FIX: using quaternions to calculate 3d orientation
- FIX: undeclared variables
- FIX: CW CCW ellipse fix
- EXPRESSIONS: added xRotation and yRotation support
- FEATURE: added skew to transform calculations
- FIX: Time remap on html renderer
- FEATURE: calculating shape bounds for html shape elements without depending on getBBox
- FEATURE: Supporting custom tags on html renderer
- FIX: dash array fix
## V 5.1.7
- FIX: looping and non looping animations end frame fix
5.1.6 - Feb 1, 2018
- FIX: HTMLRenderer image fix
- FIX: HTMLRenderer masked comp fix
- FIX: Text fWeight precedence over fStyle
5.1.5 - Jan 26, 2018
- FIX: text selector fix
- FIX: text expression fix
- FEATURE: more expressions supported
5.1.4 - Jan 18, 2018
- FIX: hidden parented layer with mask
- FIX: gradient property animated
- FIX: hindi combined characters support with text as font
5.1.3 - Jan 9, 2018
- FIX: Color interpolation fix
- FIX: id and classes fix for images and solids
- FIX: canvas nested groups transform fix
- FIX: lottie_light.js fix
- FIX: Expressions switch statements adding variable declaration when missing
5.1.1 - Jan 2, 2018
- Text Layer keyframed fix
5.1.1 - Jan 2, 2018
- Text Layer keyframed fix
5.0.6 - Dec 20, 2017
- FIX: canvas destroy method
- FIX: expressions rect size support
- FIX: multiple requestAnimationFrame fix
- FIX: variable not being declared
- FEATURE: support for custom viewBox
5.0.5 - Dec 11, 2017
- FIX: duplicate requestAnimationFrame call
- CHANGE: removed M0,0 added to every path. Should fix chrome issues.
- REFACTOR: small changes on AnimationItem
5.0.4 - Dec 4, 2017
- EXPRESSIONS: support for "anchor_point"
- PERFORMANCE: separated opacity from transform properties
- FIX: effects properties offset
- FIX: 3d orientation for negative values
5.0.3 - Nov 24, 2017
- FIX: destroy method wasn't releasing all memory if a single animation was loaded.
- FIX: IE masks fix when used as Alpha Masks with gradients.
- IE 10 fix
- loopIn and loopOut fix
5.0.1 - Nov 19, 2017
- text box fix
- performance improvements
- bodymovin web player renamed to lottie
- gradients performance improved
- cleaned up code
- new expressions
4.13.0 - Nov 5, 2017
- text update support with updateDocumentData (check wiki)
- tangentOnPath, normalOnPath and more expressions
- loaded_images event
- fixed global calls
- fixed ie9 error
4.12.2 - Oct 24, 2017
4.12.1 - Oct 24, 2017
4.12.0 - Oct 22, 2017
- createPath support
- points, inTangents, outTangents support
- expressions fixes
- className for container via loading config
- 3d orientation fix
- new line text fix
- expression fromComp support
- rounding to decimals shapes to prevent exponential values
4.10.2 - Aug 7, 2017
4.10.1 - Aug 2, 2017
- Ouroboros 2.0 support (in beta just in case)
- AVD Format export
4.9.0 - Jul 9, 2017
- Keyframes interpolation fix for stretched layers
- inBrowser method added
4.8.0 - Jun 29, 2017
5.6.0 - Jan 8, 2020
- Support new export mode: Banner
- Improved existing export modes
- Improved image compression solution (now PNGs get well compressed as jpegs)
- Support for importing Lottie Animations!
- fixed build to prevent polluting global scope
- text animator multiplier fix
- fixes #1883 text offset
- fixes #1878 supports id attribute for container
4.7.0 - Jun 7, 2017
- colinear points fix
- anchor point expression fix
- server side rendering window object validation
4.6.11 - Jun 4, 2017
- new expressions supported
- fonts fix
- AE language export fix
- nearestKey expression fix