TOPPAN

UI/UX Design for a Metaverse Shopping Mall

We were entrusted with the UI/UX design and branding for Metapa, a metaverse shopping mall from Toppan. Building on the insights gained from our March 2021 test demonstration with Virtual B8ta, we refined the communication features, spatial layout, and user interface. The result is a newly launched platform that lets brands establish their presence in this virtual marketplace.

Service Design

What’s Metapa?

Imagine visiting a store you’ve been curious about with family and friends, stumbling upon unexpected gems in a store you just happened to enter, or casually chatting with your favorite sales assistant. Shopping isn’t just about speed, affordability, and convenience: it’s about enjoyment. And now, you can experience this joy anytime, anywhere, and with anyone. Metapa is a metaverse shopping mall that seamlessly blends the real and virtual worlds.
https://metapa.app/

Background

The Covid-19 pandemic dramatically altered the shopping landscape for consumers. However, while e-commerce sites have enhanced convenience, they’ve also reduced opportunities for the shared experiences of going shopping with friends or chatting to sales staff to learn about products. This shift has laid down a challenge: how to ensure a satisfying purchasing experience in this new environment.

Recognizing these issues, Metapa introduces a novel way of shopping by exploiting virtual spaces.

A New Shopping Experience: Merging the Real and the Virtual

That shop you've always wanted to visit, or that product you've recently become interested in – METAPA connects you not only virtually, but also with real shops and products beyond the constraints of time and space.

Group Shopping with Friends and Family

Metapa = Meta + Party. Metapa is a metaverse where you can meet up with the people you know and make new friends. In this virtual space, you can experience the lively atmosphere of people getting together and have fun exploring different stores as you shop with friends and family.

Discover New Possibilities in Virtual Product Experiences

What’s this? How do I use it? When you touch a product, a virtual product experience begins. Make unexpected discoveries in the virtual world, just like in a real-world store.

Branding

Inspired by Metapa’s spatial qualities, we combined two three-dimensional objects, each with its own playful color, to reflect the merging of the real and virtual worlds. The logo’s typeface conveys softness while the use of black lettering echoes the platform’s simplicity.

Virtual Space Design

We created a variety of spatial designs, ranging from those replicating real-world stores to those uniquely suited to virtual environments. While simplifying the designs to ensure functionality on mobile devices, we tailored each store’s spatial design to reflect its concept, aiming for a spatial experience unique to the metaverse.

Avatar Design

We designed the avatars available in Metapa along with their variations. Drawing inspiration from the colors and shapes of real-world fashion, we produced simple yet expansive color guidelines and styling options allowing users to express their individuality in the virtual space. By selecting and customizing various avatars, users can experience the joy and vitality of getting together with friends.