VSLB METAVRSE—
AN IMMERSIVE WEB EXPERIENCE FOR BRAND MARKETING

This project is a virtual showroom that redefines how users engage with brands and products online. Developed as part of an in-house project at VSLB Inc., a Seoul-based design studio, it combines interactive 3D visuals, animations and gamified elements to create a dynamic and engaging online shopping experience.

Fields

UX/UI Design
Front-end Development
Game Design
Contribution

Conception
Prototyping
Programming
Tools

Adobe Xd
HTML, CSS & JS
ThreeJS
CannonJS
GitHub
Project Thumbnail

The project bridges the gap between conventional online shopping and in-person experiences by creating an interactive, explorative virtual environment. Users navigate through four themed spaces, each with unique interactions, animations and challenges designed to encourage deeper engagement. By introducing a quest system where users collect tokens, the project adds a gamified element that motivates exploration and interaction with the brand’s products and story.

Unlike standard websites, this experience allows users to move through a 3D virtual space using a third-person controller and mouse interactions. Each themed area offers distinct interactions and animations that highlight different facets of the brand. The quest encourages users to explore every space, unlocking engagement through exploration and discovery. The combination of interactive 3D design and gamification transforms a typical shopping session into an engaging narrative journey.

Project Image Project Image Project Image Project Image
Project Gif

The project was entirely built in JavaScript for a lightweight browser application. Three.js was used for 3D rendering, while Cannon.js handled physics and object interactions. Custom controls enabled third-person navigation and mouse interaction, allowing users to explore the environment intuitively. This approach replicated game-engine-like functionality directly in the browser, ensuring accessibility without sacrificing interactive complexity.