Written by DisneyNOW team
DisneyNOW is an app that lets you watch content from Disney Channel, Disney XD, and Disney Junior, as well as play games. This app had to be versatile as it brought together three completely different brands for completely different segments of the audience. It was important for us to craft the feeling that the app is always talking to the specific user, be it one that is five years old or one that is ten years old.
Customization became key to crafting this experience. This is where we relied heavily on Lottie animations. Since they can be dynamically changed in real-time, we could and can easily adapt them.
With an app geared towards children, there’s much more freedom to add animation and many more opportunities to delight. There’s a delicate balance between enough animation in a children’s app, but it’s important to not let the animation get in the way of the experience.
The Disney Brand promise is to immerse all of our users in a story. There’s a dedication to invite you into an exciting new world. When adding animation to the app, every moment crafted by the motion we add has to be an experience. It has to bring you into that story.
Within the DisneyNOW app, we offer the users rewards. We could have easily had a pop-up alert. Instead, by leveraging Lottie animations, we can provide a dynamic experience and make it much more fun by showcasing an animation that is much richer and engaging than just a plain Overlay Modal.
If you’ve ever been to any of the Disneyland or Disney World locations, you’ll have noticed our mission to bring fun and excitement to visitors of all ages. Even when you’re waiting in line for your favorite ride, there are small and unexpected moments of excitement all around you that maintain the Walt Disney Company experience.
The same is true in our DisneyNOW app. Beyond navigating the dynamic content that you know and love, we’ve hidden Easter eggs—in the form of animations. Having these little treasures sparks both curiosity and excitement.
In this example you see here, we created animation takeovers that the user could unknowingly trigger during the period of time around the launch time of the Kim Possible movie. These animations not only aimed to surprise, but also worked to promote the new movie.
The Lottie animation’s benefits can be seen in the demonstration of its scalability. When it comes to devices, children—a key audience—are rarely using the most up-to-date models. We know that there’s a need to test mobile devices of all ages and models, ensuring all our Lottie animations work successfully.
Take gradients, for example. This was a fun challenge for the team when dealing with older iOS and Android models.
Older devices can pose more of a challenge when animating for Lottie, but our teams are no strangers to working around technical limitations, determining new design ideas and ways to push the limits of what’s possible.
At the end of the day, there’s nothing that can’t be done in animation. Creating 3D animations, especially in Lottie, may seem like a pretty daunting task. One workaround we’ve found is to draw the 3D design as 3D first, and then recreate everything in shape layers in After Effects so that they look like they’re 3D.
We’ve always believed that you shouldn’t let limitations inhibit you. True creative freedom comes with having those limitations in front of you, then determining the right solutions.
Thanks to the DisneyNOW team: David Gardner (Creative Director), Cherrie Go (Design Lead), Anibal Koliren (Motion Lead), Rona Sheen (Senior UX Designer), John Solaro (VP Design, UX, & Research), Hannah Kan (Senior UI Designer), Gina Gordon (Illustrator), Jason Roeckle (UX Engineer).
