Unity Animation Porting Guide for Balancy¶

A complete reference of which Unity animations and particle effects can be ported to Balancy's web-based UI system, and how they translate.

Target Unity version: 2021.3.45f2 LTS Balancy animation engines: Anime.js (keyframe animations), Lottie via lottie-web (particle systems)

Table of Contents¶

Overview
Keyframe Animations (Unity AnimationClip)
Supported Properties
Curve & Easing Support
Wrap Modes
Animation Events
Canvas Scaler Modes
Multi-Element Animations
Unsupported AnimationClip Features
Particle Systems (Unity ParticleSystem)
How It Works
Supported Modules
Emission Shapes
MinMaxCurve & MinMaxGradient
Texture Sheet Animation
Looping & Prewarm
Bake Options
Unsupported Modules
Unsupported Sub-Features
Performance Considerations
CSS Animations (Non-Unity)
Feature Comparison Matrix
Practical Tips
Glossary

Overview¶

Balancy supports two distinct animation pipelines for its web-based UI:

Pipeline	Source Format	Playback Engine	Use Case
Keyframe Animations	Unity `.anim` files	Anime.js	UI transitions, button animations, panel slides, fades, scale pulses
Particle Systems	Unity `.prefab`/`.unity` files	Lottie (via lottie-web)	Sparkles, confetti, glow effects, ambient particles, reward bursts

Both pipelines accept Unity source files directly. Balancy converts them automatically: - .anim files are converted to .banim (Balancy Animation JSON) on upload - Particle systems are parsed from prefab/scene YAML, simulated in-browser, and baked to Lottie JSON

No manual conversion is needed. You design in Unity, upload to Balancy, and it plays in the web UI.

Keyframe Animations (Unity AnimationClip)¶

How It Works¶

You create an animation in Unity's Animation window (producing a .anim file)
Upload the .anim file to Balancy as a Data Object
Balancy parses the Unity YAML, extracts all keyframes, converts tangent curves to cubic bezier easing, and produces a .banim JSON file
At runtime, Anime.js plays the animation on the corresponding HTML elements in the UI Builder view

Supported AnimationClip Properties¶

These Unity component properties are recognized and converted:

Unity Property	Unity Component	Balancy CSS Property	Notes
`m_AnchoredPosition.x`	RectTransform	`translateX`	Scaled by Canvas Scaler. Y-axis is flipped (Unity Y-up to CSS Y-down).
`m_AnchoredPosition.y`	RectTransform	`translateY`	See above.
`m_LocalScale.x`	Transform	`scaleX`	Uniform scale factor (1.0 = 100%)
`m_LocalScale.y`	Transform	`scaleY`	Uniform scale factor (1.0 = 100%)
`m_LocalEulerAngles.z`	Transform	`rotate`	Z-axis rotation in degrees. Negated for CSS coordinate system.
`m_SizeDelta.x`	RectTransform	`width`	Scaled by Canvas Scaler. Element is extracted to `position: absolute` for layout safety.
`m_SizeDelta.y`	RectTransform	`height`	See above.
`m_Color.r/g/b/a`	Image / SpriteRenderer	`colorR/G/B/A`	Composited to `rgba()` background-color at runtime. Alpha channel controls image opacity.
`m_fontColor.r/g/b/a`	Text / TextMeshPro	`textColorR/G/B/A`	Composited to `rgba()` text color at runtime.
`m_Alpha`	CanvasGroup	`opacity`	0-1 range, maps directly to CSS opacity. Applies to whichever element the animation path targets (not limited to the root).
`m_IsActive`	GameObject	`active`	Binary toggle: 0 = `display: none`, 1 = restore original display. Uses step easing.

All three Unity curve storage formats are supported: - m_PositionCurves (Vector3 curves for position) - m_ScaleCurves (Vector3 curves for scale) - m_EulerCurves (Vector3 curves for rotation) - m_FloatCurves (individual float curves for all properties above)

