Kalderos 2023 Annual Report
What I did
A fun, 8-bit inspired take on a traditional annual report. This is a single-scroll, multi-chapter experience that features custom illustrations throughout, supported by subtle animations, and a whole lot of custom JavaScript to create interesting interactions that feel effortless. And of course, a fun easter egg if you know what to look for.
My role: Webflow developer
About
I'd worked with Kalderos before on some updates, site architecture changes, and new pages. I was more than excited to do the development of their annual report, which is always a standalone piece with its own identity and visual language. This year's was the most ambitious to date.
Pixel Art Theme
Stemming from the concept of "Mission Critical", the experience takes an old school video game form. The art is fun, smart, and inspired the animation techniques.
Micro-Interactions
What's the point of bringing an annual report into the digital world, if you're not taking advantage of what the digital world can do? This report finds little bits of interactivity everywhere.
Custom Responsive Elements
To go along with the 8-bit theme, many containers had custom pixel borders. That poses a problem for responsive layouts, where containers need to resize, but stretching would break the visual effect of a "pixel". To solve for that, I created multiple versions of each container elements to fit different screen sizes while keeping border dimensions exact.
Custom Javascript
It's always a good sign when your code exceed's Webflow's character limit. That includes flipping cards, custom tabs, a "life meter" progress bar, a custom draggable scrollbar, and a fun easter egg, to name a few.
In Their Words
"Jon was a fantastic partner throughout the entirety of the project. He is clearly an expert in Webflow and master of his craft, but what set him apart was his communication, attention to detail and follow through. I'd recommend him for anyone looking a Webflow expert and beyond!"