space-3d
space-3d copied to clipboard
Various ideas / suggestions
Great stuff.
Just gonna drop some ideas and suggestions here. Take them as you will. :smile:
- You can use glslify for modularizing shaders, so you can
npm install glsl-noise
and eventually publish the space-specific GLSL components back to npm - Optionally, you can use stackgl for some low-level aspects like shader compilation. However, you don't need to use stackgl to get glslify working.
- A "daytime" mode might be awesome
- The process is really slow for large textures, totally hanging my system. I wonder if it's because it's trying to save each cube face to individual canvas elements? Maybe there is a solution that doesn't involve rendering to canvas textures.
A nice "end goal" for a project like this (and similar procedural texture tools) might be to have an Electron installation. The end-user experience would be a lot nicer, it would be something like:
npm install space-3d -g
## run in GUI mode
space-3d --gui
## run in CLI mode
space-3d --seed=5c9ss9vdfq0w --resolution=1024 --output space_cubes/
The main benefit is that you get Node's fs
so you can stream FrameBuffer pixels directly to the file system (see gl-pixel-stream). This means you could render huge outputs without crashing/hanging the user's system, and without the user having to "Save As" each cube face. It could also be used as a CLI tool.
For reference, see shadertoy-export, which is built on Electron, stackgl and gl-pixel-stream
. It's a bit clunky to develop, since you have to figure out a nice dev/prod setup with browserify (or another bundler of your choice), but the end result is pretty awesome.
Cheers!
:beers:
Another suggestion, related to the dev/build step. :tada:
You might want to check out budo for local development; it has a few benefits like incremental rebundling for faster development (via watchify), integrated live-reload, and cleaner error reporting in the browser. The whole Gulpfile could be replaced with two lines in package.json, and lead to a better dev UX:
{
"devDependencies": {
"browserify": "^12.0.1",
"budo": "^6.0.4",
"glslify": "^2.3.1",
"uglify-js": "^2.4.21"
},
"scripts": {
"start": "budo src/main.js:static/js/bundle.js --live -- --transform glslify",
"build": "browserify src/main.js | uglifyjs -cm > static/js/bundle.js"
}
}
Excellent recommendations, thank you! Looks like I have some fun research ahead of me. :)