🚁 My Projects 🌌

An interactive 3D project showcasing web application inspired by Bruno Simon’s legendary site. Drive a drone through space, discover planets, and explore project showcases in a playful, immersive world.

🔥 Live Demo: (You’ll link this after deployment)
🛠️ Built using: Three.js, OrbitControls, GLTFLoader, CanvasTexture, WebGL, Vite

---

✨ Features

• 🎮 Drive a Quadcopter Drone using WASD / QE
• 🌍 Explore a 3D Solar System
• 💡 Glow effects + Project Info Screens when near planets
• 💬 Special Dedication: "❤️ Moti" appears above the Sun
• 🧠 Intelligent Camera: Follows drone by default, lets you orbit freely
• 🖥️ Optimized for WebGL-powered browsers

---

🧱 Project Structure

drone-portfolio-3d/
├── assets/
│   ├── drone/                # 3D Drone model (.glb)
│   ├── planets/              # Solar system model (.glb)
│   └── skybox/               # Skybox textures (right.png, left.png, etc.)
├── public/                   # For favicon or custom fonts (if needed)
├── index.html                # Main HTML entry
├── app.js                    # Three.js scene setup and logic
├── styles.css                # (Optional) Styles if needed
├── README.md                 # This file
└── vite.config.js            # Vite config for fast dev server

---

🎮 Controls

Key	Action
W / S	Move Forward / Backward
A / D	Move Left / Right
Q / E	Rotate Left / Right
Mouse	Rotate Camera
Scroll	Zoom In / Out

---

🚀 Getting Started

1. 📦 Clone the Repository

git clone https://github.com/divyesh1099/myprojects.git
cd myprojects

2. 📁 Place Your Assets

Put the following files in ./assets/:

• 🛸 Drone GLB in assets/drone/
• 🌍 Planets GLB in assets/planets/
• 🌌 Skybox Textures in assets/skybox/
  (Include: right.png, left.png, top.png, bottom.png, front.png, back.png)

3. 🧱 Install Dependencies

npm install

If using Vite, you can add it with:

npm install vite

4. 🧪 Run the Dev Server

npx vite

Now open: http://localhost:5173

---

🌍 Deployment Guide

Option 1: Vercel (Recommended)

1. Go to vercel.com
2. Connect your GitHub repo
3. Set Framework = Vanilla
4. Set Output Directory = dist
5. Click Deploy

---

Option 2: GitHub Pages

1. Build the project:

npm run build

2. Install gh-pages if not already:

npm install gh-pages --save-dev

3. Update package.json:

"homepage": "https://your-username.github.io/drone-portfolio-3d",
"scripts": {
  "predeploy": "npm run build",
  "deploy": "gh-pages -d dist"
}

4. Deploy:

npm run deploy

---

🎨 Credits

• Models from Sketchfab
• Inspired by Bruno Simon’s portfolio
• Fonts: Three.js Font Loader
• Space Skybox: Poly Haven

---

❤️ Special Thanks

Dedicated to Moti – for being the light of this universe 🌞

---

📬 Contact

Divyesh Vishwakarma
🌐 divyeshvishwakarma.com
🐙 github.com/divyesh1099