When both Vector3 curves and Float curves exist for the same property on the same path, Vector3 curves take priority.

Curve & Easing Support¶

Unity stores animation curves as Hermite splines with per-keyframe tangent data (inSlope, outSlope, inWeight, outWeight, weightedMode). Balancy converts these to CSS cubic-bezier easing functions:

Unity Curve Type	Balancy Handling
Linear (slope matches value change)	No easing applied (linear is the default)
Smooth / Auto tangent	Converted to `cubicBezier(x1, y1, x2, y2)`
Weighted tangents (`weightedMode` 1, 2, or 3)	Weights are used directly as bezier control point X coordinates
Non-weighted tangents	Default weight of 1/3 is used (standard Unity behavior)
Constant / Step (`Infinity` slope)	Converted to `steps(1)` — instant jump
Wobble segments (start and end values are equal, but slopes create an arc)	Baked to 60fps point-sampled keyframes to preserve the curve shape

What this means in practice: Your animation curves in Unity will look virtually identical in Balancy. Smooth ease-in/ease-out, sharp snaps, bouncy overshoots from custom tangents — all of it carries over faithfully.

Wrap Modes¶

Unity Wrap Mode	Balancy Equivalent	Behavior
Once (`m_WrapMode: 1`)	`wrapMode: "once"`	Plays once and stops
Loop (`m_WrapMode: 2`)	`wrapMode: "loop"`	Repeats indefinitely
PingPong (`m_WrapMode: 4`)	`wrapMode: "pingPong"`	Plays forward, then backward, then repeats
Default (`m_WrapMode: 0`)	Auto-detected from `m_LoopTime`	If `m_LoopTime == 1` it loops, otherwise plays once

Animation Events¶

Unity Animation Events (m_Events in the .anim file) are fully supported:

Events are converted by name and timestamp
In Balancy, events are dispatched as named callbacks that your scripts can listen to
Events re-fire on every loop iteration (matching Unity behavior)
Event timestamps are in milliseconds in the .banim output

Canvas Scaler Modes¶

Balancy supports all three Unity Canvas Scaler modes. You set the Canvas Scaler mode when uploading the .anim file — Balancy provides a full UI matching Unity's Canvas Scaler inspector.

Mode	How Balancy Handles It	Status
Constant Pixel Size	`scaleFactor / devicePixelRatio` — position and size values are adjusted for screen density. All parameters (Scale Factor, Reference Pixels Per Unit) are supported.	Fully working
Scale With Screen Size	Logarithmic blend between width and height ratios using the `match` parameter, matching Unity's exact algorithm. All parameters (Reference Resolution, Screen Match Mode slider, Reference Pixels Per Unit) are supported.	Fully working
Constant Physical Size	Currently simplified — uses `1 / devicePixelRatio` regardless of the Physical Unit, Fallback Screen DPI, or Default Sprite DPI settings. The UI exposes these fields but they do not affect the scale calculation.	Simplified

The reference resolution in your Canvas Scaler is preserved in the .banim file. At runtime, all position and size values (translateX, translateY, width, height) are scaled to match the actual viewport, just as they would be in Unity.

Recommendation: Use Scale With Screen Size mode for the most accurate results. This is the most commonly used mode in mobile games and is fully implemented with an exact algorithm match.

Multi-Element Animations¶

A single .anim file can animate multiple GameObjects (e.g., a panel, its child buttons, text labels, and images). This is fully supported:

Unity stores the path to each animated object (e.g., "Panel/Button/Icon")
In Balancy, each unique path becomes a separate animation track in the .banim file
In the UI Builder, you map each track to the corresponding HTML element
All tracks play in sync on the same timeline

This lets you upload complex multi-element animations (e.g., a reward popup where the background fades in, coins fly up, and text scales in) as a single .anim file.

Unsupported AnimationClip Features¶

