efood logo

Bringing animation to a delivery service platform with efood

efood

By efood team

The integration of Lottie had a positive impact on the collaboration process between the design team and developers, resulting in a more streamlined workflow and improving the overall quality of the application.

efood.gr is the leading online delivery platform in Greece, providing customers with a hassle-free way to order food, groceries, flowers, pharmacy and more from their favorite shops. With a wide variety of options and seamless delivery service, efood.gr has become the go-to platform across the country.

What motivated you to integrate animations into your delivery platform?

Michail Kouroupakis, Director of User Experience at efood (part of Deliveryhero): We knew incorporating motion would enhance our delivery app, resonate with our brand and marketing strategy, and elevate the user experience. Our goal was to create a user interface that not only functioned well but also provided emotional feedback to our users.

However, our journey wasn't without its challenges. The major hurdle we faced was dealing with slow performance and large file sizes, prompting us to look for a better solution. That's when we discovered LottieFiles four years ago through GitHub and ProductHunt, and we began testing its performance with dummy files.

In no time, Lottie proved to be an invaluable tool for our team. It enabled our designers to create beautiful animations and offered our developers to easily integrate them into their applications. But most importantly, it allowed us to create engaging animations that aligned with our brand and marketing strategy.

Could you describe the experience of integrating Lottie into efood's design and workflow systems?

Michail Kouroupakis, Director of User Experience at efood (part of Deliveryhero): Convincing our team to try Lottie animations was easy as everyone was excited about the potential to enhance the user experience. One of the key benefits our developers experienced was that the integration of the Lottie SDK was very straightforward. They could add Lottie files in the same way they would add a PNG image.

Additionally, the Lottie documentation, comprehensive and well-structured, made it easy for our developers to understand how to use the tool. This facilitated a smooth and seamless process for integrating Lottie into codes.

For designers, LottieFiles is also useful for previewing our work and sharing it with the team for feedback, and it also helps our QA team to check the acceptance result. The additional bonus of converting tools allows us to export animations in various formats that marketing can use for presentations or ads.

Emmanouil Karamanis, Senior Engineering Manager (App iOS & Android) / Christos Langouras, Engineering Manager / Panagiotis Skordylakis, Engineering Manager (Web):  The preview functionality, easy export options, and small file sizes are the specific LottieFiles features and tools that are most beneficial to our team in achieving our project goals. We use LottieFiles mobile app to check the visuals as the design team mobile, and sometimes we use the Lottie Editor for minor adjustments. To take creative ideas, we check other creators' work within the LottieFiles Marketplace.

We didn't face any major obstacles during the transition. Instead, we discover an opportunity to enhance our use of Lottie after the initial implementation. We realized that having dynamic Lottie could improve the user experience further, so we implemented a server-side infrastructure where we could upload Lottie files that would change automatically based on the event or situation.

Overall, the integration of Lottie had a positive impact on the collaboration process between the design team and developers, resulting in a more streamlined workflow and improving the overall quality of the application.

What is the role of motion in efood content? Is there a set of guides that you consider when adding animations?

Anna Dana, Visual Designer and Eleni Gouga, Senior Product Designer : Our team has integrated LottieFiles into our creative process, and it has greatly improved our ability to create engaging animations that align with our brand and marketing strategy.

We collaborate on changing banners and Lottie files for every popular event, including Mundial, Xmas, Easter, Summer, Winter, Autumn, Halloween, and Clean Monday.

With Director of User Experience, we iterate on the placements that we will change inside our app, which typically include the splash screen, empty states, loaders at the order process, confirmation animation, and the animation for our feature Piñata.

We have started to use optimization of Lottie with the team plan, but we didn't need to do much to optimize Lottie for apps and the web because of our multi-device design system. Overall, LottieFiles has greatly improved our creative process, and we are able to create more engaging animations with ease.

What impact have you observed since implementing Lottie animations or beginning to use LottieFiles?

Konstantinos Giamalis CPO at efood (part of Deliveryhero): LottieFiles has remarkably elevated our user experience and engagement by introducing Lottie animations to our app, which users and stakeholders alike have warmly received. They've found the unexpected yet enjoyable and eye-catching animations not only create a memorable experience but also boost our brand's visual identity and add personality to our product.

As a result, this overwhelmingly positive feedback has sparked a continuous effort to incorporate more of these playful elements into our future designs. Our approach to design and development has evolved significantly due to the success of this project. We now prioritize the use of animations and using interactive elements to enhance user experience and engagement.

The vast library of high-quality animations that LottieFiles provides, combined with their convenient preview and sharing features, have streamlined our design and development process and saved us invaluable resources.

Download efood