Model Viewer

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.

Create a browser-based 3D model viewer titled “Model Viewer,” not an action game. Render a full-window Three.js scene against a black background with antialiasing and device-pixel-ratio capped at 2. Use an overlaid monospace white status panel in the upper-left, with a semi-transparent black background and about 10px padding. Initially show “Loading model from zip...”, then update the status through the loading process: “Fetching zip...”, a line beginning “Files extracted:” listing the extracted archive files, “Loading MTL...”, “Loading OBJ...”, and finally “Model loaded! Size: X x Y x Z” with the three bounding-box dimensions formatted to two decimals; on failure show “ERROR: <message>”.

On startup fetch and unzip the bundled asset archive at assets/144e86a1_0e17_4dfa_bbb1_8651f1.zip using JSZip. The archive contains an OBJ named 421fdf880fdc3ef89703e4b422b67f68.obj, material.mtl, and four PBR image textures: texture_pbr_20250901.png, texture_pbr_20250901_metallic.png, texture_pbr_20250901_roughness.png, and texture_pbr_20250901_normal.png. Create blob URLs for extracted files. Load material.mtl with MTLLoader, preload its materials, and ensure the material’s color map, normal map, metalness map, and roughness map use the corresponding extracted blob texture URLs, with texture flipY disabled. Then load the OBJ using OBJLoader configured with those materials.

After loading, calculate the model’s Box3 bounds, translate it so its bounding-box center is at the origin, and uniformly scale it so its largest dimension is 4 world units. Add it to the scene. Use a perspective camera with 60-degree field of view, near 0.1 and far 1000, initially positioned at (0, 3, 8), looking toward (0, 1, 0). Set OrbitControls’ target to (0, 1, 0), enable damping, and allow the user to orbit, pan, and zoom the loaded model interactively with the mouse/touch controls. Add a white ambient light at intensity 0.6 and a white directional light at intensity 1.2 positioned at (5, 10, 5), so the model’s PBR surface is visibly illuminated. Continuously update the controls and render the scene each animation frame. Update camera projection and renderer size on window resize. Keep the presentation minimal: black void background, centered textured 3D asset, and only the small loading/status overlay in the upper-left; there is no score, avatar, combat, level progression, or other game HUD.