Feature	Why	Workaround
Animator Controller / State Machine	Web playback is clip-based, not state-driven	Trigger individual clips from scripts
Blend Trees	No skeletal/weight blending in web	Use separate clips for each state
AnimationClip on 3D objects	Balancy UI is 2D HTML elements	Only RectTransform/UI properties are meaningful
Sprite animations (swapping sprite frames)	Not a curve-based property	Use Texture Sheet Animation in particle systems, or swap images via scripts
Material property animations (shader params, UV offset)	No material/shader system in web	Use color/opacity animations instead
IK / Constraints	Skeletal features, not applicable to UI	N/A
Timeline (Playable Director)	Different system from AnimationClip	Export individual clips instead
m_LocalPosition (non-anchored)	Only RectTransform anchored position is used	Use `m_AnchoredPosition` in your animations
m_LocalScale.z	2D rendering only	Z-scale is ignored
m_LocalEulerAngles.x/y	2D rendering, only Z-rotation supported	Stick to Z-axis rotation
Particle system properties in FloatCurves	These are skipped (particles have their own pipeline)	Use the Particle System pipeline instead

Particle Systems (Unity ParticleSystem)¶

How Particle Porting Works¶

Unlike keyframe animations (which map directly to CSS transforms), particle systems cannot play live in a web browser — there's no GPU particle engine. Instead, Balancy uses a bake-to-Lottie approach:

Parse: Upload your Unity prefab (.prefab) or scene (.unity) file. Balancy extracts all ParticleSystem components from all GameObjects in the file. If the file contains multiple particle systems, each one is detected and available for baking. Note: for .unity scene files, only the first Canvas GameObject is imported as the UI root.
Simulate: A JavaScript particle simulator runs the exact same physics (gravity, velocity, forces, noise, etc.) in the browser, producing per-particle position/scale/rotation/color traces.
Bake: The traces are converted to a Lottie JSON animation where each particle is an image layer with animated transforms.
Optimize: A curve-fitting algorithm (fit-curve) reduces per-frame keyframes to smooth bezier segments, achieving 10-20x file size reduction (e.g., 1.7 MB raw to 60-100 KB).
Play: lottie-web plays the baked Lottie at runtime using canvas (fast) or SVG (when color effects are needed).

The result looks identical to Unity for supported features — the simulation uses the same physics constants, the same gravity value (-9.81), and the same math for all supported modules.

Supported Particle System Modules¶

Main Module (InitialModule)¶

Parameter	Supported	Notes
`Duration`	Yes	Sets the emitter cycle length
`Looping`	Yes	Looping systems are auto-prewarmed for seamless Lottie playback
`Prewarm`	Yes	Always enabled for looping systems (particles exist from frame 0)
`Start Delay`	No	Emitter starts immediately in baked output
`Start Lifetime`	Yes	Constant, Random Between Two Constants, Curve, Random Between Two Curves
`Start Speed`	Yes	All MinMaxCurve modes
`Start Size` (uniform)	Yes	All MinMaxCurve modes
`Start Size` (3D / per-axis)	No	Only uniform size is supported. Non-uniform `startSizeY` with `size3D` is ignored.
`Start Rotation` (Z-axis)	Yes	All MinMaxCurve modes. Converted from radians to degrees.
`Start Rotation` (3D / per-axis)	No	Only Z-axis rotation. X/Y rotation with `rotation3D` is ignored.
`Randomize Rotation Direction`	No	All particles rotate in the same direction. Workaround: use Rotation over Lifetime with a TwoConstants curve.
`Start Color`	Yes	Solid color, Gradient, Random Between Two Colors, Random Between Two Gradients, Random Color
`Gravity Modifier`	Yes	All MinMaxCurve modes. Uses standard gravity constant (-9.81 m/s^2).
`Simulation Speed`	Yes	Multiplied into the time step
`Scaling Mode`	Yes	Hierarchy (0), Local (1), and Shape (2) all supported. Hierarchy is treated as Local.
`Max Particles`	Yes	Particle count is capped
`Play On Awake`	Yes	Stored in Lottie `autoplay` field

