Revamping in-line sign up for metaverse gaming

SPATIAL / SUMMER '23

Context

Spatial is a multi-platform metaverse gaming company (web, mobile, VR) that recently pivoted away from hosting NFT galleries and meeting spaces.

I led the end-to-end lifecycle strategy for new users, designing new sign up triggers, developing a new content strategy for day 7 retention, and building it completion!

Team

1 Product Designer (me)
1 Developer (also me)

1 Design Manager
2 Engineering Leads

Timeline

1.5 months

Constraints

Outdated user research due to recent pivot

Tight timeline for both design & development

The Problem – Capturing Sign Ups

Approximately 40% of Spatial’s monthly active users are not authenticated. However, day 7 retention for users who aren’t signed in is 20x lower than those who are signed in.

Identifying design challenges by analyzing competitors

Given that Spatial was pivoting into a new industry, I wanted to gain a stronger understanding of the typical gamer lifecycle experience before defining each feature of this project.

Growth strategies

🥾 Foot-in-the-door & sunk cost carries users to completion

🥽️ Immersive copy and visual design builds excitement

🏆 Highlight rewards and incentives to motivate action

UX Audit Time – Sticky Notes Galore!

Referencing the mechanisms that helped gaming platforms stand out, I audited Spatial's sign up prompts, sign-up experience, and post-play communications.

Mapping out Spatial's end to end user flow and some colourful feedback to go with it

Prompt, Sign Up, Remind – a framework for auditing Spatial's challenges

Remind

❌

Content strategy should be specific to user history.

Prompt

❌

Users are taken to a tutorial space instead of returning to game

Spatial's sign up prompt being triggered by low-value actions, e.g. chat, liking etc

The tutorial space that everyone gets redirected to when they try to sign up

A Spatial promotional email that could use a little TLC

Design Challenge #1

How might we make sign up prompts discoverable and compelling in-game?

Tying sign up prompts to game progress to increase the value of signing up

Spatial's previous sign up prompts were largely triggered by legacy features or features currently lacking engagement, e.g. liking a space, chatting. This meant that sign up was either undiscoverable or non-critical.

I focused on tying sign up prompts to game-related triggers as users would have experienced the game and a potential sunk cost by then.

Trigger 3: Quest Completion

(credits to Jimmy for this sick quest animation!!)

Trigger 1: Item Collection

Trigger 2: Time in Game

This acted as a failsafe for legacy spaces without game features

Ideating on the prompt

Nudging vs Disrupting

I went with a less intrusive approach to prioritize the player experience. I wanted to allow players to see the sign up banner as a gentle reminder rather than a game-ending annoyance.

Don’t lose your progress! Create your account to save

✅

Discreet and unlikely to cover critical game elements

❌

Easier to ignore or immediately dismiss

✅

Highly noticable and provides room for more compelling copy/visuals

❌

Could result in frustration by interfering with gameplay

❌

Can cover up important game elements

Static vs Animated Content

When it came to the content and layout of the prompt, it came down to robustness, grabbing attention, and communicating value.

Don’t lose your progress! Create your account to save

A banner with a static asset and copy that focuses on sunk cost

Banner with dynamic assets and avoiding fear-oriented copy

Save your progress by creating an account or logging in

Visually bold banner with assets that may struggle against certain spaces' content

Design Challenge #2

How might we make sign up both fun & exciting?

Reducing the friction to sign up – or at least the illusion of it 👀

One of the biggest issues with Spatial's existing sign up flow was the lack of continuity while signing up. To fix this, whenever a user signs up in-game, they are immediately redirected back to their game.

I wanted users to feel like when they chose to sign up, it would be swift and easy rather than long and confusing,

The red frames are those that were non-modifiable by engineering specifications

We ran into a tricky challenge where I discovered that loading our Unity game without fully onboarding the user first was challenging. As a clever trick, I used the background of the game in the onboarding screen to preserve continuity.

Iterating – from solid to shnazzy ✨

Stress testing – handling edge cases & optimizing for Spatial's games

With a new pivot towards gaming, Spatial was moving towards a less intrusive transparent UI in its spaces. I wanted to confirm that this new approach would be accessible and make sense visually in the vast majority of cases.

Testing against Spatial's Games

Spatial's racing game called Racing Empire

Spatial's platformer called infinite ascent

Edge Cases

Testing against potentially darker user-generated thumbnails

Testing for accessibility against lighter user-generated thumbnails

Using code to empower better design – building a Figma Plugin!

Throughout the design process, given Spatial's focus on content fidelity in our mocks, a significant amount of time was spent searching for thumbnails, space descriptions, and space names.

Aggregating needs from our team

I wanted to identify the most meaningful use cases and scenarios where these thumbnails were required. What properties differentiated spaces that mattered and didn't?

The working prototype – search, copy, and insert to your delight

Copying the description of a Spatial game

Searching for a space

Design Challenge #3

How might we remind users to come back to Spatial without introducing new game mechanisms?

When it came to the content strategy of this project, this involved creating:

Content Map
Notification Messaging
Email Design & Messaging
Assets & Imagery

Content mapping – taking an end to end approach

A core principle was that content should be dynamic to the user and their journey. To achieve this, I mapped out the various in-space experiences users could have, breaking down our day 7 content strategy into context, destination, content.

Prioritizing content for game features & Spatial's games

Given that the pivot into game-focused content was recent, to help strengthen that pivot and focus into our new audience, I began developing content for two destinations:

Spatial's games
Completing previous quests

Putting content in context

To understand the effectiveness of our new content and content designs, for each part of the content map I tested it against the contexts they would be displayed in.

Metrics for the future

While my code wasn't fully deployed by the time my internship ended, I defined key metrics to log and analyze in the future, along with potential tests to run as the revamp launched.

Prompt

A/B test banner timing

Clickthrough rate of various banner triggers

A/B test copy for notification ask

Remind

Notification acceptance rate

Day 7 retention

Reflections

👩‍💻

Being fullstack allows you to spot and mitigate issues early

Throughout this project, having context on the API calls we had to make, the information these required allowed me better cater our user flows and animations to these constraints and mitigate load times.

🖼

Illustrate the options whenever possible

Discussing ideas with words often leaves a lot of room for misunderstanding and makes it difficult for people to visualize an inherently visual decisions. Creating even simple low-fidelity mocks aligns everyone significantly.

📝

Content fidelity should be high even if visual fidelity isn’t

When working in context of user-generated content and a dynamic content system, context fidelity is important for understanding whether my designs would hold up against different copy, game backgrounds, usernames etc!

Next up ->

Overhauling a Content Management System for Moneris