Mar 23, 2023
SOTM January: The Hall of Zero Limits by dogstudio
Congratulations to dogstudio for winning Site of the Month January for The Hall of Zero Limits. Thanks to everyone who voted and tweeted, the winner of the Pro Plan is at the end of the article.
Having backed creators of color since the 1980s, it only made sense for Sprite to take a giant leap into Hollywood by sponsoring Marvel Studios Black Panther: Wakanda Forever. They came to us with the idea of a 3D experience unlocking behind-the-scenes videos highlighting the multicultural women behind the film, so the “Hall of Zero Limits” was born.
The experience aimed to reveal an exclusive behind-the-curtain look at the new film while at the same time immersing people in the Wakanda universe without being a blatant copy.
We started with our fair share of research and testing to bring all of this into one vision. Cinematic fantasy architecture has designs, shapes, and colors that all have meaning. So we went crazy with it and used a combination of sketches and new technologies such as DALL-E as the first step towards conception. “A beautiful matte painting of the hallways of Wakanda University, dark, light from a window, church-like light, futuristic African, 30mm, concept art” Anyone.
We went crazy with it and used a combination of sketches and new technologies such as DALL-E as the first step towards conception.
We took those sketches, DALL-E rendered visuals and moved on to 3D. From plants, god rays, patterns, statues, and a lemon-and-lime tree, we once again gave it those extra details that make you want to come back.
Welcome to the future
As the world’s most technologically advanced nation, we couldn’t help but associate it with luxury and modernity. With this vision, we built the entire graphic language on the idea of minimal outlines, GUI shapes, and holographic backdrops—mixing Afrofuturism and Art Deco like it was our special love child. Fittingly, typography choices were all made to fit our approach of exquisite craftsmanship in modernistic forms.
We kept tweaking and adding small elements to make the experience more immersive and delightful to explore. From the custom motion graphics, Wakandan typeface transitions, and wisdom guide, our designers stayed on the project until the end to push this to the next level.
Hiding in Plain Sight or, Behind the scenes for those inclined
By merging meshes and using Draco compression, we managed to keep the 3D files' weight low.
Creating a rich and dense 360 scene presented us with several challenges, namely how to compact numerous items and visual effects into a single scene designed to be viewed from all angles. We collaborated with our 3D designers to optimize assets, which required a significant amount of time and effort. By merging meshes and using Draco compression, we managed to keep the 3D files' weight low. Furthermore, we manually optimized each texture, reducing their weight to a minimum while maintaining excellent visual fidelity at close range.
Achieving realistic yet performant reflections was another challenge we faced. As we used many metallic materials, reflections played a crucial role in the overall visual experience. Our 3D designers created lightweight, custom PBR materials, which we continually tweaked to achieve a realistic and majestic look. Real-time reflections were not a viable option due to their high performance cost, particularly on less powerful devices. To address this, we came up with a solution that involved using multiple 360 renders of the scene as environment maps for lighting and reflections. Transitioning between these maps using the camera position as an input gave us the illusion of real-time reflections, but at a significantly lower cost.
Getting the camera movements right was essential to the overall feel of the experience, and it presented its own set of challenges. We wanted an organic movement but were constrained by specific stops in the scene. To achieve this, we created two curves, one for the camera position and another for the focus point. These curves were first dynamically smoothed in code based on the device and screen resolution. We then animated the camera on these curves using custom animation timelines to achieve a better cinematic feel. Using a single spline curve to track the camera's movement would not have been sufficient in this case.
Client: Sprite / The Coca-Cola Company
Agency: Wunderman Thompson
Multidisciplinary creative studio at the intersection of art, design and technology. Making Good Shit like it's 1996.
Thank you for your vote and tweet @kevinrig_, please DM us to collect your prize!