My School Explorer

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 browser-based 3D exploratory campus game titled "My School Explorer" (author blurb: "Mydreamschoo1") using Three.js or an equivalent WebGL engine. The game is a walkable exterior school preview rather than an action game: no enemies, combat, inventory, health, timer, or score. Use a simple low-poly/block-model visual style with soft ambient lighting, a pale blue sky background, fog in the distance, muted white/blue school buildings, green grass, tan paving, and a dark translucent canvas HUD.

Start in a full-screen title/menu overlay while the 3D campus is visible behind it from an elevated front-facing view. Show large white text "MY SCHOOL EXPLORER", the subtitle "Provisional interactive exterior preview", a centered "SELECT CHARACTER" heading, and three selectable horizontal character buttons: "Boy student", "Girl student", and "Teacher". The selected button is bright cyan-blue and the others are translucent gray. Provide a large blue "PLAY / EXPLORE SCHOOL" button and the instruction line: "Touch left to move • drag right to look • E interact • M destinations". Boy student is selected initially. Clicking/tapping a character changes the avatar appearance, and clicking Play or pressing Enter starts exploration.

Build the campus on a broad rectangular grass ground with a front soil strip, a centered tan central path running toward the school, and narrower concrete walks on the far left and right. The main school is an H-like arrangement: two long parallel two-storey rectangular blocks, one on the west/left and one on the east/right, each with white lower and upper sections, a pale blue horizontal band between floors, a thin dark gray roof, and repeated narrow translucent blue windows along both long sides on both floors. Connect the blocks at the center with a one-storey transparent blue-glass connector, with a thin glass roof and simple white front/back wall hints.

At the front center of the connector, create a dark blue double entrance door approached by exactly five broad concrete steps. Place a floating white sign reading "MAIN ENTRANCE" above it. The entrance is an interactable door: when the player is close and presses E, it toggles open/closed by rotating about 90 degrees around the Y axis. Add a small rooftop garden on the connector, with a rectangular soil bed, green top surface, and dark blue railing around it; include a floating "ROOFTOP GARDEN" label. The garden railing should visually be tall and roughly 7 world units high. Add thin dark metal drainage pipes near the four outer corners of the main school blocks.

At the front/far end of the central path, add a dark metal two-leaf gate with two posts and a floating "FRONT GATE" label. It may be visible as a boundary feature, but do not require a separate gate collision or opening mechanic. Line the central approach with two rows of stylized fir trees: brown cylindrical trunks and stacked green conical foliage, five trees on each side.

Add a separate one-storey rectangular gymnasium on the left/front side of the campus, with white walls, a pale blue upper band, dark roof, dark blue door, and three blue translucent windows. Label it "GYMNASIUM" and make it an information point. On the right/middle side, create a fenced football field with artificial green grass, white center and side markings, a white goal at each end, and dark metal fencing along both ends and both sides. Label it "FOOTBALL FIELD" and make it an information point. Include a few simple distant rectangular buildings behind/around the campus as secondary scenery, alternating white and blue and partially softened by fog.

Along the central school corridor, create four provisional dark blue room doors on each side, for eight total. Put them at regular intervals and label them with floating identifiers: west side "R-W-01" through "R-W-04" and east side "R-E-01" through "R-E-04". Each room door is an interactable door that toggles open/closed on E, and each room identifier is also a destination and information point. The information text should make clear that these are provisional room identifiers and can later be replaced with verified room numbers and purposes.

Use a simple stylized humanoid avatar controlled in the world. It has a box torso, black lower-body/legs, spherical head, and school-like clothing. Boy student wears a small black tie, Girl student wears a small black bow, and Teacher has a dark blue torso/jacket with a white lapel. Spawn the avatar near the front gate at the end of the central path. Use a third-person follow camera by default, with a first-person mode also supported. The third-person camera follows from behind and above the avatar; first person places the camera around head height. Allow keyboard movement with WASD or arrow keys. Allow touch controls: dragging/holding on the left side acts as a virtual movement stick, while dragging on the right side rotates the view. Smoothly interpolate yaw/pitch and clamp vertical look. Keep the player inside the campus bounds and prevent movement through the main solid building blocks and other solid colliders.

Support keyboard shortcuts: E interacts with the nearest door or information point within about 3 world units; 1 switches to first-person; 3 switches to third-person; M opens/closes the destination panel. When E is used near an information point, show a dark translucent information panel with the point's title and descriptive text, plus "Tap the panel to close". Information points should include Main entrance, Connector rooftop garden, Gymnasium, Football field, and the room destinations. Door interaction should prioritize the nearest nearby interactable.

The in-game HUD should remain a canvas-style overlay. At the upper left show a dark translucent panel containing "MY SCHOOL EXPLORER", the selected character name followed by either "first person" or "third person", and "E interact · M destinations". Add a translucent circular movement-control visual at lower left and a circular "CAM" control at lower right. The destination panel is a large dark translucent overlay titled "SELECT DESTINATION" and lists all eight room IDs vertically; tapping a listed room selects it, closes the panel, and makes the avatar automatically move toward that room's provisional location. When the avatar reaches the selected destination, show its information panel and clear the active destination. Include the instruction "Tap a provisional room label to set a navigation target" at the bottom of the destination panel. Use white/light-blue HUD typography and preserve the clean prototype/exterior-preview feel shown in the reference.