https://github.com/mooss/noisy
Interactive procedural terrain sandbox
https://github.com/mooss/noisy
perlin-noise procedural-generation typescript webapp
Last synced: 3 months ago
JSON representation
Interactive procedural terrain sandbox
- Host: GitHub
- URL: https://github.com/mooss/noisy
- Owner: mooss
- License: mit
- Created: 2025-08-05T20:10:23.000Z (11 months ago)
- Default Branch: master
- Last Pushed: 2026-02-14T03:29:14.000Z (4 months ago)
- Last Synced: 2026-02-14T03:57:39.049Z (4 months ago)
- Topics: perlin-noise, procedural-generation, typescript, webapp
- Language: TypeScript
- Homepage: https://mooss.github.io/noisy/dandelion
- Size: 886 KB
- Stars: 15
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Noisy
Generate and explore 3d terrain in your browser with noise algorithms.
Try it [now](https://mooss.github.io/noisy).
## Features
- **Real-time feedback** - See terrain change as you adjust parameters
- **Shareable creations** - Save and load state via URL or JSON drag-and-drop
- **Infinite terrain** - Move across the infinite terrain thanks to dynamic chunks loading
## Controls
- *WASD* to move the avatar around.
- *Mouse wheel* to zoom.
- *Left click + mouse movement* to pan around the map.
- *Right click + mouse movement* to rotate the camera.
## Examples (click to open scene)
## Resources
If you are curious about procedural generation, here are a few resources to explore the topic.
[Red Blob Games](https://www.redblobgames.com) is a fantastic source of inspiration that provides great explanations and interactive examples.
A few particularly interesting posts:
- [Making maps with noise functions](https://www.redblobgames.com/maps/terrain-from-noise/)
- [Voronoi maps tutorial](https://www.redblobgames.com/x/2022-voronoi-maps-tutorial/)
- [Mapgen4](https://www.redblobgames.com/maps/mapgen4/)
ProcGen Space has [a page](https://procgen.space/resources) with a lot of links to procedural generation resources that can be filtered with tags.
The [SimonDev](https://www.youtube.com/@simondev758) YouTube channel has a [3d World Generation playlist](https://www.youtube.com/watch?v=hHGshzIXFWY&list=PLRL3Z3lpLmH3PNGZuDNf2WXnLTHpN9hXy) exploring procedural generation techniques in JavaScript.
It covers a surprising amount of ground in a few 6 to 10 minutes videos (from heightmap generation to level of details and biome generation and a lot of other things in-between).
## Run locally
```bash
cd web
make setup
make serve
```
## Build and deploy
It builds and embed the project in a Go binary that will serve it and open it in the default browser.
```bash
make setup
make dist
./build/noisy-serve
```
## License
- Source code: MIT License - see [LICENSE](LICENSE) for details.
- Logo and brand assets: All rights reserved (see res/branding/LICENSE-LOGO).