Player Profile
Rec Room’s original UI system— which we called the “Fisher-Price style” internally because of its large, colorful 3D buttons— was primarily designed for VR players only. When Rec Room made the jump to mobile and console platforms, a new UI system was needed.
This second system, called RRUI, also took advantage of prefabs and modularity, allowing for faster iteration, deeper integration of coded behavior, and easier setup. This project, my first at Rec Room, was a crash course in RRUI; within my first month I had mastered the system and was implementing layouts directly in Unity alongside my engineer collaborator.
The Player Profile is one of the most important screens in all of Rec Room; both a locus of player identity and a functional toolkit for social play and moderation. As such, we took a “do no harm” approach, using data to make sure not only were we improving the behaviors we were targeting, but also making sure nothing important was left behind.
I handled the system and interface design for this feature.
The Original menu
The original Rec Room Player Profile had been assembled by lots of teams independently adding features, leading to an awkward and unfocused keypad-style design.
My goal for the rework was to turn the player profile into a tool to make friends and encourage social interaction. To do that, three elements seemed crucial:
Center the profile around the player’s customized 3D avatar.
Prioritize pro-social interactions like Add Friend or Send Message clearly.
Add hooks to encourage synchronous social play.
The final design was achieved both from initial design and through live experimentation. This feature was one of the first projects at Rec Room to use detailed A/B testing— the process and results of which you can read about in this case study.
The Update - Remote View
In the update, a live animated player avatar greets the viewer immediately. The layout of the profile subtly shifts as players connect with each other— strangers are pushed to “ADD FRIEND” as the primary action of the profile; once friended, the button’s focus shifts to “MESSAGE” their friend to maintain their connection.
Features are grouped by function:
Moderation actions like MUTE or BLOCK are located clearly in red at the top of the banner.
Location-based features like INVITE (bring player to you) or GO TO (travel to player) are paired with a new banner that previews their current location in-game, adding extra discovery to the Profile.
Communication features live at the bottom of the banner, anchored to the primary button.
Additional clarity is added for player online status via the online status indicator dot on the level badge, and from the player location banner.
Likewise, the addition of emojis, pride badges, and pronouns allow an additional level of player expression, key to building meaningful social connections in game.
Finally, to address a prior ambiguity around the block state in the original design, a clear “Blocked” state is in place to make sure players don’t see any details from players they don’t want to associate with.
The Update - Local profile
When a player views their own profile— internally called the Local Profile— they view a special layout that allows them to set their privacy status, customize their profile, and set their avatar’s current outfit. Because key landmarks of the profile banner are retained between the Remote and Local profiles, players can be sure of how the changes they make to their profile will appear to other players.