Emission Module¶

Parameter	Supported	Notes
`Rate over Time`	Yes	All MinMaxCurve modes
`Rate over Distance`	No	Distance-based emission requires a moving emitter (not applicable to baked output)
`Bursts`	Yes	`time`, `count`, `cycles`, `repeatInterval`, `probability` — all supported

Shape Module¶

Shape	Supported	Notes
Cone	Yes	Including angle, radius, and base circle distribution
Sphere	Yes	Full 360-degree distribution with radius thickness
Hemisphere	Yes	Upper hemisphere only
Circle	Yes	With arc angle and radius thickness (ring vs filled)
Box	Yes	Uniform random distribution
Rectangle	Yes	Same as box for 2D
Edge (Single-Sided Edge)	Yes	Linear spawn along radius * 2
Donut	Yes	Treated as circle
Mesh / Mesh Renderer / Skinned Mesh	No	Requires 3D geometry data — falls back to point emission at origin
Sprite / Sprite Renderer	No	Falls back to point emission at origin

Shape transform is fully supported: - Position offset (m_Position) — shifts spawn region - Rotation (m_Rotation.z) — rotates spawn region and initial velocity direction (2D rotation only) - Scale (m_Scale) — stretches spawn region

Radius Thickness controls whether particles spawn on the surface (0) or throughout the volume (1), matching Unity behavior.

Color over Lifetime¶

Parameter	Supported	Notes
`Enabled`	Yes
`Color gradient`	Yes	Multi-stop gradient with separate color and alpha keys
All MinMaxGradient modes	Yes	Color, Gradient, Two Colors, Two Gradients, Random Color

Rendering note: Balancy automatically selects the optimal renderer based on what the particles need: - Canvas renderer (fast, default) — used when all particle RGB values are white (1, 1, 1) across all frames. This includes particles with a white Start Color that only have alpha changes via Color over Lifetime, or particles with a constant white color. - SVG renderer (slower, supports color tinting) — used when any particle has non-white RGB values in any frame. This is needed because the canvas renderer cannot apply color tint effects. Examples: a red Start Color, or a Color over Lifetime gradient that changes RGB values.

In short: if every particle stays white (RGB) and only opacity varies, you get the faster canvas renderer. Any non-white RGB anywhere triggers SVG.

Size over Lifetime¶

Parameter	Supported	Notes
`Enabled`	Yes
`Size curve`	Yes	Multiplied with the particle's initial size. All MinMaxCurve modes.
`Separate Axes`	No	Only uniform scaling. X/Y/Z separate curves are not supported.

Velocity over Lifetime¶

Parameter	Supported	Notes
`Enabled`	Yes
`Linear X/Y/Z`	Yes	Applied as a constant velocity offset each frame (not acceleration). All MinMaxCurve modes.
`Orbital X/Y/Z`	No	Swirl/spiral effects are not simulated
`Radial`	No
`Speed Modifier`	No
`Space` (Local / World)	No	Always treated as local space

Rotation over Lifetime¶

Parameter	Supported	Notes
`Enabled`	Yes
`Angular Velocity`	Yes	In radians/second, converted to degrees for display. All MinMaxCurve modes.
`Separate Axes`	No	Z-axis only

Force over Lifetime¶

Parameter	Supported	Notes
`Enabled`	Yes
`X / Y`	Yes	Applied as acceleration (accumulated into velocity). All MinMaxCurve modes.
`Z`	No	2D rendering only
`Space`	No	Always local
`Randomize`	No

Noise Module¶

Parameter	Supported	Notes
`Enabled`	Yes
`Strength`	Yes	All MinMaxCurve modes
`Frequency`	Yes
`Scroll Speed`	Yes	Animates the noise field over time
`Octaves`	Yes	Multiple noise layers for more detail
`Damping`	Yes	Reduces strength with each octave
`Quality`	No	Always uses 2D Perlin noise
`Remap`	No
`Position Amount / Rotation Amount / Size Amount`	No	Noise always affects position only

Texture Sheet Animation (UVModule)¶

Parameter	Supported	Notes
`Enabled`	Yes
`Tiles X / Tiles Y`	Yes	Grid dimensions for the sprite atlas
`Animation Type`	Partial	`Whole Sheet` (0) supported. `Single Row` (1) parsed but not differentiated.
`Start Frame`	Yes	Normalized 0-1 value mapped to tile index. Random start frame supported.
`Frame over Time`	Parsed	Stored in config but currently only static frame assignment is used (particles pick one sprite variant at birth and keep it)
`Cycles`	Parsed	Not yet used in simulation

How it works: Your sprite atlas is automatically sliced into individual frame images. Each particle picks a random frame at birth based on Start Frame. This is perfect for particle variety (e.g., different snowflake shapes, varied confetti pieces).

Not yet supported: Animated sprite sequences where particles cycle through frames over their lifetime. Currently each particle displays a single fixed frame.

MinMaxCurve & MinMaxGradient Modes¶

All standard Unity MinMaxCurve modes are supported:

Mode	Description	Supported
Constant	Single fixed value	Yes
Curve	Value follows an animation curve over lifetime	Yes
Random Between Two Constants	Random value in [min, max] range per particle	Yes
Random Between Two Curves	Random value between min and max curves	Yes

All standard Unity MinMaxGradient modes are supported:

Mode	Description	Supported
Color	Single solid color	Yes
Gradient	Color gradient sampled over lifetime	Yes
Random Between Two Colors	Random color between two values	Yes
Random Between Two Gradients	Random between two gradients	Yes
Random Color	Random color from gradient at spawn	Yes

Looping & Prewarm¶

For looping particle systems, Balancy always performs prewarming regardless of the Prewarm setting in Unity. This ensures:

Particles are visible from the very first frame of the Lottie animation (no empty startup period)
The prewarm duration is max(emitter duration, max particle lifetime) to reach true steady state
Particles that cross the loop boundary are wrapped — their traces are split so the tail continues from frame 0, creating seamless loops

Burst trackers are reset at each loop boundary, so burst timing remains correct across loops.

Bake Options¶

When baking a particle system in the Balancy UI Builder, you can configure:

Option	Default	Effect
Duration	Emitter duration	Total animation length (can exceed emitter cycle for particles still alive)
FPS	30	Frame rate of the baked Lottie. Higher = smoother but larger file.
Particle Scale	1.0	Multiplier on particle sizes
Inner Scale	1.0	Controls how large particles appear within the Lottie composition. Internally maps to Pixels Per Unit (innerScale 1.0 = 100 PPU). Higher values make particles larger relative to the composition. Triggers re-simulation.
Outer Scale	1.0	CSS transform scale applied to the Lottie element after baking. Scales the entire composition (including the canvas) without re-simulation. Useful for fine-tuning the visual size in the UI.

Inner Scale vs Outer Scale: Inner Scale changes how the particle simulation maps to pixel coordinates and requires re-baking. Outer Scale is a post-processing CSS transform that takes effect immediately without re-simulation — use it for quick size adjustments.

Changing Duration, FPS, Particle Scale, or Inner Scale triggers a full re-simulation and re-bake. Changing Outer Scale only updates the CSS transform.

Unsupported Particle System Modules¶

These Unity ParticleSystem modules are not supported and are flagged as warnings during parsing:

Module	Why
Sub Emitters	Recursive particle spawning cannot be represented in Lottie (each sub-emitter would need its own layer set with dependent timing)
Collision	Physics collision detection requires runtime geometry — cannot be pre-baked
Trigger	Same as Collision — requires runtime collision volumes
Trails	Trail rendering has no Lottie equivalent (would need procedural geometry)
Lights	Dynamic lighting is not possible in 2D canvas/SVG rendering

Unsupported Particle Sub-Features¶

These sub-features within otherwise-supported modules are not yet implemented:

