[Wave 6: Bottom Up] Test large animation in the app

[puneetlath]

We want to add a video or animation to the FAB when it is first opened. We don't yet support in-app video playback, so animation is our only currently option. I've heard that there are concerns about animations over a certain size/length. But also that we now support .lottie files which reduces animation file sizes by a lot.

Could we test this animation in the app and see how it performs?

Here is the full 45 second animation: inProductExplainer-Mobile-v2.json (1).zip

Here is one broken in to three 15 second portions: InProductExplainer-JSONTest.zip

We'd ultimately like it to live in the Global Create menu and only be shown when the global create menu is open by default, but we can start out by testing it anywhere.

cc @roryabraham

[puneetlath]

@kosmydel would love your help testing this if possible. Thanks!

[melvin-bot[bot]]

Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[kosmydel]

Hey, I would love to help you here. Can you send me some large animations? I will check next week.

[puneetlath]

Thanks so much! Are you able to use the two zip files linked above?

[kosmydel]

Thanks so much! Are you able to use the two zip files linked above?

Sure! I haven't noticed it before.

[kosmydel]

Hey, I used this converter to convert animations to the .lottie format, but it looks like some of the animations are broken, and couldn't be converted.

I was able to test it on ChatFlow. Here is a video:

https://github.com/Expensify/App/assets/104823336/a1e11735-9547-45a8-a04a-37eaf059eb5b

Here is a link to the branch, where you can test it (just go to Settings -> Security).

Can you send me animations in .lottie format to test it? Or do you want me to test it in .json format (which is about 10x larger)?

[puneetlath]

Can you send me animations in .lottie format to test it? Or do you want me to test it in .json format (which is about 10x larger)?

So dumb question, I can't actually figure out how we get a file in a .lottie format. Can a file be exported from After Effects into this format? I'm seeing guides like this, but they still seem to all mention that the exported file will be in JSON format.

[kosmydel]

Hey @puneetlath, I found a plugin for After Effects here. They say that it offers "dotLottie export support". Can you confirm that if works/doesn't work?

If it doesn't work, then we probably had to rely on the converter here.

[puneetlath]

Ok thanks! I'll see if they can use that plugin to export as .lottie

[puneetlath]

Ok here are two new ones. They installed that plugin, but weren't able to export as .lottie. On smaller animations, they were able to export with the plugin, but not this bigger one. So maybe it's just too big?

So they created the .lottie using the converter. But in any case let's try both of these out. If we find that they don't work, then we'll have to go the video route.

InProductExplainer-Mobile-v16.lottie.zip

InProductExplainer-Mobile-v16.zip

[kosmydel]

Hey, I've tried both .lottie and .json. Even their official preview doesn't open those animations (link here). If it works in this preview, it will (in 99%) work in our app.

My guess is it is something related to the videos/images attached to this animation. After decompression I can't even open it on my Mac. So those might be corrupted.

It might be a good idea to report it as a bug here. I can do this, if you provide me with exact steps how you generate the .lottie file (probably the source file of the animation in After Effects would be good to send them), so I can provide them with as many details as possible.

[puneetlath]

Ok good to know! I'll ask for the steps they used to create the file. I've also DM'd you the pre-compression .lottie file in case that makes a difference.

[kosmydel]

Ok good to know! I'll ask for the steps they used to create the file. I've also DM'd you the pre-compression .lottie file in case that makes a difference.

I've checked it, and the error still occurs. I'm testing it here.

After I decompressed the .lottie file, the images attached are broken (cannot open it on my Mac). It might be the reason why it doesn't work.

[puneetlath]

Ok so it seems that this animation is too big and not going to work. The designers said that the lottie plugin won't let them export anything over 5 seconds as .lottie.

Thanks for helping try this out!