https://github.com/shahramshakiba/threejs-portfolio

🚧 Under Maintenance | (⚪THREE.JS)
https://github.com/shahramshakiba/threejs-portfolio

threejs

Last synced: 2 days ago
JSON representation

🚧 Under Maintenance | (⚪THREE.JS)

• Host: GitHub
• URL: https://github.com/shahramshakiba/threejs-portfolio
• Owner: ShahramShakiba
• Created: 2024-05-20T07:27:20.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2024-05-23T09:26:16.000Z (6 months ago)
• Last Synced: 2024-05-23T09:37:04.326Z (6 months ago)
• Topics: threejs
• Language: JavaScript
• Homepage:
• Size: 3.44 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
#    _Three.js Portfolio_     

###   _Description_

> To begin with, it is important to note that, this project have been sourced from an exceptional Three.js Bootcamp: Zero to Mastery Course. 


 

> 👤 Instructed by a _proficient_ and _expert educator_, ` "Jesse Zhou". ` 

 


 

### 🧩 _Three.js_ is a JavaScript library that is primarily used for creating 3D computer graphics in a web browser.

- #### _It provides a wide range of tools and functionalities for developers to build interactive 3D experiences on the web, ranging from simple animations to complex visualizations._

  


 
  



###    _Three.js Portfolio_    

#### 🧩 For this project, the focus is on creating an interactive experience where users can engage by moving a _Character_ within the 3D environment.

- By combining these technologies, the project aims to showcase the capabilities of Three.js for creating immersive web experiences. 



> [!IMPORTANT]

>> - It is crucial to grasp that the project incorporates _"Three.js"_, _"Vite"_ and _"Vanilla JavaScript"_ to build a visually impressive 3D portfolio.

>> - I developed the Environment for this project using _"Blender"_ from the ground up.





> _Which Concepts Have I Covered_: 

##### _Developing classes to encapsulate different components of our code._

##### _Utilizing the "Zustand" state management library._

##### _Designing a preloader progress bar to enhance the initial user engagement impact._

##### _Using "Rapier" for simulating physical interactions in simulations._

##### _Creating physics helper functions to auto compute dimensions._

##### _Setting Absolute Position._

##### _Utilizing a first-person camera for interactions._

##### _Developing a digital representation (Avatar) of my own identity._

##### _Incorporating Mixamo animations into my avatar._

##### _Developing an input controller for utilizing arrow keys._

##### _Moving Dynamic Bodies_

##### _Building a 3D environment using "Blender" from the ground up._

##### _Integrating shadows into the scene._

##### _and various other topics that were covered in my Basic Three.js Course, such as adding a scene, camera, renderer, orbit controls, ambient light, and directional light and so on..._

 







https://github.com/ShahramShakiba/ThreeJS-Portfolio/assets/110089830/c80530a8-84a4-4806-af69-85d60cbf6941

  
 

***

 ##  Find me around the Web