-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
537a34d
commit 9fc15bc
Showing
4 changed files
with
69 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
# Soul: A 3D Scrolling Site | ||
|
||
Soul is an immersive, 3D scrolling website that offers a unique journey of reflection and inspiration. As you scroll, you'll discover beautifully crafted lines that resonate with the essence of life, touching your heart and soul, all while exploring a captivating 3D space environment. | ||
|
||
## Features | ||
|
||
- **3D Scrolling Experience**: Utilizes Three.js to create a captivating 3D background that responds to user scrolling. | ||
- **Interactive 3D Elements**: Includes various 3D objects like a torus, planets, stars, a satellite, and a rocket. | ||
- **Dynamic Camera Movement**: Camera position and rotation change based on scroll position. | ||
- **Inspirational Quotes**: Features a collection of thought-provoking quotes designed to inspire and enlighten. | ||
- **Responsive Design**: Adapts seamlessly to various screen sizes, ensuring a great experience on both desktop and mobile devices. | ||
- **Background Music**: Includes an option to play ambient music, enhancing the overall atmosphere of the site. | ||
- **Custom Typography**: Uses a combination of custom fonts to create a visually appealing and unique typographic style. | ||
|
||
## Technologies Used | ||
|
||
- HTML5 | ||
- CSS3 | ||
- JavaScript | ||
- Three.js for 3D graphics and animations | ||
- Custom fonts from Adobe Typekit | ||
|
||
## Getting Started | ||
|
||
To run this project locally: | ||
|
||
1. Clone the repository | ||
2. Install dependencies (if using a package manager) | ||
3. Open `index.html` in your browser | ||
|
||
Note: For the best experience, use a modern web browser with WebGL support. | ||
|
||
## Project Structure | ||
|
||
- `index.html`: Main HTML file | ||
- `style.css`: CSS styles for the project | ||
- `main.js`: JavaScript file for 3D background, animations, and interactions | ||
- `Images/`: Directory containing texture images and other assets | ||
- `music.mp3`: Background music file | ||
|
||
## Key JavaScript Features | ||
|
||
- Scene setup using Three.js | ||
- Creation of various 3D objects (torus, planets, stars, satellite, rocket) | ||
- Texture mapping for realistic object appearances | ||
- Dynamic lighting with point and ambient lights | ||
- Camera movement tied to scroll position | ||
- Animation loop for continuous rendering and object rotations | ||
- Background music toggle functionality | ||
|
||
## Customization | ||
|
||
Feel free to modify the 3D elements, textures, colors, or quotes to suit your preferences. The main JavaScript file (`main.js`) contains the logic for creating and animating the 3D scene, which can be adjusted to change the visual experience. | ||
|
||
## Contributing | ||
|
||
Contributions, issues, and feature requests are welcome. Feel free to check [issues page](link-to-your-issues-page) if you want to contribute. | ||
|
||
## License | ||
|
||
[MIT](https://choosealicense.com/licenses/mit/) | ||
|
||
## Screenshot | ||
|
||
![Screenshot](ss1.png) | ||
![Screenshot](ss2.png) | ||
![Screenshot](ss3.png) | ||
|
||
--- |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.