For the HOT DOG Challenge campaign, in addition to the key visual animation, we designed and coded an animated voting scoreboard. This solution displays real-time data on Żabka’s menu boards, Digital Signage screens, and DOOH media across Poland. The Żabka team needed an animation that would react to sales-based voting results. The goal was to display a bar showing the current score over a looped animation featuring the characters. Our task combined graphic design, motion design, and programming.
styleframes
The bar had to match the campaign's key visual, clearly display the vote proportions, and change as new data arrived. We designed the look of the bar and the way the score changes were animated. We then translated the design into an HTML5 solution connected to sales data. The data updates every 15 minutes, and the animation reflects the latest results. Instead of preparing separate assets for every update, we created a mechanism that adjusts the presentation based on the received values.
The scoreboard we designed and coded is responsive. Its layout adapts to various screen aspect ratios and resolutions, maintaining data readability and consistency with the campaign's key visual. A significant challenge was the diverse environment of playback devices. We developed the solution with broad compatibility in mind, accounting for technical differences between screens.
process
We expanded the solution prepared for menu boards and Digital Signage screens to also cover the DOOH campaign. We adapted the animation and HTML5 code to meet the requirements of individual providers. As a result, the updated HOT DOG Challenge scores can be tracked both in Żabka stores and on outdoor advertising screens across Poland. This created a communication channel where data directly influences what the audience sees.
credits
Animation: Karol Dynysiuk
Programming: Przemysław Białasz
AI: Przemysław Białasz
testimonials
