Neon Lobby

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Rebuild a playable browser-based 3D multiplayer lobby titled “Neon Lobby.” It is a lobby/chat experience rather than a combat game: the user loads into a dark neon Three.js-style scene, sees their own player plus simulated players, and can chat. Use a full-screen WebGL canvas behind a translucent HTML HUD. The visual style is futuristic cyber-neon: near-black navy background, subtle purple/cyan radial glow, blue-purple outlined glass panels with rounded corners, white/lavender text, cyan and violet accents, and backdrop blur.

3D scene and camera: render a dark navy floor extending into fog, with a fine 60x60-looking glowing grid (blue-violet major/minor lines). Place 18 tall, thin glowing neon cylindrical columns around the central area in a loose circular arrangement, in cyan, blue, purple, and magenta hues; they should be subtly rotated as a group over time. Add a thin luminous violet torus/ring floating horizontally around the center at roughly y=2.6, slowly rotating. Use ambient blue-violet lighting and a soft white directional light, with fog fading the scene into the dark background. Start with an elevated perspective camera looking toward the center, approximately position (7.5, 6.2, 10.5), and allow mouse drag to orbit with damping and mouse wheel to zoom; constrain zoom to a moderate range and prevent the camera from going below the floor. The scene should gently animate continuously.

Represent lobby users in the 3D scene as glowing capsule-shaped avatars arranged evenly around a central circle/ring, facing inward. There can be at most 67 total players including the local user. Use stable per-player colors generated from their IDs; the local user is bright cyan and other avatars are varied neon hues. Keep the avatar arrangement synchronized with the roster, and use efficient instancing or an equivalent approach so all 67 are possible.

HUD layout: put a fixed top bar over the canvas with the “Neon Lobby” brand at left, a small glowing gradient cyan/purple dot, and a status line initially reading “Demo mode — offline.” At the right/top area provide a Username labeled text field (18-character maximum), a wide optional WebSocket URL field with placeholder “wss://your-server.example/lobby,” a primary “Connect” button, and a secondary “Disconnect” button. Include the visible voice controls shown by the interface: a “VOICE OFF” pill, a horizontal mic-level meter initially empty, an “Enable Mic” button, and a disabled “Mute” button. These controls can remain present as UI placeholders if no voice implementation is provided.

Below the top bar, place a two-column translucent panel layout with rounded borders. The left Players panel is about 280px wide and has a header labeled “Players” and a pill showing the current count as “N/67.” List players in rows with the local player first, sorted before others, and show the player name on the left. Show a cyan-outlined “YOU” badge for the local user and a short ID badge for other users. The panel must scroll if needed. On narrow screens switch to a stacked layout with the players panel above the chat panel.

The larger Chat panel should have a “Chat” header and a mode pill that says “DEMO” while offline and “WS” while connected. Show a scrollable log of timestamped messages in dark translucent rounded message cards. Each message displays the sender name, time in HH:MM:SS, and text; system messages use the sender label “SYSTEM.” At the bottom provide a text input with placeholder “Type a message… (Enter to send)” and a Send button. Pressing Enter or clicking Send adds the user’s message immediately to the chat log, clears the field, and in WebSocket mode sends it to the server. Add the visible hint: “Tip: drag to orbit, wheel to zoom. Connect to a WS server when you’re ready.”

Default offline/demo behavior: choose a default local username if none is entered, using a neon-themed name such as NeonFox plus a two-digit suffix, and show the user in the player list. On startup add system messages explaining that this is a lobby UI/chat with a 67-player cap and that a WebSocket URL can be pasted for real-time mode. Simulate other players joining, leaving, and chatting automatically about every 1.2 seconds. Keep the demo population generally around 28–43 players, never exceeding 67 and never dropping below the local player plus a small group. Generate bot names from combinations like VioletRunner, CobaltNinja, PixelHacker, etc., with numeric suffixes. Join/leave events should create SYSTEM messages such as “[name] joined.” or “[name] left.” Bot chat should use short lines such as “Anyone up for a quick match?”, “Lobby feels clean.”, “Ship it.”, “Who’s hosting the server?”, “67 players is oddly specific. I like it.”, “Add emotes next?”, “Voice chat when?”, and similar lobby chatter. Keep up to 120 chat messages and sanitize/limit user names and chat text; render text safely rather than injecting HTML.

Username behavior: normalize names by trimming, allowing only letters, numbers, spaces, underscores, and hyphens, collapsing repeated spaces, and limiting them to 18 characters. Updating the username updates the local roster entry, and in WebSocket mode announces the new name.

Optional networking: the Connect control accepts a WebSocket URL. On connection attempt set the status to “Connecting…,” disable Connect, enable Disconnect, stop demo chatter, then on open show “Connected — [URL]”, switch the chat pill to WS, add “Connected to server.”, and send JSON {type:'hello', id, name}. Support incoming JSON messages with these minimal types: presence {type:'presence', players:[{id,name}]}, join {type:'join', id, name}, leave {type:'leave', id}, and chat {type:'chat', id, name, text}. Presence replaces the non-local roster while retaining the local user and respecting the 67-player cap; join/leave update the roster and add system messages; chat appends a message. On socket error add a helpful error message. On close return to “Demo mode — offline,” switch back to DEMO, restore local demo presence, re-enable demo simulation, and add “Disconnected. Back to demo mode.” Disconnect should close the socket and return to demo mode. If Connect is clicked without a URL, add “Paste a WebSocket URL first (or stay in demo mode).”

Make the result feel like a polished, readable lobby overlay over a slowly animated neon sci-fi social space. There is no score, combat, win condition, inventory, or level progression: the core loop is observing the live roster, orbiting/zooming the camera, and exchanging lobby chat messages, with a clear future path to a real server.”,