Skip to main content
Spatial Mobile Design Audit
UX DesignVisual DesignProduct Concept

Spatial Mobile Design Audit

Allowing Spatial mobile users direct access to search and view friends in app.

Sole Designer · Spatial · Oct - Dec 2022 · 2022

Overview

Spatial.io is an immersive collaboration platform designed for creating games and spaces. However, the mobile app significantly lagged behind its desktop counterpart, missing several essential features. The mobile interface felt outdated, and user engagement was low, with users forced to rely on the mobile browser to add and view friends — something that could be done intuitively on the desktop app.

To address this disparity, I took on the task of redesigning Spatial's mobile app, specifically integrating an "Add Friends" feature and improving the ability to view friends directly within the app. As part of this redesign, I also introduced a dark mode to create visual consistency across platforms. My role as the sole designer gave me full control of the user experience and interface, allowing me to iterate quickly and deliver a solution that drastically improved mobile engagement.

Problem

Spatial's mobile interface is outdated.

Limiting Spatial's potential for cross-platform adoption.

The current user interface of the Spatial Mobile App requires users to be redirected to the website through their mobile browser to view, add, and search for friends, instead of allowing these actions to be performed directly within the app (Figure 1.0). This resulted in a fragmented user experience that was contributing to Spatial's mobile engagement being low.

1.0 Current mobile view friends user flow — Video Loop

Desktop Information Architecture

Viewing & adding friends are able to be done intuitively in the desktop application through a clear integrated experience (Figure 1.1 & 1.2).

1.1 Desktop view friends user flow — Video Loop

1.2 Desktop add friends user flow — Video Loop

Research

Putting the pieces together.

As the sole designer and researcher alongside a strict project timeline, I had limited access to formal user research methods. I leveraged the following resources:

  • Existing user feedback from app reviews and internal analytics, which highlighted the frustration around mobile navigation (Figure 2.0).
  • Insights from my mentor, Jimmy, who had comprehensive knowledge of the platform's user base and challenges.
  • I also conducted a design audit, looking at how other platforms handle social features in a mobile context.
Community Reviews

2.0 Community Reviews — Image

Final Designs

An effortless, engaging experience.

Seamless information architecture.

I focused on incorporating two key features from the desktop version into the mobile app: the ability to send and receive friend requests and view user profiles. I optimized user flow and minimized unnecessary actions, ensuring a seamless and cohesive experience across all of Spatial's platforms (Figure 3.0).

I designed and prototyped these features to ensure a seamless and intuitive experience on mobile.

Optimized user flow

3.0 Optimized user flow — Image

Send & Receive friend requests

Taking from Spatial's desktop application, I added the people page to the explore section of the app. Here, users can toggle search between both spaces and people. Moreover, this is where all incoming requests are consolidated (Figure 3.1).

3.1 Send & Receive friend requests — Video Loop

View Friends

Now, you're able to view friends profiles within the mobile application instead of being redirected to the website (Figure 3.2).

3.2 View Friends — Video Loop

Visual Design — Mobile Dark Mode

Spatial's mobile app does not have a dark mode, while the desktop app operated exclusively in dark mode. To address this inconsistency and enhance user experience across platforms, I designed and implemented a dark mode for the mobile app (Figure 3.3).

3.3 Mobile Dark Mode — Video Loop

Retrospective

Putting things into perspective.

Nice one!

After several rounds of usability testing, I reduced user friction by 80%. I also was able to inform the design decisions of upcoming efforts to update the mobile application.

I conducted this design audit in parallel with my main project of the internship, which was to rework the mobile in-game chat interface.

What I learned:

Leveraging my resources — Working without the luxury of a research team, I had to draw connections with what was available to me. Ultimately, allowing me to gain new perspectives and approaches to collecting qualitative research.

User friction can actually be beneficial — Although this project's intention was to reduce user friction, I became aware of multiple cases where an added step could lead to less user errors or prevent players from cancelling subscriptions.

Building a design system — Being able to apprentice Spatial's design team, I was able to learn how to leverage and craft a centralized design system to build out new features and projects.