https://github.com/shahramshakiba/shadows-p04

Shadows ⁞|⁞ If you're interested in delving into the magic of "Shadows" in a 3D setting, feel free to explore my repository ⁞|⁞ ⚪Three.js
https://github.com/shahramshakiba/shadows-p04

shadows threejs

Last synced: 2 days ago
JSON representation

Shadows ⁞|⁞ If you're interested in delving into the magic of "Shadows" in a 3D setting, feel free to explore my repository ⁞|⁞ ⚪Three.js

• Host: GitHub
• URL: https://github.com/shahramshakiba/shadows-p04
• Owner: ShahramShakiba
• Created: 2024-06-11T13:15:20.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-06-17T18:18:36.000Z (5 months ago)
• Last Synced: 2024-11-16T03:16:12.802Z (2 days ago)
• Topics: shadows, threejs
• Language: JavaScript
• Homepage: https://shadows-shahramshakiba.netlify.app/
• Size: 93.8 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
#    _Shadows_   

###   _Description_

> To begin with, it is important to note that, this project have been sourced from an exceptional `Three.js Journey` Course. 


 

### 👤 Instructed by a _proficient_ and _expert educator_, `  "Bruno Simon"  ` .

 


#### Hey  if you're curious about how ⟪ Shadows ⟫ works in a 3D environment, check out the link below  
 

#### _It's a fun way to get a better understanding of how Shadows behaves in a 3D world.  Enjoy exploring!_ 

 Feel free to delve into the code as it has been written in a straightforward manner for easy understanding. 
 By doing so, you can gain insights on how to incorporate Shadowing effects into the scene.


 
 

> [!IMPORTANT]

>> - It is crucial to grasp that the project incorporates _"Three.js"_ to build a 3D environment for observing "Shadows" effects.





> _Which Concepts Have I Covered_: 


01. _
To enable shadows in the "Renderer", "Objects", and "DirectionalLight", follow these steps:

Turn on Shadow settings in the Renderer, enable shadow casting on Objects, and adjust shadow settings for the DirectionalLight.
_

02. _
Refine the appearance of shadows by adjusting the near, far, top, bottom, right, left, and blur properties of the Shadow-Camera for optimal results.
_

03. _
Modify the Shadow Map algorithm to achieve a smoother shadow effect - `  PCFSoftShadowMap  `
_

04. _
Enhance "SpotLight" Functionality and Optimize SpotLight Shadow Performance.
_

05. _
Include "PointLight" and Improve PointLight Shadow for Optimization.
_

06. _
Incorporating shadows into textures used for material application is known as `  baking shadows  `.
_

07. _
"Dynamically bake a shadow" using an alpha-texture where the white part is visible and the black part is invisible. Subsequently, move the shadow along with the sphere.
_


 





#### _Give it a go in real-time and give me a Star_       _Shadows_  






https://github.com/ShahramShakiba/Threejs-Journey-Part04/assets/110089830/1207da20-f493-4f59-bcc2-d74cdd0cb78d

  
 

***

 ##  Find me around the Web