The starting point

Our client Rovio had a collection of comics in PDF format that they wanted to make available for download on the Angrybirds.com website.

“We have a bunch of comics in PDF format that we would like to have on our site”
– Deneb Pettersson, Rovio, August 2022

Background and goals

Instead of a simple and boring file listing, we wanted to honor the original concept of Angry Birds: Angrybirds.com is more than just a regular website. It’s an entertaining and immersive experience that celebrates the playful brand of Angry Birds. At its best, Angrybirds.com is so engaging that users almost forget they are browsing a website.

At the core of the concept is not only celebrating the brand, but also interactive features and fan engagement. In line with this concept, we wanted interactivity and playfulness to be evident throughout the site — including in the process of downloading books and comics. This idea led to the creation of the Angry Birds Comics Library.

Redbot guides the user forward in the library

The chatbot Red, built for Angrybirds.com, guides the visitor through the process of filling out a form to get a library card. Red provides instructions and comments on the user’s actions with a sarcastic tone.

The primary purpose of the required library card is to select the types of content the user is interested in. As an added twist, the user can also choose a name for themselves by clicking the update icon, prompting the system to offer an automatically generated name. As a result, the user receives a library card and gains access to browse downloadable books and comics.

Implementation

The digital library is implemented as a React application, using WordPress as the backend system for its data source. Various animations and user interactions are implemented using the Framer Motion animation library.

In the bottom corner, the guiding bird Red is created with Lottie animation technology, fully customized with a JavaScript implementation developed in collaboration with Rovio.

Visit site