Three.js + Cannon.js

 

About   |   Features   |   Technologies   |   Requirements   |   Starting   |   License   |   Author

🎯 About

Website using 3D graphics and physics libraries. The scene contains 3D letters with collision and dodecahedron figures, also with collision. The figures move after the cursor. There is also a slight camera movement when moving the cursor. There are small settings for changing some parameters.

✨ Features

✔️ Movement of figures following the cursor;
✔️ Camera movement when moving cursor;
✔️ Changing text, figure material and environment map.

🚀 Technologies

The following tools were used in this project:

• Vue
• VueUse
• Pinia
• Vite
• Vue-router
• TroisJS
• Cannon-es
• Lodash.debounce
• Three.js

✅ Requirements

Before starting 🏁, you need to have Git and Node installed.

🏁 Starting

# Clone this project
$ git clone https://github.com/matmon12/physic-3d

# Access
$ cd physic-3d

# Install dependencies
$ npm install

# Run the project
$ npm run dev

# Compiles and minifies for production
$ npm run build

Vue 3 + Vite

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 <script setup> SFCs, check out the script setup docs to learn more.

Recommended IDE Setup

• VS Code + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

📝 License

This project is under license from MIT. For more details, see the LICENSE file.

Made with ❤️ by Matmon

 

Back to top