이족보행달팽이

Shader와 SIMD에 대해서 - 1편의 연장선 이야기입니다.https://figix.tistory.com/114float 4 mask = saturate( 1.0 - abs( float4(0.0, 1.0, 2.0, 3.0)-c ) );float MaskColorValue =dot(vertexColor, mask);1편에서 소개했던 블로그에서 수식을 가져왔습니다. 저 수식의 목적은 RGBA 채널 중 하나의 채널에만 1.0을 값을 부여하고,나머지는 0.0으로 만드는 것입니다. 이를 런타임 중에 하는 것이 핵심. 위 수식에서 c는 float4값으로 모든 원소의 값이 동일한 형태입니다.(0.0, 0.0, 0.0, 0.0), (1.0, 1.0, 1.0, 1.0), (2.0, 2.0, 2.0, 2.0), (3...

SISD(Single Instruction Single Date) ㄴ하나의 명령어로 하나의 데이터만 처리한다. SIMD(Single Instruction Multiple Data) ㄴ하나의 명령어로 여러 데이터를 동시에 처리한다. C언어의 코드로 보면 다음과 같다.add함수의 연산하는 구간이 한번에 같은 더하기 연산이 처리된 것을 알 수 있다. Shader에서 Vector3+Vector3 연산은 SIMD 방식으로각 원소끼리 한번에 더하는 연산인 것을 알 수 있다. 조금더 나아가서 GPU의 연산 단위를 알아보자. GPU 작업 단위 계층 Thread (쓰레드)가셰이더의 가장 작은 연산 단위.픽셀 셰이더라면 보통 픽셀 1개 = 쓰레드 1개.버텍스 셰이더라면 버텍스 1개 = 쓰레드 1개. 즉, "1작업"이란 보..

y = fract(sin(x)*1.0);상수항의 값이 10,000정도에 가까워지면 랜덤적으로 바뀐 변화가 정지되는듯한 현상이 일어나니 큰수는 쓰지 않도록 주의하기 y = rand(x); - 랜덤값y = rand(x)*rand(x); - 0에 더 가까운 랜덤값 (0~1의 사이의 소수끼리의 곱이므로)y = sqrt(rand(x)); - 1에 좀 더 가까운 랜덤값y = pow(rand(x),5.); - 0에 많이 가까운 랜덤값 지수 연산에서 지수값이 높을 수록 0에 많이 가가운 형태의 랜덤 값이 발생되고,지수값이 낮을 수록 1에 가까운 형태의 값이 나온다.이는 다음 그래프들로 확인이 가능하다.y=x^n이 상단 그래프, y=x^1/n이 하단 그래프들이다. 좌에서 우로 갈수록 n이 1만큼 오르며 그래프를 나타냈다..

0~1 패턴만들기#ifdef GL_ESprecision mediump float;#endif#define TWO_PI 6.28318530718#define PI 3.141592uniform vec2 u_resolution;uniform float u_time;void main(){ vec2 coord = gl_FragCoord.xy/u_resolution; //coord = coord*2.-1.; coord.x *= u_resolution.x/u_resolution.y; coord *= 3.; coord = fract(coord); //coord = mod(coord,1.0); vec3 col; col = vec3(coord,0.0); //..

Translate 매트릭스#ifdef GL_ESprecision mediump float;#endif#define TWO_PI 6.28318530718#define PI 3.141592uniform vec2 u_resolution;uniform float u_time;float bar(vec2 loc, vec2 size, vec2 coord){ vec2 sw = loc - size/2.0; vec2 ne = loc + size/2.0; vec2 ret = step(sw,coord) - step(ne, coord); return ret.x*ret.y;}float cross(vec2 loc, vec2 size, vec2 coord){ float b1 = bar(loc, size, c..

Rectangle - 사각형#ifdef GL_ESprecision highp float;#endif#define TWO_PI 6.28318530718#define PI 3.141592uniform vec2 u_resolution;uniform float u_time;vec3 rect(vec2 coord, vec2 loc, vec2 size){ vec2 sw = loc-size/2.0; vec2 ne = loc+size/2.0; vec2 pct = step(sw,coord); pct -= step(ne,coord); return vec3(pct.x * pct.y);}void main(){ vec2 coord = gl_FragCoord.xy/u_resolution; ..

#ifdef GL_ESprecision highp float;#endif#define TWO_PI 6.28318530718#define PI 3.141592uniform vec2 u_resolution;uniform float u_time;// Function from Iñigo Quiles// https://www.shadertoy.com/view/MsS3Wcvec3 hsb2rgb( in vec3 c ){ vec3 rgb = clamp(abs(mod(c.x*6.0+vec3(0.0,4.0,2.0), 6.0)-3.0)-1.0, 0.0, 1.0 ); rgb = rgb*rgb..

https://thebookofshaders.com/05/?lan=krhttps://iquilezles.org/articles/functions/ Inigo QuilezArticles on computer graphics, math and artiquilezles.org

https://thebookofshaders.com/glossary/ The Book of ShadersGentle step-by-step guide through the abstract and complex universe of Fragment Shaders.thebookofshaders.com셰이더에디터에서 사용되는 내장함수들을 지피티를 활용해 정리를 해보앗다. 📌 수학 관련 함수1. 각도 & 삼각함수radians(deg) / degrees(rad)sin(x), cos(x), tan(x)asin(x), acos(x), atan(y, x)👉 파도, 원형 궤적, 회전 등에 많이 씀.2. 지수 & 로그pow(x, y) → x^ysqrt(x) / inversesqrt(x) → √x, 1/√xexp(x)..

#ifdef GL_ESprecision mediump float;#endifuniform vec2 u_resolution; //화면 해상도 변수(가로X, 세로Y)uniform vec2 u_mouse; //마우스 좌표(x,y)uniform float u_time; //경과 시간 // Plot a line on Y using a value between 0.0~1.0float plot(vec2 st, float pct){ float span = 0.356; return smoothstep( pct-span, pct, st.y) - smoothstep( pct, pct+span, st.y);}void main() { vec2 st = gl_FragCoord.xy/u_resol..