Shader (6) 썸네일형 리스트형 GLSL 접근 제어자 ( in, out, inout ) in: 입력 변수를 나타낸다. 이 변수는 셰이더로 데이터가 입력된다. 예를 들어, 정점 셰이더에서 정점의 위치를 나타내는 변수는 in으로 선언될 수 있다. in vec3 position; out: 출력 변수를 나타낸다. 이 변수는 셰이더에서 처리된 결과를 출력한다. 정점 셰이더에서 정점의 위치를 처리한 후, 이를 프래그먼트 셰이더로 전달할 때 사용될 수 있다. out vec3 fragmentColor; inout: 입출력 변수를 나타낸다. 이 변수는 셰이더로 데이터가 입력되고 처리된 후 결과가 다른 곳으로 출력될 때 사용된다. 일반적으로 geometry shader에서 사용되며, geometry shader에서 입력 기하 형태를 조작하고 수정한 후에 출력으로 전달할 때 사용한다. inout vec3 ge.. GLSL - 그라데이션 #ifdef GL_ES precision mediump float; #endif uniform vec2 u_resolution; uniform vec2 u_mouse; uniform float u_time; //전처리 vec3 colorA = vec3(0.1, 0.2, 0.3); vec3 colorB = vec3(1.000,0.5,0.3); //색상 설정 void main() { vec2 st = gl_FragCoord.xy/u_resolution.xy; //화면 길이 및 비율 값을 담고 있는 변수인 st를 생성 vec3 color = vec3(0.0); //기본 색상 설정 vec3 pct = vec3(st.x); //pct 변수 생성 //x축을 기준으로 색상을 변경시킬 예정이므로 st값의 x값만 추출하.. 시작 - GLSL [1] 각 GLSL 에디터마다 제공되는 코드는 다르지만 그 목적은 거의 비슷하다. 따라서 오늘은 기본 제공되는 코드들을 분석해보겠다. #ifdef GL_ES precision mediump float; #endif uniform float u_resolution; uniform float u_mouse; uniform float u_time; void main() { gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); } The Book of Shader Editor에서 새 프로젝트를 시작하면 GLSL 파일을 생성하면 아래와 비슷한 기본 코드가 제공된다. #ifdef GL_ES 이 줄은 GLSL 코드가 WebGL에서 실행될 때 해당하는 코드 블록을 컴파일하도록 하는 전처리기 지시문입니다. .. lowp mediump highp #ifdef GL_ES precision mediump float; #endif uniform vec2 u_resolution; uniform vec2 u_mouse; uniform float u_time; 새 프로젝트를 시작하면 위 코드가 보일것이다. (Shader Toy의 경우엔 표시되지 않는다.) 이번 글에서 알아볼 것은 위에서 2번째 줄에 위치한 'precision mediump float;'이다. lowp, mediump, highp는 정밀도 설정이다. 아마 low, medium, high 뒤에 있는 p는 precision을 의미하는 것 같다. 이 경우 정밀도는 값을 저장하는데 얼마나 많은 비트를 사용할지를 말한다. low에서 high로 올라갈 수록 많은 비트를 사용해 더 정확한 쉐이더를 뽑을 .. 쉐이더 기본 설정 개발 환경: Visual Studio Code필요한 Extension: glsl-canvas GLSL 시작하기 GLSL을 시작할 수 있는 방법은 매우 다양하다. 웹에서 제공하는 editor를 사용하도 무관하며 Visual Studio Code에서 제공하는 Extension을 이용해도 괜찮다. 이번 글에서는 앞으로 GLSL을 만들 수 있는 방법을 소개해보겠다. 1. Shader Toy https://www.shadertoy.com/ 가장 대중적인 쉐이더 에디터이다. 커뮤니티가 굉장히 크며, 그에 따라 얻을 수 있는 코드 및 설명도 많다. 유튜브에서 GLSL코딩을 검색한다면 위 사이트를 이용하는 강의도 많다. 2. The Book of Shaders Editor http://editor.thebookofshaders.com/ The Book of Shaders라는 사이트에서 제공하는 Editor이다. https://.. 이전 1 다음
