/bloop_shader_app

Social Shading with Social Distance: a multi-user shader editor

Primary LanguageJavaScript

Bloop

Lan Zhang & Anna Garbier

What is Bloop?

"Bloop" is a multi-user online coding environment for collaboratively making GLSL shaders on a blob!! geometry, made with Socket.io and Three.js.

Screengrab

How to use it?

It's pretty simple! Coders enter the room, edit the shader code, and share it with everyone in the room!


Some benefits:

  • Preview: Compile and Preview your shader code locally
  • Push: Push/Upload your code to the server
  • Force Push: Force push your code to everyone's screen (instantly overwrites others' canvases)
  • Pull: Pull the latest update from the server
  • Get Random: Get some inspiration by getting a random shader sketch from bloop library

Social Shading & Social Distancing: A Shader workshop

This web editor was made in response to our shader class at Parsons D&T program being moved online. You can find the workshop materials here.

Start social shading online

https://bloopp.herokuapp.com/

Run locally:

  1. Download or git clone the repo
  2. Enter commands in your terminal below:
$ npm install
$ node index.js