LottieFiles
Animation, creative
5.2 million
1 month
Product Designer, Researcher, Workshop Facilitator, Data Analyst
As a result of redesigning and repurposing the home screen, app registrations increased by 18.1%, the number of shares and exports of animations surged by 16.7%, and the retention rate rose by 6%.
What is Motion Canvas?
Before starting, here is a video featuring the LottieFiles mobile app. The designs here are older and this project will be looking into enhancing some parts of the app, specifically, the motion canvas, which is shown in this video at 0:05-0:17.
Home screen: The home screen of the mobile app appears less exciting, and hierarchy is absent. Upon landing on this screen, users are unsure how to get started.
Motion Canvas templates: The discovery of pre-made templates is somewhat hidden, and the browsing experience is limited.
Motion Canvas features: There are limited features available within this canvas. Users need more customisations to make their designs personalised.
Share & export drawer: The share drawer is currently cluttered, lacks clear hierarchy, and does not support easy sharing to social media.
Goal: To identify top templates favoured by users and prioritise different categories of templates within the LottieFiles app.
Plan:
Analyse, categorise templates from similar platforms and note distinctive features.
Determine most used templates considering their placements in the app.
Assess user journeys from browsing to sharing/ exporting selected templates.
Document post/template creation flows (optional).
Impact: To establish a template roadmap for the mobile team based on research findings.
Digging into data: Prior to organising a brainstorming workshop, I delved into the current performance of Motion Canvas to address key questions to guide myself and my team through brainstorming. Questions I considered during data analysis included:
Who are our target users, what are their goals and aspirations?
What Motion Canvas templates are performing well within the LottieFiles app?
How are the Motion Canvas features performing currently?
What are the top Motion Canvas features?
Workshop: I led a session with key stakeholders, including the Product Manager, Product Designer, and Head of Product Design. With the insights I gathered, we reviewed past Motion Canvas feedback, analysed data insights, and identified user groups and their specific needs.
Learnings from survey and data:
Evergreen templates give the highest engagements based on created designs and exports/ shares.
Content creators prioritise prompt actions.
Marketers focus on a variety of choices.
Rough sketches and low-fidelity wireframing are utilised primarily for ideating the layout and placement of contents, as well as organising current and new features for the app.
Challenge 1 : Reorganise and repurposing the home screen and navigation bar of the LottieFiles app, balancing the needs of both returning and new users.
Improvements:
Navigation Bar: By prioritizing popular mobile features based on data collected through Amplitude, I worked with my Product Manager to deprioritize and reprioritize certain features in the navigation bar, resulting in a clearer app direction.
Home Screen: The home screen now emphasizes quick actions for creation and has been decluttered to improve discovery and navigation.
Challenge 2: Combining export formats and social media options into the same share/export drawer without overwhelming users.
Improvements:
The user's preferred social media app is now featured as a quick share action at the top of the drawer. E.g. Share to Instagram Stories
Sharing to social media is set as the primary action, with downloading formats as the secondary action, helping to declutter the drawer.
Onboarding: Showcasing the top 4 popular use cases and features valued by users in the app, as identified through a user survey involving 10 participants.
Home Screen: Following the restructuring and enhancement of Motion Canvas, the LottieFiles app's home page has undergone a significant revamp. New features include an improved search experience, the addition of a 'You might like' section to help users get started, and a redesigned share drawer for quick actions to share content to their preferred social media app (based on their last shared option).
Tools/ Features: Reorganised animations in the 'Add Animation' drawer and introduced a canvas drawer for swift selection, offering choices for canvas size, background, pre-made templates, and starting with media (images or videos).
Deep diving into metrics: After the revamp of the main flow of the LottieFiles app, I initiated a reconvened meeting to delve deeper into our current data analytics and measure its performance, ensuring it aligns to our goals of increasing user registrations, retention rate and number of exports and shares.
Output: Every week, I organize a data-sharing session where I present the findings from the top 5 questions my team and I have. These data insights act as our North Star metrics for guiding decisions and shaping our strategy.
Overall, this project involved the revamp of the LottieFiles app's home screen, enhancement of explore screen, Motion Canvas user journey (create, add animation, change canvas, share), and an introduction of premium animations (paid). With these new enhancements, an onboarding journey was also introduced into the app for the users upon launching the app. These have contributed to the boost of registered users and number of shares/exports.
