ShaderBoy is a simple text editor that lets you write Shadertoy shaders more comfortably, anytime, anywhere. I like writing shaders for Shadertoy, or analyzing other people's esoteric shaders, and I created this especially because I wanted to do that on my smartphone. Whether you're traveling by train or plane, staying in the toilet, fishing or camping, you can write a shader anywhere and anytime. Your power to go.
There are PC version and smartphone version. Both allow you to write shaders with the same variable/function name as Shadertoy. On the PC version, you can fine-tune your shaders with a rich debugging GUI. It also has a recording mode so you can easily save your shader as a movie. The smartphone version consists of a minimal GUI element that assumes the use of a physical keyboards, with a small screen as much coding space as possible.
ShaderBoy uses Google Drive to store your shaders. From any device on which you log in with your Google account, you can continue coding the shader that you last edited.
Enjoy ShaderBoy!
ShaderBoy is a PWA(Progressive Web Apps).
You can install the app from here.
Smartphone | Windows | Mac | |
---|---|---|---|
Compile | β₯+ENTER(SPACE) | β₯+ENTER | β₯+ENTER |
Play/Pause | β₯+UP | β₯+UP | β₯+UP |
Reset time | β₯+DOWN | β₯+DOWN | β₯+DOWN |
Move to neighbor buffer | β₯+LEFT/RIGHT | β₯+LEFT/RIGHT | β₯+LEFT/RIGHT |
Search | ctrl+F | ctrl+F | β+F |
Replace | ctrl+H | ctrl+H | β+H |
Resolution | ctrl+1-4 | ctrl+1-4 | ctrl+1-4 |
Font size | ctrl+-/+ | ctrl+β§+β₯+-/+ | β+β§+β₯+-/+ |
Hide/Show WebGL canvas | ctrl+β§+β₯+V | ctrl+β§+β₯+V | β+β§+β₯+V |
Hide/Show Code & All GUIs | ctrl+β§+β₯+H | ctrl+β§+β₯+H | β+β§+β₯+H |
Hide/Show Timeline | --- | ctrl+β§+β₯+T | β+β§+β₯+T |
Hide/Show Knobs GUI | --- | ctrl+β§+β₯+D | β+β§+β₯+D |
Hide/Show iChannel GUI | ctrl+β§+β₯+A | ctrl+β§+β₯+A | β+β§+β₯+A |
Hide/Show Recording GUI | --- | ctrl+β§+β₯+R | β+β§+β₯+R |
Create a new shader | ctrl+β§+β₯+N | ctrl+β§+β₯+N | ctrl+β§+β₯+N |
Fork a shader | ctrl+β§+β₯+F | ctrl+β§+β₯+F | β+β§+β₯+F |
Save shader files | ctrl+S | ctrl +S | β+S |
Open shader list | ctrl+O | ctrl+O | β+O |
Mute/Unmute sound | ctrl+M | ctrl+M | β₯+M |
Switch header info(FPS/shader name) | ctrl+I | ctrl+I | β₯+I |
If you want have your own ShaderBoy,
Clone this repo and install dependencies.
$ npm install
You then set up a local host for development.
$ npm start
or to build,
$ npm run build
And upload files in "dest" directory to your server.
That's it! Good luck!
ShaderBoy depends on some awesome js libralies. Codemirror CCapture.js keymaster css_browser_selector
Paypal.meπΊ