NasimiAsl Posted July 11, 2016 Share Posted July 11, 2016 Flow this topic if you don't Use Shader a lot. i try made that because most of member prefer to don't Use shader we talk about this stuffs step by step : What is Shader How It work in GPU : understanding How can i use it How can start programming in shader what information we access in shader [ more question added in next ] we try talk about one stuff per days gryff, jerome, Temechon and 1 other 4 Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted July 11, 2016 Author Share Posted July 11, 2016 1. What is Shader two kind of shader we have "Material Shader" and "Post Process Shader" Material Shader : has 2 functions one for called per each vertex of mesh : Vertex Shader and next one called per each pixel of mesh rendered in view-port : Fragment Shader or Pixel Shader PostProcess Shader : has 2 functions 1. vertex shader in postprocess used for make a texture coordinate for fragment shader attribute vec2 v_coord; uniform sampler2D fbo_texture; varying vec2 f_texcoord; void main(void) { gl_Position = vec4(v_coord, 0.0, 1.0); f_texcoord = (v_coord + 1.0) / 2.0; } 2. called per each pixel of screen rendered in view-port (that can be called smaller than correct view-port : called scale parameter ) : Fragment Shader or Pixel Shader any action in 3d engines need process shader for display final color per pixel of viewport so any material we used or any effect we have one or few shader we have for do that for us Nabroski, royibernthal, iiceman and 1 other 4 Quote Link to comment Share on other sites More sharing options...
gryff Posted July 11, 2016 Share Posted July 11, 2016 Looks good @NasimiAsl - maybe I will finally get my head around shaders, or at least get a better understanding of them cheers gryff NasimiAsl 1 Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted July 12, 2016 Author Share Posted July 12, 2016 Hello again in Days 2: i wanna talk more about Material Shader so how it work is best question we have in first : we need send information about mesh and textures for Shader we have 3 type of variable [attributes , uniforms , varying ] *** all this stuff managed in babylonjs automatically you just need define what you want more Attributes : #Per-vertex variables passed by the engine to the shader, like position, normal, etc (Mesh data in the graphic) before shader we have geometry information [ vertices , face , uv , uv2 ] this make mesh in 3d Engine all this attributes ( geometry information ) is Local informaion about mesh and we haven't the global position and scale or rotation in this attributes Uniforms : # User defined variables that are passed by the main program to the vertex and fragment shader, these variables are global for a given execution of a shader. 3d Engine can send other data like global Postion or anything else with Uniforms. defult global information is : [view , world ,worldView , worldViewProjection , viewProjection ] we talk more about this in advance mode Varying : # Variables passed from the vertex shader to the fragment shader. you can share some information between vertex shader and fragment shader you most define it in Varying ** varying can help us to make more optimization too jerome and royibernthal 2 Quote Link to comment Share on other sites More sharing options...
royibernthal Posted July 14, 2016 Share Posted July 14, 2016 @NasimiAsl What happened to days 3 and 4? NasimiAsl and Nabroski 2 Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted July 15, 2016 Author Share Posted July 15, 2016 in Iran Is Weekend but in Day 3 and 4 we talk about variable Kind and usage i just write introduction about day 3 and 4 we continue in Saturday : when we need initialize a shader we need collect all uniforms and varyings Witch uniform we need in Shader ? What Varying we most Define ? all variable types bool ,float , vec? (vector 2,3,4) , mat? (matrix 2,3,4 ) , ivec? (2,3,4 ) , sampler?D (1,2,3) , samplerCube , sampler?DShadow (1,2) vector components is : x y z w ( size and position stuff ) - r g b a ( color stuff) - s t p q ( texture coordinate stuff) sample of vector usage : 1: uniform vec3 position; 2: vec2 a = position.xy; 2: vec3 a = position.xyv; * notic you can use like this too : .xxx .xxy .xyx .xyy .xzz .. etc and in color you can use http://www.babylonjs.com/cyos/#Q6NMF uniform sampler2D textureSampler; vec4 map = texture2D( textureSampler , vec2( uv.x , uv.y ) ); map.rgb or map.rrr reference is : http://mew.cx/glsl_quickref.pdf more after Saturday and sorry about late ask any question about before thanks Nabroski and jerome 2 Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted July 16, 2016 Author Share Posted July 16, 2016 hi : Days 3 Witch uniform we need in Shader ? witch we need in Vertex ? usually we don't change vertex shader and we most look at them like last chance for solution *** when we change vertex shader we miss real position and picking system and collision system *** when we change some vertex position you lost your correct normal we most be recalculate (just in safe normal not in flat normals) *** it is hard to control move vertex and make animated *** when you can make your animation or morph in vertex shader you do that on GPU side it is very optimized in vertex shader you don't work with array of position and you just have one and don't have access to other positions see this code it is explain what call your vertex shader in GPU : for (int i = 0; i < vertexCount; i++) { output = vertexShader(vertex[i]); } reference : https://processing.org/tutorials/pshader/ so your uniform send for all vertex and you cant custom that per vertex http://babylonjs.com/cyos/#1LNKAZ you can define your condition for change in you shader http://babylonjs.com/cyos/#1LNKAZ#1 if you cant find your special vertex by mathematical or condition you most define your uniform and send this special vertex for shader. jerome 1 Quote Link to comment Share on other sites More sharing options...
Nabroski Posted July 17, 2016 Share Posted July 17, 2016 Hello Can you also share also very simple playgrounds, so i can start change number and see if it still workshttp://www.babylonjs-playground.com/#LA4VD#14 How to import a shaders i made with cyos in the playground to start experimenting Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted July 18, 2016 Author Share Posted July 18, 2016 @Nabroski you can use this for make shaderMaterial : http://www.babylonjs-playground.com/#1YHPOU#0 and you can Use ShaderBuilder : http://www.babylonjs-playground.com/#GHZP8#0 Nabroski 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.