Stone Of Days

OpenGL ES 2.0으로 Phone Shading(또는 Per Fragment Lighting)을 구현하기 위해 얼마나 많은 고생을 했는지 몰르겠다.
어디에도 제대로된 sample은 없었다. 오히려 bump mapping 예제가 더 많았던 것 같다.

그런데, 나도 바보같은 것이 그냥 OpenGL sample을 찾아서 수정하겠다고 맘 먹었으면 오히려 쉬웠을 수도 있는데, 내용을 모르다보니 수정하는것에 막연히 겁을 먹었던 것 같기도 하다.

어쨌든 이런 저런 sample들을 받아 이렇게도 해보고 저렇게도 해보아도 제대로 되지 않았던 Phong shading을, "바로 오늘!" 제대로 구현하기에 이르렀다. 물론 이론에 대한 학습이 선행 되었기에 가능했을런지 모르겠다. : )

개인적으로 느낀 한 가지 팁은,
대부분에 해당 될지는 모르겠지만, 처음부터 texture를 사용해서 테스트 하지 않는게 좋겠다.
왜냐하면 texture의 현란한(?) 색상 때문에 정작 구현하고자 하는것이 제대로 보이는지 확인이 어려운 것 같다.
그냥 원색의 단색, 예를들면 빨강(Red)이나 파랑(Blue)을 이용해서 구현하면 좋은것 같다.

 Image Reference

I = ka * Ia + (Ip / (d)) [kd * (N\cdot L) + ks * (V\cdot R)^n]

 

varying vec3 N;

varying vec3 v;

void main (void)

{

vec3 L = normalize(gl_LightSource[0].position.xyz - v);

vec3 E = normalize(-v); // we are in Eye Coordinates, so EyePos is (0,0,0)

vec3 R = normalize(-reflect(L,N));

 

//calculate Ambient Term:

vec4 Iamb = gl_FrontLightProduct[0].ambient;

 

//calculate Diffuse Term:

vec4 Idiff = gl_FrontLightProduct[0].diffuse * max(dot(N,L), 0.0);

Idiff = clamp(Idiff, 0.0, 1.0);

 

// calculate Specular Term:

vec4 Ispec = gl_FrontLightProduct[0].specular * pow(max(dot(R,E),0.0), 0.3 * gl_FrontMaterial.shininess);

Ispec = clamp(Ispec, 0.0, 1.0);

// write Total Color:

gl_FragColor = gl_FrontLightModelProduct.sceneColor + Iamb + Idiff + Ispec;

}

 

[Fragment Shader Source Code]
우선 Vertex Shader Source Code에서,
gl_ModelViewMatrix, gl_ModelViewProjectionMatrix, gl_NormalMatrix, gl_Vertex, gl_Normal 은 OpenGL ES 2.0에는 없는 built-in variable 이기 때문에, 따로 uniform 및 attribute로 추가해 주어야 한다.

다음으로 Fragment Shader Source Code에서도,
gl_LightSource, gl_FrontLightProduct, gl_FrontMaterial, gl_FrontLightModelProduct 역시 OpenGL ES 2.0에는 없는 build-in variable 이므로, 따로 uniform으로 추가 해 주어야 한다.

[2011.10.03 추가]
* 처음 Phong Shading 구현에 성공했을 당시(거의 한달 전-_-;)에는, 그 자제가 너무 감격스러워 lighting 이라는 본질에 대해서는 망각하고 있었다. 즉, lighting의 방향에 대해서는 제대로 확인조차 하지 않았던 것이다. 그리고 이런 저런 정리가 어느정도 된 상태에서 확인을 해 보니, 아무리 조명의 위치를 변경해도 항상 제자리에서 꿈쩍도 하지 않았던 것! ㅜ.ㅜ
  한참을 고민해 봐도 모든게 sample code와 다르지 않았고, 급기야 그림을 그리며 directional light와 Phong shading에 대해 공부하기에 이르렀지만, 모든게 정상적이었고 되지 않을 이유가 없었는데... Shader에서 문제(?)가 생기니, 정말 막막하기만 했다.
  Back to Basics! 기본으로 돌아가서 다시 하나하나 점검을 하던 중, 이상한 것을 발견! 그건 바로 light position의 data type이 vec4 로 되어 있었는데, client code에서는 glUniform3f를 사용한 것이었다. 이런 된장! -_-; 주의하자;;

* 여러종류 light 다수를 하나의 shader에 구현하려고 했는데, 그러지 말란다. 실제로도 shader code에 control이 들어가면 성능이 급격히 떨어진다. 아직도 갈 길은 멀었으니...;;

Gouraud shading, named after Henri Gouraud, is an interpolation method used in computer graphics to produce continuous shading of surfaces represented by polygon meshes. In practice, Gouraud shading is most often used to achieve continuous lighting on triangle surfaces by computing the lighting at the corners of each triangle and linearly interpolating the resulting colours for each pixel covered by the triangle. Gouraud first published the technique in 1971.
  

Phong shading refers to an interpolation technique for surface shading in 3D computer graphics. It is also called Phong interpolation, normal-vector interpolation shading, per-fragment lighting or per-pixel-based lighting. Specifically, it interpolates surface normals across rasterized polygons and computes pixel colors based on the interpolated normals and a reflection model. Phong shading may also refer to the specific combination of Phong interpolation and the Phong reflection model.

법선벡터들은 기하구조 변환에 사용된 특정 행렬의 역행렬의 전치 행렬에 의해서 변환되어야만 한다. 그러므로 기하 구조를 변환하는 데 사용한 행렬이 M 이라면 그 기하 구조의 법선 벡터를 변환하는 데는 다음과 같은 행렬 N을 사용하여야 한다.

N = (M^{-1})^{T}

참고로 직교 행렬의 역행렬은 자신의 전치 행렬이므로 그 행렬 자체가 법선 벡터를 변환하는데 바로 사용될 수 있다.
원래의 회전 행렬이 주어지면 두 개의 행렬 전치는 소거된다.
더욱이 평행 이동은 벡터 방향에 영향을 주지 않으므로 평행 이동을 몇 번 하든 법선 벡터에는 영향을 주지 않는다.