Mikael Haapa‑aho

Mobile-First Focus

The calendar was fully responsive but the main focus was on mobile because the calendar was embedded in the Lidl Plus app. Performance, touch interaction, and responsiveness were prioritized from the start.

Design & Visuals

I began prototyping in Framer. Because of the tight deadline I had to use premade assets from Adobe Stock but everything was later modified to fit Lidl's brand visuals. The goal was to stay true to Lidl’s brand while adding a festive, friendly tone.

Animation

Characters and elements were animated in After Effects and exported as Lottie JSON using Bodymovin. These lightweight animations were integrated using lottie-web for smooth performance across devices.

Development Stack

The application itself was built using Nuxt 3, which offered excellent flexibility, routing, and SSR support. For the content management system, I used Storyblok for content management, allowing easy updates without code changes.

Promotion

In addition to the calendar itself, I also created promotional videos for social media. These were designed to match the visual tone of the calendar while highlighting key features and encouraging user engagement during the campaign.

Challenges

A key challenge was dealing with broken or incomplete time-locked links from Lidl. Because they were third-party sources, there was no way to test them beforehand. Therefore fixes had to be made while the app was live.

Runomaajoukkue was a nationwide poetry competition targeted at Finnish students in grades 7 through 9. It was inspired by Aale Tynni’s gold medal win in the poetry category of the 1948 London Olympics – the last Olympic Games to include artistic disciplines. The goal of the project was to bring poetry back onto the sports stage.

From Design to Deployment

The visual layout for the website was delivered by an external company in Figma. Based on that design, the site was developed using Nuxt 3 for the frontend framework, Storyblok as the headless CMS, and Bootstrap for styling and responsive components. The site was built with support for both Finnish and Swedish, ensuring accessibility for all target users.

One of the visual highlights of the site was a rotating statue that responded to scroll actions, adding a dynamic and interactive layer to the user experience. A key feature was also the submission form that allowed students to send their poems directly to the competition judges.

Two-Phase Structure

The website was designed to adapt to two main phases of the competition:

Submission Phase – Participants were able to submit their poems through the online form.

Post-Competition Phase – Once the winners were selected, the site was updated to showcase their names and publish the winning poems.

Content for both phases was managed through Storyblok, allowing for easy updates.

Challenges

One of the primary challenges involved the submission form. Initially, poems were not being sent to the correct email address due to a misconfiguration. Despite repeated testing requests prior to launch, the issue was only identified after the submission period had already started. This highlighted the importance of client-side testing for critical features.