https://github.com/moppius/contextual-dioramas

Procedurally-generated 3D dioramas using Three.js
https://github.com/moppius/contextual-dioramas

diorama environment generative-art procedural threejs

Last synced: 3 months ago
JSON representation

Procedurally-generated 3D dioramas using Three.js

• Host: GitHub
• URL: https://github.com/moppius/contextual-dioramas
• Owner: moppius
• License: mit
• Created: 2020-08-07T21:36:07.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2024-01-07T23:25:32.000Z (about 1 year ago)
• Last Synced: 2024-04-24T04:28:44.125Z (9 months ago)
• Topics: diorama, environment, generative-art, procedural, threejs
• Language: JavaScript
• Homepage: https://moppius.github.io/contextual-dioramas/
• Size: 4.88 MB
• Stars: 14
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Contextual Dioramas

A [Three.js](https://threejs.org/) project that generates 3D dioramas procedurally using contextual information. You can visit the [latest interactive release on the Github Pages site here](https://moppius.github.io/contextual-dioramas/).

It is built on [@marcofugaro](https://github.com/marcofugaro)'s [threejs-modern-app](https://github.com/marcofugaro/threejs-modern-app) framework.

## Prerequisites

- [Yarn](https://yarnpkg.com/) - if you want to use [npm](https://npmjs.com), you will need to reconfigure the scripts in `package.json`

**Note:** This project has only been tested on Windows 10 and none of the scripts are set up to be cross-platform yet.

## Usage

Once you have installed the dependencies by running `yarn`, these are the available commands:

- `yarn start` starts a server locally and launches the browser - any changes will be hot-reloaded, for rapid iteration

- `yarn build` builds the project for production, ready to be deployed from the `build/` folder

- `yarn deploy` builds and pushes the contents of build folder to a `gh-pages` branch on this repository

All the build tools logic is in the `package.json` and `webpack.config.js`.

Read the full [threejs-modern-app documentation](https://github.com/marcofugaro/threejs-modern-app) for a more in-depth guide.

## Credits

- The environment reflection map is a free CC0 HDRI image from [hdrihaven.com](https://hdrihaven.com/)