Client Project: One Burger
Client Project: One Burger
Physics meets graphic design in a fun coming soon webpage for a new burger restaurant.
I met Matt Luckhurst in 2015. At the time he was a creative director at an ad agency. We worked on the stage visuals for a song that Nosaj Thing performed. Since then, we have stayed in touch and collaborated on the occasional project. Our latest collaboration, the coming soon page for One Burger, a new burger restaurant opening in Athens, Greece, is now live. As a post mortem, I will walk you through the delivery and share some anecdotes from the development process.
In this site, your mouse (or finger on mobile) moves the One Burger logos around to reveal the date announcement. The site is made for the ownership group to market to and draw interest from potential employees. Matt’s company, New Company, is well known for coming up with the visual identity of brands whose typography is strong and direct. Originally they came to me with the challenge to see if we could come up with a digital sticker interaction of the logo they designed. This is what we came up with:
I like the shading afforded by the sticker approach. The shading creates a delicate quality that adds character to the sticker. Each sticker is a plane in three-dimensional space. I wrote a custom shader to bend the plane based on the proximity of your cursor. This bend also affects the shade of the plane creating the illusion of a self casting shadow and adding depth. When you click it, a peel animation pushes the bend further before removing the plane altogether.
While a very compelling prototype, it lacked a certain polish that I was hoping to achieve. Often when you click on a sticker the animation jumps. The custom shader had limitations for the peel animation. If the properties went beyond a certain point the peel looked unnatural, like a rubber band. On top of this, New Company and their client felt that the interaction was not immediate enough. That folks would not get to the ultimately the timely information about what the stickers represented. So we decided to change courses and do a two-dimensional version. A version whose analogy is based on pushing papers, rather than peeling stickers.
Like most creative endeavors, this project did not go exactly as planned. Navigating the bumpy road to delivery took the majority of my attention during our time together. Estimating how long a prototype will take; Corresponding with the client to understand what their goals are; wondering how to visually represent the behavior of pushing papers or peeling stickers; these are all things I think about when I am not in front of the computer. They are challenging, but they are also fun. It is like working on a puzzle. In the moment, you do not know how it all fits together. But, with faith you will get there, you simply look for the next piece.
Are you working on any puzzles worth sharing at the moment?
—Jono