Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Using Lottie for your iOS apps

713 vues

Publié le

The Airbnb engineering team have released a library for converting After Effect animation to JSON file, that you can use for native apps. I'm going to share my short experience of using Lottie for an iOS project.

- Presentation made for Melborune Cocoaheads, March 2017

Publié dans : Logiciels
  • Login to see the comments

Using Lottie for your iOS apps

  1. 1. Using Lottie! Jinju Jang
  2. 2. What is Lottie? ✦ Lottie is an iOS, Android, and React Native library built by the Airbnb engineering & design team. ✦ It converts After Effects animations to a format for use in your app. ✦ After Effects animations in your app…?! So tempting!
  3. 3. …This is a lightning talk! ✦ The learning curve - Time, difficulty, shippable or not. ✦ My honest review - Good, bad, or weird experience through the exploring.
  4. 4. Part 1. The Learning curve Lottie workflow & Time spent
  5. 5. Let’s make art!
  6. 6. Lottie Workflow .JSON Export Import Body- movin Lottie
  7. 7. Time spent & Difficulty DAY 1 Started learning 
 After Effects DAY 4 Made something okay Day 5++ Trying it with Xcode! 🌶 🌶🌶🌶🌶🌶 🌶
  8. 8. Setting up Workflow 
 = DONE!
  9. 9. Part 2. (My honest) Review Good, bad, and weird things
  10. 10. First impression 
 = Easier than i thought!
  11. 11. creating conditions
  12. 12. Good = min-maxing! ✦ From an idea to actual screen = less than 7 days ✦ FYI, This type of idea usually gets rejected by your PM. 
 (Because it takes too much time!) ✦ A designer can work in parallel with a developer. ✦ You can boost up creativity! ✦ Super light. …The whole animation is only 9-15kb.
  13. 13. Bad…? Perhaps? ✦ It’s less smart when you want to swap an animation to something else. (We ended up using layer order) ✦ Honestly, there is nothing *seriously* bad.
  14. 14. Weird = Frame rates ✦ Frame rates seem slightly off compared to After Effects. ✦ I don’t know what exactly causes this issue. ✦ Let me know if you know how to solve this! Note: After the talk, many developers came to me and explain why. It wasn’t smooth because the CPU was rendering each single frame to show the animation. (That was how Lottie worked!) 
 —> Hmm… I guess that’s something you need to trade off to get convenience for now!
  15. 15. Not now, but One day… ✦ Complex layer effects ✦ Merged vector layers ✦ Gradient ✦ Buttons ✦ …Will be supported!
  16. 16. Please….
  17. 17. Conclusion ✦ Recommend it, it’s really fun. ✦ Until it becomes more clever, the best place to use it is somewhere you don’t have to worry too much. (e.g: Replace static illustration with a looping animation?) ✦ Treat it as decoration.
  18. 18. Thank you! @arle13

×