Stage: Metaverse

Stageverse is an early-stage startup developing a cross-platform Metaverse experience focused on enhanced presence, building community and high-quality avatars & environments. 

Screenshot-2024-04-29-at-3.16.40 PM

Role

Lead Designer: I was brought on as the first designer prior to our public beta launch. I defined design best practices and developed a new design system transitioning the team to Figma. In true start-up fashion, I worked across disciplines focusing on visual and interaction design for the mobile & VR products, while also solidifying the brand, building our marketing website, and managing contractors.  

Context

Stageverse is an early-stage startup developing an NFT-based "Metaverse" experience for iOS, Android, web, and VR. I worked closely with the CEO, product, marketing, and content to ship our public beta across platforms. In our first week, we achieved 10k downloads and used various channels to collect feedback to further iterate on the product. 

Techniques

UX/UI Design, Concept Design, Brand Design, Interaction Design, Product Strategy, User Research & Testing, 3D Design, VR Design, Metaverse/NFT Design

Product Design

Mobile & VR Applications

The Stageverse app was built in Unity using the same components and patterns with additional states/affordances to translate across mobile and VR. We used a "tablet system" metaphor in VR that clipped into the landscape orientation on mobile. UI components were designed to make efficient use of space to allow for the system to scale across mediums while following recognizable interaction paradigms.  

flow
sv_06
ftux_mobile
sv_02
sv_01
in-game

In-game mobile shots*

VR Interaction & UI

All UI would surface relative to the user along with various notification types and modals, using Z-depth to layer elements. The menu was accessed through the wrist HUD that also allowed for quick access to the most important controls. Wrist HUD controls changed contextually based on the user's location. Once surfaced the menu would lazy follow the user's body-centric position, spawning at a comfortable position based on head height. 

SV_VR_04
SV_VR_combined
Wrist_UI
FTUX_VR_PROTO

Playtesting

We held weekly playtest sessions to collect feedback around usability, bugs, and newly implemented features. Participants tested on various device models across iOS, Android along with the Quest 2. Working with product management and QA we prioritized what to tackle for upcoming sprints and builds. 

Playtest

User Survey

We reached 10k app sign-ups in our first week and captured great feedback through discord, Twitter, and an email survey. We collected information around demographic information, usability issues, bugs, and existing/new feature desirability. 

in-game

Cross-Platform Design System

Transitioning to Figma, I rebuilt/restyled existing components and added more as we flushed out product features. The system included standardizing fonts, colors, and icons as foundational elements. All components used Figma's variant feature to quickly swap between elements and states. I build in default, hover, pressed, and selected states that would transition the mobile system to a responsive VR system allowing for visual feedback. 

As the team got more comfortable with Figma, I helped to foster collaboration between each department and create a central space for us to work.  I built out marketing and brand projects where we collaborated on websites, emails, brand collateral, in-world/game collateral among other deliverables. 

Screen-Shot-2021-09-27-at-9.20.07-PM
Screen-Shot-2021-09-27-at-9.24.08-PM

Version 2 Release

After launch, we refactored our UI in Unity and decided to give a visual lift to the whole interface. Our goal was to create a universal interface that worked naturally in landscape on mobile and felt more native to VR. We also wanted to utilize our 3D assets as interface elements, as seen in the onboarding flow and the NFT PFP authentication flow. 

sv_04-1
sv_04-2
sv

Spaces & In-game Collateral

Our "Metaverse" platform contained various locations that users could visit, hang out in, shop, and attend music experiences. I designed spaces and artifacts throughout the environments, including interactable 3D elements, gallery walls, and branded posters. Below are some elements found throughout our Center Stage & Stageverse Stadium locations. 

CS_2
CS_3
CS_1
pass_w_motion_blur_2
In-app_renders_kiosk
ello-optimized-bbab35db
ello-optimized-84cd64c8

Community Concept Spaces

Brand & Marketing

Logo & Wordmark

I collaborated with the CEO to rebrand the company before our public beta launch. We explored dozens of logo variations, wordmark lockups, and color palettes. I built elements in 3D to see how the brand would translate to in-world collateral. After various rounds of stakeholder feedback, iteration, and testing, I codified the brand elements into a brand book to be used by the marketing team and partners. 

brand_01
brand_04
brand
brand_03
brand_02-1
brand_book

Marketing Website 

Along with the new brand I was responsible for designing our new marketing site for launch. This also included a Muse event page that was to drive their fan base to download our app for a virtual concert experience hosted by Stageverse. We focused on showcasing our events, locations, NFT drops, and NFT club memberships.

sv_web_.75-2
sv_web_.75-1

NFT Land Map & Mint Website 

As part of the NFT community we made "digital land" available in the form of a limited land sale. Users could host events, socialize and showcase their artwork in galleries. We also designed a bespoke "mint" site that allowed for the purchase of these properties using authenticated crypto wallets. 

aaaa
asdadasdsad

Stage: MetaverseProduct Design, Branding, XR

Samsung: FitnessProduct Design

Samsung: Smart DevicesProduct Design, XR

Magic Leap: CreateProduct Design, XR

Apple: XR Presentation ToolProduct Design, XR

Amazon: XR ShoppingProduct Design, XR

3D Playground3D, Concept, Illustration

Loved: FinanceProduct Design, Branding

Float: CBT TherapyProduct Design, Branding

Miavina: IoT WineProduct Design, Branding, Industrial Design

Tudor Ice CompanyProduct Design, Branding

Dwell Smart HomeProduct Design, Branding, Industrial Design

CONTACT

1 561 574 5204 |  hello@lastlauf.com

FIND ME HERE

Instagram    LinkedIn   Twitter   Giphy

© 2024 MIKE LAUFBAHN

All rights reserved

Back to top Arrow