[igc 2016] 부산게임아카데미 김성완 - shadertoy에서 구현하는 거리함수 기반의...
TRANSCRIPT
ShaderToy 에서구현하는 Ray Marching 렌더링
김성완부산게임아카데미
Inven Game Conference
INDEX1
ChapterShaderToy 소개
2Chapter
프랙탈그래픽
3Chapter
Ray Tracing & Lighting
4Chapter
Ray Marching 알고리즘
5Chapter
Chpater [1]
ShaderToy 소개
Inven Game Conference
1 챕터제목을입력하세요
Shadertoy
1 챕터제목을입력하세요
Shadertoy Browse
1 챕터제목을입력하세요
Shadertoy 만든사람들
Iñigo Quilez (IQ / RGBA) Pol Jeremias
1 챕터제목을입력하세요
이니고퀼레즈
1 챕터제목을입력하세요
이니고퀼레즈
1 챕터제목을입력하세요
Oculus Story Studio
1 챕터제목을입력하세요
Henry
1 챕터제목을입력하세요
Dear Angelica
1 챕터제목을입력하세요
Quill 시연
1 챕터제목을입력하세요
Quill ( 이니고퀼레즈 )
1 챕터제목을입력하세요
Wesley Allsbrook, 일러스트레이터
1 챕터제목을입력하세요
WebGL : OpenGL ES 2.0 for Web
1 챕터제목을입력하세요
OpenGL ES Shading Language
Referencehttps://www.khronos.org/files/opengles_shading_language.pdf
API Quick Reference Cardhttps://www.khronos.org/opengles/sdk/docs/reference_cards/OpenGL-ES-2_0-Reference-card.pdf
1 챕터제목을입력하세요
Apple - iq, shadertoy
https://www.shadertoy.com/view/XdfGRn
1 챕터제목을입력하세요
Snail - iq, shadertoy
https://www.shadertoy.com/view/ld3Gz2
1 챕터제목을입력하세요
Elephants - iq, Shadertoy
Chpater [2]
프랙탈그래픽
Inven Game Conference
1 챕터제목을입력하세요
Benoit B. Mandelbrot (1924~2010)
1 챕터제목을입력하세요
Mandelbrot 집합의발견 (1980)
1 챕터제목을입력하세요
Mandelbrot 집합의발견 (1980)
1 챕터제목을입력하세요
Mandelbrot 집합의발견 (1980)
1 챕터제목을입력하세요
Mandelbrot 집합의발견 (1980)
1 챕터제목을입력하세요
Mandelbrot 집합의발견 (1980)
1 챕터제목을입력하세요
Mandelbrot 집합의공식
1 챕터제목을입력하세요
3D Mandelbrot
2D 프랙탈만델브로트집합처럼흥미롭고 무한히복잡한경계를가진 3D 프랙탈을찾으려는시도
… 하지만결과는신통치않았다 .
1 챕터제목을입력하세요
Mandelbulb 의발견 (2009)
2009년 Fractalforum.com 의 3D Fractal 쓰레드를통해서Daniel White 와 Paul Nylander 가드디어발견
http://www.fractalforums.com/
1 챕터제목을입력하세요
Mandelbulb 의발견 (2009)
1 챕터제목을입력하세요
Mandelbulb 의확대
Chpater [3]
Ray tracing & Lighting
Inven Game Conference
1 챕터제목을입력하세요
페이지제목을입력하세요
1 챕터제목을입력하세요
Ray Tracing 알고리즘
1 챕터제목을입력하세요
최초의레이트레이싱영상 (1980) Turner Whitted
1 챕터제목을입력하세요
Distributed Ray Tracing (1984) : 루카스필름
1 챕터제목을입력하세요
Amiga Juggler (1986) - 초창기저사양레이트레이싱영상
https://youtu.be/-yJNGwIcLtw
1 챕터제목을입력하세요
반직선 (ray) 과구 (Sphere) 의벡터방정식
𝐂��
O
R
1 챕터제목을입력하세요
반직선 (ray) 과구 (Sphere) 의교점구하기
1 챕터제목을입력하세요
반직선 (ray) 과구 (Sphere) 의교점구하기
해가없다 b2 - 4ac < 0
해가두개 b2 - 4ac > 0, t1 < t2
해가중근 b2 - 4ac = 0, t1 = t2
1 챕터제목을입력하세요
반직선 (ray) 과평면 (Plane) 의교차점
1 챕터제목을입력하세요
반직선 (ray) 과평면 (Plane) 의교차조건
1 챕터제목을입력하세요
Phong Lighting Model
1 챕터제목을입력하세요
Phong Reflection Model
Bùi Tường Phong (1947~1975) : 베트남태생 , 유타대박사학위 컴퓨터그래픽의기본조명모델을발명 ( 박사학위논문 ), 백혈병으로사망
반사광의강도를구하는공식
Ambient = ka la
Diffuse = kd ld(L • N) = kd ldcosβ
Specular = ks ls(R • V)n = ks ls(cosα)n
1 챕터제목을입력하세요
Phong Reflection Model Fomular
1 챕터제목을입력하세요
Phong Reflection Model
1 챕터제목을입력하세요
Phong VS PBL(Physically Based Lighting)
1 챕터제목을입력하세요
페이지제목을입력하세요
1 챕터제목을입력하세요
Ray3d
1 챕터제목을입력하세요
Minimal Raytracer code (Andrew Kensler)
#include <stdlib.h> // card > aek.ppm#include <stdio.h>#include <math.h>typedef int i;typedef float f;struct v{f x,y,z;v operator+(v r){return v(x+r.x,y+r.y,z+r.z);}v operator*(f r){return v(x*r,y*r,z*r);}f operator%(v r){return x*r.x+y*r.y+z*r.z;}v(){}v operator^(v r){return v(y*r.z-z*r.y,z*r.x-x*r.z,x*r.y-y*r.x);}v(f a,f b,f c){x=a;y=b;z=c;}v operator!(){return*this*(1/sqrt(*this%*this));}};i G[]={247570,280596,280600,249748,18578,18577,231184,16,16};f R(){return(f)rand()/RAND_MAX;}i T(v o,v d,f&t,v&n){t=1e9;i m=0;f p=-o.z/d.z;if(.01<p)t=p,n=v(0,0,1),m=1;for(i k=19;k--;)for(i j=9;j--;)if(G[j]&1<<k){v p=o+v(-k,0,-j-4);f b=p%d,c=p%p-1,q=b*b-c;if(q>0){f s=-b-sqrt(q);if(s<t&&s>.01)t=s,n=!(p+d*t),m=2;}}return m;}v S(v o,v d){f t;v n;i m=T(o,d,t,n);if(!m)return v(.7,.6,1)*pow(1-d.z,4);v h=o+d*t,l=!(v(9+R(),9+R(),16)+h*-1),r=d+n*(n%d*-2);f b=l%n;if(b<0||T(h,l,t,n))b=0;f p=pow(l%r*(b>0),99);if(m&1){h=h*.2;return((i)(ceil(h.x)+ceil(h.y))&1?v(3,1,1):v(3,3,3))*(b*.2+.1);}return v(p,p,p)+S(h,r)*.5;}i main(){printf("P6 512 512 255 ");v g=!v(-6,-16,0),a=!(v(0,0,1)^g)*.002,b=!(g^a)*.002,c=(a+b)*-256+g;for(i y=512;y--;)for(i x=512;x--;){v p(13,13,13);for(i r=64;r--;){v t=a*(R()-.5)*99+b*(R()-.5)*99;p=S(v(17,16,8)+t,!(t*-1+(a*(R()+x)+b*(y+R())+c)*16))*3.5+p;}printf("%c%c%c",(i)p.x,(i)p.y,(i)p.z);}}
1 챕터제목을입력하세요
Simple sphere raytracer
1 챕터제목을입력하세요
Simple raytracer - Shadertoy
1 챕터제목을입력하세요
Ray Tracer Codevoid mainImage( out vec4 fragColor, in vec2 fragCoord ){
vec2 uv = fragCoord.xy / iResolution.xy;float aspectRatio = iResolution.x / iResolution.y;uv *= 2.0; uv -= vec2(1.0, 1.0);uv.x *= aspectRatio;
vec3 sphere = vec3(0.0, 0.0 + sin(iGlobalTime * 4.0), 5.0);float R = 1.0;vec3 ray = vec3(uv, 2.0);
vec3 light = vec3(0.0 + 2.0 * sin(iGlobalTime * 4.0), 1.0, 5.0 + 2.0 * cos(iGlobalTime * 4.0));
float A = dot(ray, ray);float B = -2.0 * dot(ray, sphere);float C = dot(sphere, sphere) - R*R;float Det = B*B - 4.0*A*C;vec3 color;
if (Det > 0.0) {
color = vec3(1.0, 0.0, 0.0);float t = (-B - sqrt(Det)) / (2.0 * A);
vec3 pos = t * ray;
vec3 N = normalize(pos - sphere);vec3 L = normalize(light - pos);float diffuse = max(dot(N, L), 0.0);
vec3 Ref = reflect(-L,N);vec3 V = -normalize(pos);float specular = pow(max(dot(V, Ref),0.0), 32.0);
color *= diffuse;color += specular;
}else{
color = vec3(0.5, 0.5, 1.0);}
fragColor = vec4(color,1.0);}
Chpater [4]
Ray Marching 알고리즘
Inven Game Conference
1 챕터제목을입력하세요
Marching??
1 챕터제목을입력하세요
Raymarching 알고리즘
1 챕터제목을입력하세요
Ray Marching 알고리즘
Rendering Worlds With Two Triangleshttp://www.iquilezles.org/www/material/nvscene2008/nvscene2008.htm
http://www.iquilezles.org/www/material/nvscene2008/rwwtt.pdf
Link collection of ray marching on the GPUhttp://d.hatena.ne.jp/hanecci/20131005/p1
1 챕터제목을입력하세요
Rendering Worlds With Two Triangles
1 챕터제목을입력하세요
Using only Fragment Shader!
Raymarching Beginners' Threadhttp://www.pouet.net/topic.php?which=7920
1 챕터제목을입력하세요
Raymarching Beginners' Thread
Raymarching Distance Fieldshttp://9bitscience.blogspot.kr/2013/07/raymarching-distance-fields_14.html
1 챕터제목을입력하세요
Sphere Tracing
1 챕터제목을입력하세요
Sphere Tracing
1 챕터제목을입력하세요
Elevated (2009) 4K Demo - Inigo Quilez, rgba
https://youtu.be/jB0vBmiTr6o
1 챕터제목을입력하세요
Elevated (ShaderToy version)
https://www.shadertoy.com/view/MdX3Rr
1 챕터제목을입력하세요
Distance Fields 거리장
1 챕터제목을입력하세요
Distance Fields 거리장의응용 , 와들와들펭귄 즈 (2013)
1 챕터제목을입력하세요
부호있는거리함수 Signed Distance Function
1 챕터제목을입력하세요
Distance Functions
Distance Functionshttp://www.iquilezles.org/www/articles/distfunctions/distfunctions.htm
1 챕터제목을입력하세요
Distance Functions
Sphere - signed - exactfloat sdSphere( vec3 p, float s ){ return length(p)-s;}
Box - unsigned - exactfloat udBox( vec3 p, vec3 b ){ return length(max(abs(p)-b,0.0));}
Box - signed - exactfloat sdBox( vec3 p, vec3 b ){ vec3 d = abs(p) - b; return min(max(d.x,max(d.y,d.z)),0.0) + length(max(d,0.0));}
1 챕터제목을입력하세요
CSG(Constructed Solid Geometry) 연산
일종의집합연산
합집합 : A U B 교집합 : A ∩ B 차집합 : A − B = A ∩ Bc
대응하는논리연산
A B = A or B∨A B = A and B∧A ~B = A and not B∧
OR max(A,B)AND min(A,B)
1 챕터제목을입력하세요
Ray Marching Interation counter
1 챕터제목을입력하세요
Shadertoy Tutorials
ShaderToy Raymarch Tutorialhttps://www.youtube.com/watch?v=yxNnRSefK94
NVScene 2015 Session: Shadertoy Hackathon Kickoff (Inigo Quilez, Pol Jeremias, Otavio Good)
https://www.youtube.com/watch?v=yxNnRSefK94
1 챕터제목을입력하세요
페이지제목을입력하세요
1 챕터제목을입력하세요
GLSL Help - ShaderToy
1 챕터제목을입력하세요
Select Input - Shadertoy
1 챕터제목을입력하세요
Hello Circle
1 챕터제목을입력하세요
Heart equation
1 챕터제목을입력하세요
Heart equation
1 챕터제목을입력하세요
Heart equation
1 챕터제목을입력하세요
페이지제목을입력하세요
1 챕터제목을입력하세요
페이지제목을입력하세요
1 챕터제목을입력하세요
Mandelbrot test
1 챕터제목을입력하세요
Surface normal 구하기
vec3 calcNormal(vec3 p){ vec3 eps = vec3(0.01, 0.0, 0.0); vec3 n; n.x = distFunc(p + eps.xyy) - distFunc(p - eps.xyy); n.y = distFunc(p + eps.yxy) - distFunc(p - eps.yxy); n.z = distFunc(p + eps.yyx) - distFunc(p - eps.yyx); return normalize(n);}
1 챕터제목을입력하세요
shadows
free penumbra shadows for raymarching distance fields
http://www.iquilezles.org/www/articles/rmshadows/rmshadows.htm
1 챕터제목을입력하세요
shadow code
float shadow( in vec3 ro, in vec3 rd, float mint, float maxt ){ for( float t=mint; t < maxt; ) { float h = map(ro + rd*t); if( h<0.001 ) return 0.0; t += h; } return 1.0;}
float softshadow( in vec3 ro, in vec3 rd, float mint, float maxt, float k ){ float res = 1.0; for( float t=mint; t < maxt; ) { float h = map(ro + rd*t); if( h<0.001 ) return 0.0; res = min( res, k*h/t ); t += h; } return res;}
1 챕터제목을입력하세요
Ambient occlusion
Fake Ambient occlusion but fast
1 챕터제목을입력하세요
Ambient occlusion code
float calcAO(vec3 p, vec3 n){
float r = 0.0;float w = 1.0;
for (int i = 1; i <= AO_SAMPLES; i++){float d0 = float(i) * 0.2;r += w * (d0 - scene(p + n * d0));w *= 0.5;
}
return 1.0 - clamp(r, 0.0, 1.0);}
1 챕터제목을입력하세요
Shadertoy
1 챕터제목을입력하세요
Shadertoy
1 챕터제목을입력하세요
Ray March Dream
1 챕터제목을입력하세요
Ray March Reloaded
1 챕터제목을입력하세요
PAPER LANTERN
감사합니다[부산게임아카데미 ]
김성완