Joy Wu / Product Design
Interactive Case Study2026

Product Design · Social Gaming

Game Room
& Social Play

A room-based social experience that turns solo live gaming into a shared space for inviting, joining, watching, and playing together.

RoleProduct Designer
ScopeUX / Interaction
PlatformMobile Web

I designed a social layer around the existing game — not a separate product.

The system connects room creation, invitations, room discovery, host controls, room switching, and viewer interactions while keeping the live game at the center.

01 · Interaction Architecture

The system behind
the room experience.

I mapped the room system across discovery, creation, host management, and viewer behavior. The original source artifact was in Chinese, so this portfolio version rebuilds the same logic in English rather than showing the internal document directly.

Click any highlighted interaction to jump directly into the matching state in the prototype below.

Lane 01Entry & Discovery
Lane 02Room Creation
Lane 03Host Experience
Lane 04Member / Viewer
PUBLIC ENTRY Room link in global chat

Public-room invitations can surface in the global chat and popular-room list.

DIRECT ENTRY Player invitation

Players may also receive direct invitations from account search.

DISCOVERY Popular Rooms

Browse active public and private rooms.

PREVIEW Review room details

Host, room type, and current player count.

Try in prototype →
JOIN Confirm room entry

Switch into the selected room.

Try in prototype →
EXTERNAL USER Login / registration

External room links can route new players to authentication first.

START Enable Game Room

Create a room without leaving the live game.

Try in prototype →
ROOM TYPE Public Room

Large-group, host-led social room with discovery and mic interactions.

Try in prototype →
ROOM TYPE Private Room

Smaller friend-based room with direct invites and player-view switching.

Try in prototype →
INVITE Search players

Find a player by name and send a room invitation.

SHARE Copy room link

Share a room entry point with other players.

STATUS Room active

Online players and room state remain visible in the game.

CONTROL CENTER Room management

Keep host actions one layer away from the live game.

Try in prototype →
REQUESTS Approve / reject joins

Review incoming room applications.

Try in prototype →
PLAYERS Online player list

See who is currently inside the room.

PUBLIC ROOM Mic requests

Viewers can request to join the live mic interaction.

HOST INVITE Mic invitation

Host mic invitations expire if not accepted in time.

ROOM LINK Share from host view

The host can copy and distribute the active room link.

PRIVATE ROOM Tap a player avatar

View another room member's betting state.

Try in prototype →
PUBLIC ROOM Watch the host

Switch between the host's game and your own betting interface.

Try in prototype →
RETURN Back to my game

Tap your own avatar to return to your personal view.

ROOM SWITCH Move to another room

An approved request can redirect the player into a different room.

EDGE CASE Invitation expires

If the host closes the room, existing invitations become invalid.

EDGE CASE Multiple requests

Room requests resolve by entry order and room-state changes.

Public Room Private Room Host Member / Viewer Edge Cases

Portfolio adaptation of the original product flow: detailed internal labels have been condensed for readability, while the room types, invitation paths, host controls, player-view switching, and documented room-state rules are preserved.

02 · Key Journey

One clear path
through the system.

The architecture is detailed, but the player-facing journey stays straightforward: create a room, invite or discover people, join, manage the shared space, and switch between player views.

01

Create

Open a public or private room from the game.

02

Invite

Use room links, search, or invitation notifications.

03

Join

Preview room information and confirm entry.

04

Manage

Handle requests and room activity without leaving gameplay.

05

Watch

Switch between your own game and other player views.

03 · Interactive Prototype

Try the room experience.

The prototype is connected to the architecture above. Click a highlighted map node or use the task list to jump into the matching interaction state.

Create Room Public / Private Invite Join Host Management Viewer Switch
Prototype controls are active
←
👤 wwwwww***
₱ 888,888
29 online
Viewing your game

Game Room

Enable Game RoomCreate your own room and play together
M
Monica2025invited you to a Public Room · 20/100
V
Victor2025invited you to a Private Room · 2/10

Create Game Room

Choose the room type that fits the social setting. Public Rooms are open to more players, while Private Rooms are designed for smaller groups.

M
Monica2025LV88 · Online
V
Victor2025LV45 · Online

Confirm Room Entry

Monica2025 's Room
TypePublic Room
Players20/100

Joining another room will switch your current room state.

Host Management

Z
ZackxxxxLV31 · requested to join
S
StarPlayerLV28 · requested to join
L
LemonCatLV25 · requested to join
Done

Outcome

From betting alone
to playing together.

The case study now shows the complete design story in one language: the underlying interaction architecture, the simplified core journey, and the working prototype that demonstrates the key room states.