Responses by Malte Gruhl, design director; and Martin Wecke, creative developer.

Background: COLORSxSTUDIOS already had a loyal fanbase on YouTube and social media. With a new site, we wanted to give its content and community a second home. At the same time, the site had to seamlessly integrate its shop with a content platform to create a unified brand experience.

Design core: Each section—EXPLORE, WATCH, LISTEN and SHOP—is dedicated to a specific type of carefully produced, curated content: videos, playlists, music and products. It was clear that we needed to create a unique UI/UX solution for each of these sections while maintaining a consistent look and feel throughout. You could say that we created four or five different websites and merged them into one holistic experience. With the help of Philipp Starcke, Jonas Weber and Steve Legrand at COLORSxSTUDIOS, we were able to push this overarching concept.

Favorite details: We are quite happy with how we created touchpoints to the shop across each page without forcing it. Another is the little design details throughout the site, like the color toggle and the playlist integration. These are all things that 90 percent of users will not immediately get. Still, once they do, it adds another level of craftsmanship to the site, which was important to both COLORSxSTUDIOS and us.

Process: The team at COLORSxSTUDIOS has a clear vision of their brand, and when we started working together, they first gave us rough concepts that helped set the general tone of the experience. These were massively helpful to us when we began the design process. We took these concepts and created around 100 to 150 iterations over the course of three-to-four months. It was quite intense, but we wanted to capture the brand’s spirit and deliver an emotional experience—not just a well-designed, functional e-commerce site.

Challenges: It’s rare to see such a dynamic interaction design on a content-heavy platform. Making both of those work on a variety of screen sizes and with dynamically added content was definitely a challenge. Still, with how it came together in the end, it’s great to see every new piece of content making the site shine—and vice versa.

Technology: We used a very modern stack to build the site with Next.js. This enabled us to pull in content from multiple sources and platforms like a CMS, Shopify and Vimeo, which are then seamlessly combined into a unified user experience.