The website: webglstudio.org is a 3D Improvement condition for the web. WebGLStudio.js is a stage to make intuitive 3D scenes straightforwardly from the program. It permits to alter the scene outwardly, code your practices, alter the shaders, and all straightforwardly from the inside of an app.

Since I don't know anything about webGLStudio I learned many things to get started.

There are many demo to do to understand how to use WebGLStudio.org:

• Code Demo
• Basic Demo
• Animation Demo
• Render Engine Demo

I decided to do the Basic Demo. It was hard to understand because their was no audio and there wasn't any steps on how to do it. It just show them doing the project. The first step was to press Node in then press Primitive and choose a shape or an object you would want to do then you would have to select materials and create after that you would press Standard Material and add. Then you could change the color of the shape that you choose by selecting see Properties. I chose a sphere and the color light blue. Then you can also change the specular and the spec. gloss. Then I would choose the texture for the sphere I choose dirtylens.jpg. You could also change the light color and you could move it close to the object. After that I would go to Drive and press materials and chose the texture for the sphere and for the background I would add a component that I would add that is called Globalnfo and I would add Skybox. Then in the bottom of GlobalInfo I would press environment and I choose a background for the sphere I choose cubemap_514_CUBECROSSL.png. You could then change the refection exp. of the sphere. Then I when to drive then press prefabs and press the filename FXDirtyLens.wbin. Then I would go to FXgraphComponent and  I could change the Glow Clar.  AFter that I went to the graph and add node then texture then I pressed LUT and connect the operation to LUT and the connect LUT to View.Then I would go back to drive and press texture the luts I chose the filter pj.jpg, 

In the end I created:

Their are many uses for using WebGLStudio. 
WebGLstudio.js is split into serveral libraries that have 4 different functionalities

• LiteScene- The Engine behing WebGLstudio
• Its the main engine behind WebGLstudio its not mandatory to do so. It The engine also allows different ways to do the same actions it could help people, so you can use in-editor scripts, or external scripts loaded on launch, or graphs, or directly replace the source code of the engine.It can also help the editor to understand what is going on in every component and it can create new components with personalized interfaces that helps them to setup their scenes, without the need to code them.
• But it can nor do 3D
• LiteGL -Low-level APL to access WebGL
• LiteGL is utilized to diminish hole that is wrapping the greater part of the normal WebGL 1.0 calls inside protest arranged classes that speak to clearer ideas and it including some extremely helpful additional capacities that most 3D application will in the end require. It additionally it includes the fundamental capacities for any program realtime application.
• LiteGUL-To create Interfaces in the Editor 
• LiteGUI  is used to create a powerful and customizable interfaces from Javascript without the need of using HTML. 
• LiteGraph- To extend the graph system 
• LGraphNode is the base class utilized for every one of the hubs classes. To expand alternate classes every one of the strategies contained in LGraphNode.prototype are copyed to the classes when enlisted. Each node  has several slots, it stored in the node.inputs and node.outputs. Each node has a name, type, link or links, and label. The data would travel through a link by calling it node.getInputData or node.getOutputData.
• To integrate in you HTML application:

  var graph = new LiteGraph.LGraph();
  var graph_canvas = new LiteGraph.LGraphCanvas( canvas, graph );