Lottie for Android, iOS, React Native, and Web
1–10 of 20 posts
Re: Lottie for Android, iOS, React Native, and Web
#2I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
Re: Lottie for Android, iOS, React Native, and Web
#3>Animated Vector Drawable (Android only). More performant because it runs on the RenderThread instead of the main thread. Supports only a subset of Lottie features. Progress can't be manually set. Doesn't support text or dynamic colors. Can't be loaded programatically or over the internet.
The real long term alternative on Android is that Bodymovin now has a plugin to directly export an animation to the VectorDrawable format. So you get the advantage of running on the RenderThread while still being able to work directly in AfterEffects.
Re: Lottie for Android, iOS, React Native, and Web
#4I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
For what it is worth, it is often used on mobile and works pretty well there, I guess it is the same on web.
The only downside I can think of :
- you really need to sit down with your animators and explain to them which effects they can use and which ones they need to avoid. Some manipulations will allocate a bitmap at each frame, it ends up very choppy
- some lottie json can take a while to read. In some cases we just handed up coding the animation by hand because it was not that complicated and better than to have to wait 1 or 2 seconds for it to load. It does not sounds that long, but it makes a big difference between immediately starting when your screen opens and starting with an empty screen then an animation blinks in.
Re: Lottie for Android, iOS, React Native, and Web
#5I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
For what it is worth, it is often used on mobile and works pretty well there, I guess it is the same on web. The only downside I can think of : - you really need to sit down with your animators and explain to them which effects they can use and which ones they need to avoid. Some manipulations will allocate a bitmap at each frame, it ends up very choppy - some lottie json can take a while to read. In some cases we ju…
Interesting... I wonder if this signifies a gap in the market for a good web animation authoring tool that complies its animations to JavaScript? Personally, I've yet to discover a good, flexible tool for this purpose.
Re: Lottie for Android, iOS, React Native, and Web
#6I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
Webflow's Ecommerce landing page uses Lottie Web, for example: https://webflow.com/ecommerce
> Let us know what you think of the intro hero animation. That was the part built in Lottie. [1]
From the tooltip on the page:
> This site was built entirely with Webflow — minus most of the hero introduction, which we built in After Effects and integrated on the page using Lottie. We wrote custom code to sync the Lottie playback with the Webflow IX2 animations in the hero, and uploaded the Lottie animation via a feature we’re testing internally to upload files (JS, SVG, etc) to Webflow sites.
Re: Lottie for Android, iOS, React Native, and Web
#7>Animated Vector Drawable (Android only). More performant because it runs on the RenderThread instead of the main thread. Supports only a subset of Lottie features. Progress can't be manually set. Doesn't support text or dynamic colors. Can't be loaded programatically or over the internet. The real long term alternative on Android is that Bodymovin now has a plugin to directly export an animation to the VectorDrawabl…
Author of Lottie Android here. The bodymovin to avd plugin is extremely beta and only supports a sublet of after effects features and none of the lottie features such as manually setting progress or dynamic properties.
Re: Lottie for Android, iOS, React Native, and Web
#8I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
https://www.lottiefiles.com/ has tons of live renders.
Re: Lottie for Android, iOS, React Native, and Web
#9I played around with Lottie (iOS) last time it was posted on HN (or maybe Reddit) ~6 months ago. You can create some really great animations quickly that would otherwise take a significant amount of time to hand code. Kudos to the team working on this for creating such a powerful tool and sharing it.
Re: Lottie for Android, iOS, React Native, and Web
#10I wished their sample animations were not GIFs but actual live renders. I couldn't find a web based "live example", but if it can do what they say, it looks pretty cool.
Webflow's Ecommerce landing page uses Lottie Web, for example: https://webflow.com/ecommerce > Let us know what you think of the intro hero animation. That was the part built in Lottie. [1] From the tooltip on the page: > This site was built entirely with Webflow — minus most of the hero introduction, which we built in After Effects and integrated on the page using Lottie. We wrote custom code to sync the Lottie play…
Wow!