Feature	Module	Impact
`Start Size Y` + `size3D`	Main Module	No per-axis size (non-uniform particles)
`Start Rotation X/Y` + `rotation3D`	Main Module	No 3D rotation, Z-axis only
`Randomize Rotation Direction`	Main Module	Cannot flip rotation sign per-particle
`Orbital X/Y/Z` + `Radial` velocity	Velocity over Lifetime	No spiral/swirl effects
`Random Direction Amount`	Shape Module	No velocity spread randomization
`Spherical Direction Amount`	Shape Module	No spherical velocity perturbation
`Limit Velocity over Lifetime` (ClampVelocityModule)	Separate module	No drag/damping
`Size by Speed`	Separate module	Speed-dependent size variation
`Rotation by Speed`	Separate module	Speed-dependent rotation
`Color by Speed`	Separate module	Speed-dependent coloring
`Inherit Velocity`	Separate module	Moving emitter velocity inheritance
`Custom Data`	Separate module	No custom per-particle data
`Renderer > Render Mode: Mesh`	Renderer	3D mesh particles not supported
`Renderer > Material / Shader`	Renderer	Custom shaders not available
`Rate over Distance`	Emission	Distance-based emission needs a moving emitter

Particle System Performance¶

Since particles are baked to Lottie (one image layer per particle), performance depends on particle count:

Particle Count	File Size (optimized)	Performance
10-50	5-30 KB	Excellent on all devices
50-100	30-80 KB	Smooth 60fps on all devices (typical UI effects)
100-300	80-250 KB	Good on mid-range and above
300-1000	250 KB - 1 MB	Smooth on high-end only
1000+	1 MB+	May cause frame drops on low-end devices

Optimization is automatic: The fit-curve keyframe optimization runs on every bake, reducing raw per-frame data to smooth bezier curves. Typical compression: 10-20x (e.g., 1.7 MB raw to 60-100 KB optimized). Sprite dimensions are also handled automatically — Balancy reads the natural pixel size of your uploaded sprite and sets the Lottie asset dimensions to match.

CSS Animations (Non-Unity)¶

In addition to Unity-sourced animations, the Balancy UI Builder supports basic CSS animations that you can apply directly to any element:

Property	Options
Animation Name	`spin` (clockwise 360), `reverse-spin` (counter-clockwise 360)
Duration	0-100 seconds
Timing Function	`ease`, `ease-in`, `ease-out`, `ease-in-out`, `linear`, `step-start`, `step-end`
Iteration Count	Any number, or `infinite`

These are simple utility animations for common patterns like loading spinners. For anything more complex, use the Unity animation pipeline.

Feature Comparison Matrix¶

Keyframe Animations — Unity vs Balancy¶

Unity Feature	Balancy Support	Fidelity
Position animation (Anchored)	Full	Exact (with Canvas Scaler scaling)
Scale animation	Full	Exact
Rotation animation (Z-axis)	Full	Exact
Size animation (Width/Height)	Full	Exact (layout-safe extraction)
Color animation (Image)	Full	Exact (RGBA compositing)
Text color animation	Full	Exact
Opacity animation (CanvasGroup)	Full	Exact
Active toggle (GameObject)	Full	Exact (step easing)
Custom bezier curves	Full	High (Hermite-to-Bezier conversion)
Weighted tangents	Full	Exact
Animation events	Full	Exact (per-loop re-firing)
Multi-element orchestration	Full	Exact (path-based targeting)
Loop / PingPong / Once	Full	Exact
Canvas Scaler (Constant Pixel Size)	Full	Exact
Canvas Scaler (Scale With Screen Size)	Full	Exact algorithm match
Canvas Scaler (Constant Physical Size)	Partial	Simplified — DPI/physical unit params not yet used in scale calculation
Animator state machines	None	Use script-driven clip playback
Blend trees	None	Use separate clips
Material/shader animation	None	Use color/opacity instead
3D rotation (X/Y axes)	None	Z-axis only

