Star Atlas - Experience a virtual gaming metaverse
Bang & Olufsen
3D Modeling, Animation, Concept, Design, Development, UI, UX, Copywriting
Bang & Olufsen partnered with HELLO MONDAY/DEPT® to create a web app that gives every user a uniquely sensory experience. ‘See Yourself in Sound’ is designed to generate a vibrant, one-of-a-kind avatar for every visitor. Each character is crafted in real-time by analyzing your Spotify sound profile and aligning your overall mood and energy levels to all the aspects of a 3D character: texture, shapes, body movement and more. Visitors without Spotify can also generate their avatar via a fun, emoji-driven process. After your 3D character is generated, it can be shared with the world via link or a video that’s created just for you.
The mood-profile for each user is defined based on the average valence and energy generated from their Spotify top tracks, or through a short questionnaire in the alternate flow. We used a mood matrix to craft 12 base avatars that each have a specific aesthetic and a unique set of 3D components mapped to them.
The last step of the experience allows the user to share a recording of their avatar on social media. For this we built a custom rendering engine that made use of cutting-edge web APIs to capture, composite and encode the video directly in the browser.
Non Spotify users also have the opportunity to answer a short questionnaire to define their musical profile to receive a unique avatar. For this experience, we created a custom set of B&O emojis.
Using the Rokoko Motion Capture smart suit and gloves and in collaboration with Copenhagen Contemporary Dance School, we produced a series of custom dances to represent the 12 moods in the matrix.
Each avatar is based on the user's mood-matrix, which is generated based on their Spotify top tracks and completely unique to them. Furthermore we used the creation timestamp as a seed-value for a pseudo-random number generator. This allowed us to add even more uniqueness to the experience while still being able to reproduce that exact character in the future when shared on social media.
The combination of the mood matrix, custom soundtracks, motion capture dance and 3D base avatar resulted in a truly unique avatar with a custom title.
For the 3D graphics, we've adopted OGL. This lightweight WebGL framework allowed us to deliver rich visual experiences without compromising on load times or performance. Read more behind the scenes.