Client
Parship Meet Group
Project type
Product development
Discipline
Product Motion
Animation
Role
Senior Motion Designer
Overview
Before the switch to Rive, Lottie was the cornerstone of the entire Gifting product. With animations becoming more complex, both on a visual and technical level, the output needed to match the demand. Additionally, personalized Gifting products were awarded to users who hit a certain milestone, but due to the demands of the normal pipeline, the personalized products could not be launched within a reasonable timeframe.
Utilizing Lotties capabilities (and understanding it's limitations), we needed a way to address the ever-increasing demand of both the normal and personalized products in a way that could not only reduce production time but provide assets and "skeleton" structures that could be reusable in future products creations.
I was tasked with leading a team of animators in the technical development, library organization, and cross platform testing of what would become the Puppet Project.
Research
While the team and I had a very firm understanding of Lottie, it's capabilities as well as its shortcomings, we needed to experiment with a range of possible solutions to not only be fully aligned with how best to construct this system but also develop how the files would be organized for best possible results and future handover of assets for the library.
Challenges
• Final JSON still needed required size limit of 1.5MB.
• Usage of plugins or scripts to construction the system was prohibited due to Lottie restrictions.
• Universal style so assets could be mixed and matched between animations.
Goals
• "Plug and Play" style of product where different character builds could be applied to pre-built animations using the system.
• Affective, Lottie compliant, method of system construction.
• Reduction in overall production time.
• Develope a library of reusable 'rigs', backgrounds, and accessories for future animations.
The Solution
After experimenting with three possible solutions, it was agreed that the system would utilizes Lotties ability with Nulls to create our very own form of character rigging that would allow for "Plug and Play" style of animation creations. Parts from an asset library could be prebuilt and then applied to the rig, while the animation remained intact.
To create such a system, extensive testing and immense asset creation would be required so a framework for the builds would need to be conceived to reduce production time.
Character Asset - Body Types:
Character Asset - Body Types:
Asset Library
Understanding that building an entire asset library before launch would be close to impossible, we had to start by creating personalized gifting animations and separating their components into three categories.
• Character assets - an entire library dedicated to the creation of a singular character consisting of its own sub libraries including:
• Body types
• Sizes
• Skin Tones
• Facial shapes
• Hair styles
• Eye shapes and colors
• Minor details (moles, scars, etc.)
• Environmental assets - Background and foreground elements that could be color swapped and reused.
• Accessory assets - Miscellaneous elements that could be within an environment or on a character (phones, headphones, etc.)
We built the Environmental and Accessory asset libraires as we went, but for the Character asset library (since it would be extensive with all its subcategories) we started with building base models and elaborating on those base models. Having this groundwork laid out meant that not only was the character creation process simpler, but users, when presented with the choices, were able to clearly visualize their characters thus reducing review time.
Lottie Compliant
Using Nulls within Lottie is not without its set of challenges, but despite this we were able to:
• Stay within the 1.5MB JSON weight limit.
• Create a product that was cross platform compatible on iOS, Android, and Web.
This rigging system for character animation was created with in depth knowledge and years of experience understanding Lottie's strengths and its weaknesses.
Lottie Compliant
Using Nulls within Lottie is not without its set of challenges, but despite this we were able to:
• Stay within the 1.5MB JSON weight limit.
• Create a product that was cross platform compatible on iOS, Android, and Web.
This rigging system for character animation was created with in depth knowledge and years of experience understanding Lottie's strengths and its weaknesses.
Final Product
The results truly speak for themselves.
A first for Lottie; a fully customizable character rigging system. In addition, files were easy to handoff between the wider animation team, a growing library of assets for future products was constantly being updated, and, mayeb most importantly of all, users were excited to see their personalized gifts!
The Result?
Production Time Reduced by 50%+
With the creation of the Puppet Project, we were able to cut down production time by more that 50%, but we were also able to create
-
A lightweight rigging system previously unheard of with Lottie.
-
Libraries with assets that could not only be used in custom gifting products, but in the normal gifting pipeline as well.
-
A style uniquely our own that became celebrated by users.
-
Future iteration possibilities built on the backbone of this core system