Responses by Rens van de Wiel, creative technologist; Toby Mok, designer and partner; and Keith Kornson, designer and partner, RONIN Amsterdam.
Background: HERC is a new agency in Amsterdam that creates advertising to feel like entertainment rather than a forced message—connecting brands with popular culture. You’re probably familiar with its work for Tele2, G-Star RAW, Young Capital and HP. RONIN was asked to design HERC’s agency portfolio to introduce its work to the rest of the world.
Design core: HERC’s visual identity is very distinctive because of its bold, colorful and simplistic style, so we knew from the very beginning that we should keep those key elements on the website as well. Next to its visual identity, HERC is also famous for producing stunning video content, so it only felt natural for us to combine those two elements.
Favorite details: We think we did quite a good job of finding the right balance between HERC’s visual identity—which can sometimes feel intimidating to work with—and finding a way to showcase its projects that feels as simple as swiping through a PDF.
Challenges: Creating a smooth experience without any bumps or stops. The client wanted it to feel like scrolling through a PDF file without any visual loading. That was rather challenging considering there is a lot of video content. The solution was to preload content data of future navigational choices, and create different sized content per device and connection speed. By doing this, we nearly eliminated visual preloading all together.
Since the site needed to go live on a date where new work from the client would be launched worldwide, there were a lot of extra hours worked to get it all to work properly within the time limit. After it went live and we had some consistent feedback, we were able to tweak and smooth out the experience even more.
A lot of testing, early in development will prevent a lot of frustration towards the end of the project. Especially when doing things in a nonstandardized way. Nail down the idea and test it out while designs are being made. Then in collaboration with each other, use the knowledge of the early testing to tweak the design and UX so as to get the maximum out of the collaboration of design and tech.
Navigation structure: As we mentioned before, we wanted to make the experience feel smooth and simple. The website is designed as an endless loop to make it dummy proof. It doesn’t really matter which way you’re navigating, too; for example, you can view all content just by using only the right arrow key on your keyboard. As simple as that.