For Eurovision 2025's Voting Website, I designed and developed animations that brought the contest energy onto every screen at home. Over three weeks at Once.net, I overhauled the static website with lightweight, responsive motion graphics consistent across every device and region.

Eurovision 2025 introduced bold new brand guidelines that relied exclusively on motion to convey identity, with the Eurovision heart as its centerpiece. However, video-based animations were immediately ruled out. File size would create unacceptable delays on slower networks. The solution had to fit within a minimal payload, with no performance compromise.

My design process began with an in-depth study of the official Eurovision 2025 motion guidelines, which established three core principles:

Visual elements had to react as a unified system.

Linear motion was explicitly prohibited, the brand requiring behavior that appeared alive.

The format had to adapt to the page content, not the other way around.

Initial prototyping started simple, with a basic grid of hearts. I explored motion by adding mouse-based interactivity that resized hearts based on cursor proximity.

I introduced a Perlin noise layer to control heart sizes algorithmically. By configuring the noise to evolve at a low frequency and progress slowly along the Z-axis, hearts appeared as if reacting in organic patterns.

To achieve grid adaptability, I introduced a gradient map as an additional control layer. Heart sizes were remapped to the composite function of [noise * gradient], resulting in a highly controllable system that enabled region-specific masking.

I achieved the final effect by adding 2 layers of hearts, each with its own colour and delay timer. This solution perfectly emulated Eurovision 2025's brand guidelines on an entirely algorithmic basis.

Prototypes in p5.js achieved the desired outcome, but lacked the performance needed at scale. With all of p5.js’s utility functions, script loading times exceeded 100ms; for a voting website of this scale, that was unacceptable.

Therefore, I pursued every optimisation opportunity, migrating to HTML canvas and rewriting pre-built p5 functions. This resulted in a final loading time of 1ms, a 100x reduction compared to the original codebase.

I followed with extensive QA testing, covering both physical and virtual environments. Network simulation ensured performance from 2G mobile through fiber connections, while virtual testing validated consistency across 100+ device configurations.

Eurovision 2025's voting website shows how motion design can elevate digital experiences without compromising performance. A few personal learnings from the development of this project:

Custom UI massively helped with parameter discovery, compared to manual code iteration. This approach also opened up the creative process: non-technical stakeholders could explore variations independently, contributing directly while avoiding bottlenecks.

Building a state exporter streamlined stakeholder meetings and fine-tuning workflows. Interesting configurations could be saved, shared, and reloaded instantly rather than relying on documentation or memory.