Particle Systems — Unity vs Balancy¶

Unity Module	Balancy Support	Fidelity
Main Module (core params)	High	Physics match (same gravity, same dt integration)
Emission (rate + bursts)	Full	Exact timing and probability
Shape (Cone/Sphere/Circle/Box/Edge)	Full	Includes radius thickness, arc, position/rotation/scale
Color over Lifetime	Full	Multi-stop gradient, all MinMaxGradient modes
Size over Lifetime	Full	All MinMaxCurve modes
Velocity over Lifetime (linear)	Full	XYZ linear velocity offset
Rotation over Lifetime	Full	Z-axis angular velocity
Force over Lifetime	Full	XY acceleration
Noise	Full	Perlin noise with octaves, scrolling, damping
Texture Sheet Animation	Partial	Static frame assignment (no animated sequences)
Sub Emitters	None	Impossible in Lottie
Collision / Trigger	None	Requires runtime physics
Trails	None	No Lottie equivalent
Lights	None	No dynamic lighting
Velocity over Lifetime (orbital)	None	No spiral/swirl simulation
Limit Velocity (drag)	None	No velocity clamping

Practical Tips¶

Designing Animations for Balancy¶

Stick to supported properties. Animate position, scale, rotation (Z), size, color, opacity, and active state. These all port perfectly.
Use Canvas Scaler > Scale With Screen Size with your target reference resolution. Balancy reproduces the exact same scaling algorithm.
Keep particle counts reasonable. 50-100 particles is the sweet spot for UI effects — it looks great and performs well on all devices. Go above 300 only for high-end-only effects.
Avoid orbital velocity for particles if you need a swirl effect. Instead, use Force over Lifetime with changing X/Y values, or use Noise with a high strength for organic movement.
Prefer uniform particle size (don't enable 3D Start Size). Per-axis sizing is not supported.
Z-rotation only for both keyframe animations and particle rotation. X/Y rotation is ignored in both pipelines.
One .anim per interaction. Since state machines aren't supported, design each animation state as a standalone clip that can be triggered from script.

File Size Guidelines¶

Content	Typical Size	Notes
`.banim` (keyframe animation)	1-10 KB	Very lightweight, even complex multi-track animations
Lottie JSON (simple particles, 30 particles)	10-30 KB	After automatic optimization
Lottie JSON (moderate particles, 100 particles)	50-100 KB	After automatic optimization
Lottie JSON (complex particles, 500 particles)	200-500 KB	Consider reducing particle count

Glossary¶

Term	Definition
`.anim`	Unity's native animation clip file format (YAML-based)
`.banim`	Balancy Animation JSON — the converted format that Anime.js plays
Lottie	An open animation format (JSON) originally by Airbnb. Balancy uses it to play baked particle systems.
lottie-web	The JavaScript library (~82 KB gzipped) that renders Lottie animations in the browser using canvas or SVG
Anime.js	A lightweight JavaScript animation library (~17 KB gzipped) used for keyframe animation playback
Baking	The process of simulating a particle system and recording every particle's state at every frame into a static animation file
MinMaxCurve	Unity's data type for particle properties that can be constant, curve-based, or random between two values
MinMaxGradient	Unity's data type for color properties with similar modes (solid, gradient, random)
Canvas Scaler	Unity's UI scaling system that adapts UI elements to different screen sizes and densities
fit-curve	The curve-fitting algorithm used to compress per-frame particle data into smooth bezier curves in Lottie
Smart Keyframing	Balancy's optimization pass that reduces Lottie file size 10-20x by replacing per-frame samples with fitted bezier curves
Trace Wrapping	The technique of splitting particle traces at loop boundaries to create seamless looping Lottie animations
Inner Scale	Bake option controlling how simulation coordinates map to Lottie pixels. 1.0 = 100 Pixels Per Unit (matching Unity's default sprite import setting).
Outer Scale	Post-bake CSS transform scale applied to the Lottie element. Does not require re-simulation.