3D Viewer Web App

A minimalist web application for viewing 3D models in your browser. Upload and visualize OBJ, STL, GLTF, and GLB files with an intuitive interface.

Features

• 🎨 Minimalist Design - Clean, modern interface focused on your 3D models
• 📁 Multiple Format Support - Works with OBJ, STL, GLTF, and GLB files
• 🖱️ Interactive Controls - Rotate, zoom, and pan around your models
• 🔗 Model Sharing - Upload and share models with a single link via Vercel Blob storage
• 🚀 No Installation Required - Runs directly in your browser
• 📱 Responsive - Works on desktop and mobile devices

Usage

1. Click the "Upload 3D File" button
2. Select a 3D model file (OBJ, STL, GLTF, or GLB)
3. Interact with your model:
   • Rotate: Left click and drag
   • Zoom: Scroll wheel
   • Pan: Right click and drag
4. Click "Share Model" to get a shareable link
5. Anyone with the link can view your model directly!

You can also drag and drop files directly onto the page!

Deployment to Vercel

Quick Deploy

1. Go to vercel.com and sign in
2. Click "Add New Project"
3. Import your Git repository
4. Click "Deploy"

Enable Model Sharing (Important!)

To enable the sharing feature, you must set up Vercel Blob storage:

1. After deployment, go to your project dashboard
2. Click the "Storage" tab
3. Click "Create Database" → Select "Blob"
4. Name it (e.g., "3d-models-storage")
5. Click "Connect to Project" and select your 3D Viewer project

That's it! The sharing feature will now work automatically.

📖 Detailed setup instructions: See SETUP.md

Local Development

npm install
vercel dev

Local Development

Simply open index.html in a web browser, or use a local server:

# Using Python 3
python -m http.server 8000

# Using Node.js
npx serve

Then open http://localhost:8000 in your browser.

Technologies Used

• Three.js - 3D graphics library
• Vanilla JavaScript - No framework dependencies
• HTML5 & CSS3 - Modern web standards

Supported File Formats

• OBJ - Wavefront 3D Object File
• STL - Stereolithography File
• GLTF - GL Transmission Format (text-based)
• GLB - GL Transmission Format (binary)

Browser Compatibility

Works on all modern browsers that support WebGL:

• Chrome/Edge (recommended)
• Firefox
• Safari
• Opera

License

Free to use and modify as needed.