셰이더 사용 가이드
셰이더는 게임에서 아름다운 그래픽 효과를 만드는 데 자주 사용됩니다. GameMaker의 고급 기능 중 하나이므로, 셰이더를 사용하기 전에 프로그래밍과 GameMaker의 기본 개념을 이해하는 것이 중요합니다.
셰이더란?
셰이더는 원래 조명 처리(그 이름에서 유래됨)를 위해 만들어졌으나, 현재는 다양한 효과를 생성하는 데 사용됩니다. 셰이더 코드는 일반 코드와 유사하지만 GPU에서 실행되며, CPU가 아닌 GPU의 특정 규칙과 한계에 따라 작동합니다.
각 셰이더는 두 가지 구성 요소로 이루어져 있습니다: 정점 셰이더(Vertex Shader)와 프래그먼트 셰이더(Fragment Shader).
정점 셰이더
스프라이트는 직사각형으로 형성되지만, 컴퓨터는 삼각형을 그리므로 직사각형은 두 개의 삼각형으로 나누어집니다. 각 스프라이트는 네 개의 독립적인 정점을 가집니다. 정점 셰이더는 각 정점의 위치와 색상을 변경하며, 그 후 프래그먼트 셰이더로 넘겨줍니다.
예시 코드:
// 정점 셰이더
attribute vec3 in_Position; // (x,y,z)
attribute vec4 in_Colour; // (r,g,b,a)
void main() {
// 화면 위치 계산
gl_Position = ...;
}
프래그먼트 셰이더
프래그먼트 셰이더는 스프라이트의 각 픽셀을 처리하여 그 픽셀의 최종 색상을 결정합니다. 예를 들어 스프라이트를 흑백으로 만들고 싶다면, 각 픽셀의 회색 음영을 계산하여 할당합니다.
예시 코드:
// 프래그먼트 셰이더
void main() {
// 픽셀 색상 계산
gl_FragColor = ...;
}
셰이더 변수
셰이더에서 사용할 수 있는 변수 타입은 다음과 같습니다:
| 키워드 | 설명 | |-------------|------------------------------------------------------------------| | Attribute | 정점 셰이더에 의해 읽어지는 변수를 정의합니다. (정점 위치 등) | | Varying | 정점 셰이더와 프래그먼트 셰이더 간에 데이터를 전달하는데 사용됩니다.| | Uniform | 객체마다 변하는 변수를 정의하며, 사용자에 의해 설정됩니다. |
예시 코드:
vec4 texColor = texture2D(gm_BaseTexture, v_vTexcoord);
벡터 선언 및 초기화
셰이더에서 벡터를 사용할 수 있습니다. 다음은 다양한 벡터 타입에 대한 예시입니다:
vec2 firstVec = vec2(2.0, 1.0);
vec4 secondVec = vec4(1.0, firstVec, 0.0);
셰이더 생성하기
GameMaker에서 셰이더를 만들면 정점 셰이더(.vsh)와 프래그먼트 셰이더(.fsh)의 두 개 파일이 열립니다. 기본 셰이더는 스프라이트를 읽고 각 픽셀에 색상을 적용합니다.
정점 셰이더 예시:
attribute vec3 in_Position;
attribute vec4 in_Colour;
void main() {
gl_Position = gm_Matrices[MATRIX_WORLD_VIEW_PROJECTION] * vec4(in_Position, 1.0);
}
프래그먼트 셰이더 예시:
varying vec2 v_vTexcoord;
void main() {
gl_FragColor = texture2D(gm_BaseTexture, v_vTexcoord);
}
이제 셰이더를 생성했으니, 객체를 만들고 스프라이트를 할당한 후에 드로우 이벤트에서 셰이더를 설정합니다:
shader_set(shdrColorOverlay);
draw_self();
shader_reset();
다양한 셰이더 예제
색상 오버레이 셰이더
void main() {
gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); // 빨간색으로 변경
}
흑백 셰이더
void main() {
vec4 texColor = texture2D(gm_BaseTexture, v_vTexcoord);
float gray = dot(texColor.rgb, vec3(0.299, 0.587, 0.114));
gl_FragColor = vec4(gray, gray, gray, texColor.a);
}
무지개 셰이더
먼저 HSV 값을 RGB로 변환하는 헬퍼 함수를 만듭니다:
vec3 hsv2rgb(vec3 c) {
// HSV를 RGB로 변환하는 코드
}
그 후, 메인 함수에서 색을 조정합니다:
void main() {
vec3 col = vec3(v_vTexcoord.x, 1.0, 1.0); // 색상 조정
gl_FragColor = vec4(hsv2rgb(col), 1.0);
}
이러한 예제를 참고하여 자신만의 셰이더를 만들어 보세요. 셰이더는 게임의 비주얼을 확장하는 강력한 도구입니다.