[UPDATE] LottiePlayer Pro 2.0 - Audio Sync, Fit Modes (Cover) & Mobile Support

Showcase Plugins
1

Hello Bubblers! :waving_hand:

I just released a major update (v2.0) for the LottiePlayer Pro plugin. The goal was to solve the most common frustrations with Lottie animations in Bubble: responsiveness, audio synchronization, and mobile compatibility.

Here is what’s new:

1. True Responsive Control (Fit Modes) :framed_picture: Finally, you can control how the animation fits the container.

  • Cover: Perfect for full-screen backgrounds (crops edges to fill).

  • Contain: Keeps the whole animation visible.

  • Stretch: Forces dimensions.

  • Bonus: Added a Resize Listener to prevent SVG glitches when resizing the browser.

2. Audio Engine Overhaul :musical_note: This is a game-changer if you use sound effects with your animations.

  • Speed Sync: If you set the animation speed to 2x or 0.5x, the audio automatically adjusts pitch and speed to match.

  • iOS Support: Includes a smart “Audio Unlocker” to ensure sounds actually play on iPhones/Safari (bypassing the strict autoplay policies).

  • Perfect Sync: Pausing/Stopping the animation instantly controls the audio.

3. Granular Control :control_knobs:

  • Go To Frame: Create interactive animations (e.g., “On click, jump to frame 50”).

  • Instant Segments: The Play Segment action now forces immediate playback, eliminating “lag” or queuing issues.

  • New Data: Access Duration (in seconds) and Total Frames directly in Bubble to build custom progress bars.

Why update? If you are building a high-end UI or a game-like experience, this update ensures your animations look good on any screen and sound perfect on any device.

Check it HERE!

You can also check the Free Version HERE!

Also i updated the price of the plugin.

Happy building! :rocket:

2

Hey Bubblers! :waving_hand:

We all love Lottie animations, but adding too many standard .json Lotties to a Bubble page can quickly hurt your app’s performance and cause DOM lag on mobile devices.

Today, I’m thrilled to announce V3 of the Lottie Motion Player Pro! We completely rebuilt the core engine to give you stunning animations without the performance tax.

What’s New in V3? :fire:

:package: Native .dotLottie Support The new animation standard is here! You can now paste .lottie links directly into the plugin. They are up to 80% lighter than traditional JSONs, loading instantly and drastically improving your Lighthouse speed scores.

:high_voltage: Dual Engine: SVG vs Canvas Renderer You now control how the browser draws the animation. Keep it on SVG for crisp UI icons, or switch the new dropdown to Canvas for heavy animations (like confetti, complex particles, or shadows). Canvas draws the entire animation in a single HTML tag, saving your users’ CPU and eliminating scrolling lag!

:hammer_and_wrench: Fully Rewritten Core

All your favorite Pro features from V1—like the Sound Sync Engine, Frame Triggers, Play on Hover, and Segment Playback—have been fully adapted to run flawlessly on this new, high-speed architecture.

If your app uses Lotties and you care about performance, this is the upgrade you’ve been waiting for. Check it out and let me know what you think! Happy building! :rocket::sparkles:

3

Hey Bubblers! :waving_hand:

We all love using Lottie animations, but let’s be honest: dealing with colors is a nightmare. If you build SaaS platforms, white-label apps, or support Dark/Light modes, you know the pain of having to manually edit Lottie files externally just to change a blue checkmark to a red one. :weary_face:

Today, I’m thrilled to announce the V4 “Brand Chameleon” Update for the Lottie Motion Player (Pro)! :lizard::sparkles:

What does it do? You can now change the colors of your Lottie animations dynamically via Workflows! Just use the new Change Color Palette action, pass the original HEX color, and feed it the new HEX color (hardcoded or from your database). The plugin’s engine safely clones the JSON, injects your new brand color, and reloads the animation in milliseconds—without breaking or freezing.

Awesome Use Cases:

  • :office_building: True SaaS Branding: A user picks #664de6 as their brand color in your dashboard? All your Lottie loading spinners and success icons instantly adapt to that exact hex code!

  • :last_quarter_moon: Dark Mode Magic: Seamlessly switch a black icon (#000000) to white (#FFFFFF) using a single workflow when Dark Mode is toggled. No need to upload two separate JSON files ever again!

Stop fighting with external editors and make your animations truly dynamic. :rocket:

I’d love to hear how you plan to use this! Drop your thoughts below. :backhand_index_pointing_down:

4

Hello Bubble Builders! :waving_hand:

Today, I am thrilled to release Lottie Motion Player (Pro) V5.0: The Scroll & Interact Update! :tada:

We took all the interactivity logic, bypassed the standard Bubble workflow engine, and coded it directly into the native JavaScript engine running at 60fps.

Here are the massive UX upgrades you can start using today: :backhand_index_pointing_down:

:scroll: Native Scroll Sync Just check one box (Sync to Page Scroll), and your Lottie animation’s timeline is instantly locked to the user’s scrollbar. As they scroll down, the animation plays forward. As they scroll up, it reverses. It is flawlessly smooth.

:control_knobs: Cinematic Offsets You have total control. Set a Scroll Start Offset to 30%, and your animation will wait patiently frozen at frame 0 until it sits perfectly in the user’s view, creating that dramatic pause before the motion starts!

:computer_mouse: 0ms Hover Playback & Reverse Building interactive menus or icons? Turn on Play on Hover and the new Reverse on Mouse Out. The exact millisecond your cursor leaves the element, the Lottie flawlessly rewinds its timeline. No lag, no jumping, no workflows required.

This update pushes the boundaries of what front-end motion looks like in Bubble. If you want your app to feel premium, native, and incredibly responsive, V5 is your new best friend. :high_voltage:

Let me know what you guys think of this new interactive engine! I’ll be in the comments to see what amazing scroll-experiences you build! :backhand_index_pointing_down::fire: