User Guide

Getting Started

Drag and drop a 3D model file onto the page, or click "Browse Files" to select one. You can also click "Try Sample" to load a built-in demo model.

For OBJ files with materials, select both the .obj and .mtl files together (and any texture images). For GLTF files with separate assets, select all companion files.

Supported Formats

• GLTF / GLB — The recommended format. GLB packs everything into one file. GLTF is JSON-based with separate binary and texture files. Draco-compressed meshes are supported.
• OBJ — Wavefront OBJ with optional MTL material files. Select both files when loading.
• FBX — Autodesk FBX format. Supports meshes, materials, and animations.
• STL — Stereolithography format. Geometry only, no materials or textures.

3D Viewport

The left panel shows your model in 3D. Use your mouse or touch to interact:

• Rotate: Left-click drag (or one finger drag on mobile)
• Pan: Right-click drag (or two finger drag)
• Zoom: Scroll wheel (or pinch)

The control bar at the bottom offers toggle buttons:

• Wireframe: Show mesh wireframe overlay
• Grid: Toggle the ground grid
• Axes: Show X/Y/Z axis indicator
• Bounding Box: Show the model's bounding box
• Background: Cycle through dark, gray, light, and transparent backgrounds

Inspector Tabs

Overview

A summary dashboard showing key statistics: vertex count, face count, mesh count, material count, texture count and memory, bone count, animation count and duration, bounding box dimensions, scene hierarchy depth, and file size.

Meshes

A table listing every mesh in the model with its vertex count, face count, material, and attribute availability (normals, UVs, vertex colors). Click a row to highlight that mesh in the 3D viewport.

Materials

A table listing all materials with their properties: type, base color, texture maps, metalness, roughness, and opacity. Each material shows a color swatch preview.

Textures

A grid of all embedded or referenced textures with thumbnails, resolution, format, and estimated memory usage. Click a texture to view it full-size, with an option to save it as a PNG file.

Skeleton & Animations

If the model contains a skeleton, this tab shows the bone hierarchy tree. If there are animations, they're listed with name, duration, track count, and keyframe count. Use the playback controls in the viewport to play animations.

Size Analysis

Visual breakdown of where your file size goes. A pie chart shows the split between geometry, textures, and other data. A bar chart ranks the top 10 largest individual items. Optimization suggestions are provided based on the analysis.

Problems

Automated quality checks that flag potential issues:

• Missing normals on meshes
• Degenerate (zero-area) triangles
• Oversized textures (> 4K resolution)
• Excessive texture memory (> 10 MB per texture)
• Too many meshes (> 50 draw calls)
• Unused materials
• Missing UVs on textured meshes
• Excessive bone count (> 300)

Each issue includes a severity level, description, and suggested fix.

Convert

Export your model to different formats:

• GLB: Single binary file, best for sharing and AR viewing
• GLTF: JSON format with embedded textures
• Analysis Report: Full metadata as a JSON file

All conversion happens locally in your browser using Three.js GLTFExporter.

AR Preview

Click the "AR" button in the header to launch an AR preview. This uses Google's model-viewer web component:

• iOS: Opens AR Quick Look for placing the model in your real environment
• Android: Opens Google Scene Viewer for AR placement
• Desktop: Shows an interactive 3D preview as fallback

Non-GLB formats (OBJ, FBX, STL) are automatically converted to GLB for AR preview.

Tips

• For best compatibility, use GLB format — it's a single file with everything embedded.
• Keep textures at 2048×2048 or lower for web and mobile performance.
• Use Draco compression for geometry-heavy models to reduce file size.
• Merge meshes that share the same material to reduce draw calls.
• Very large models (> 1M faces) may be slow to analyze; consider simplifying first.