셰이더 디자이너

아티클
06/09/2015

이 문서에서는 Visual Studio 셰이더 디자이너로 셰이더라고 알려진 사용자 지정 시각 효과를 만들고 수정하며 내보내는 방법을 설명합니다.

셰이더 디자이너를 사용하여 HLSL 프로그래밍에 대해 모르는 경우에도 게임이나 응용 프로그램을 위한 사용자 지정 시각 효과를 만들 수 있습니다. 셰이더 디자이너에서 셰이더를 만들려면 셰이더를 그래프로 레이아웃합니다. 즉, 데이터와 작업을 나타내는 디자인 화면 노드에 추가한 다음 이들 사이를 연결하여 작업에서 데이터를 처리하는 방법을 정의합니다. 각 작업 노드에서 결과 시각화할 수 있도록 해당 지점까지 효과에 대한 미리 보기가 제공됩니다. 노드를 통해 셰이더의 출력을 나타내는 최종 노드로 향하는 데이터 흐름입니다.

지원되는 형식

셰이더 디자이너는 다음과 같은 셰이더 형식을 지원합니다.

형식 이름	파일 확장명	지원되는 작업(보기, 편집, 내보내기)
방향이 지정된 그래프 셰이더 언어	.dgsl	보기, 편집
HLSL 셰이더(소스 코드)	.hlsl	내보내기
HLSL 셰이더(바이트 코드)	.cso	내보내기
C++ 헤더(HLSL 바이트코드 배열)	.h	내보내기

시작

이 섹션은 DGSL 셰이더를 추가 하는 방법을 설명 사용자 Visual Studio 프로젝트를 시작할 수 있도록 기본 정보를 제공 합니다.

GDSL 셰이더에 프로젝트를 추가합니다.

솔루션 탐색기에서 셰이더를 추가시키고 싶은 프로젝트를 위해 바로 가기 메뉴를 열고, 추가, 새 항목를 선택합니다.
새 항목 추가 대화상자 에서, 설치 에서, 그래픽 을 선택하고 비쥬얼 셰이더 그래프(.sgsl) 을 선택합니다.
셰이더 파일의 이름 과 생성하고 싶은 위치 를 지정합니다.
추가 단추를 선택합니다.

기본 셰이더

DGSL 셰이더를 생성할 때마다, 최종 색상 노드와 연결된 꼭짓점 색상 노드를 갖는 최소한의 셰이더로 시작됩니다. 셰이더가 완전하고 기능적이더라도 수행하지 않습니다. 그러므로, 작업 셰이더를 생성하는 첫 번째 단계는 꼭짓점 색상 노드를 삭제하거나 다른 노드로부터 공간을 만들기 위해 최종 색상 노드로부터 연결을 끊습니다.

셰이더 디자이너에서 작업

다음 단원은 셰이더 디자이너를 사용하여 사용자 지정 셰이더를 만드는 방법을 설명합니다.

셰이더 디자이너 도구 모음

셰이더 디자이너 도구 모음에는 DGSL 셰이더 그래프 작업에 유용한 명령이 포함되어 있습니다.

셰이더 디자이너의 상태에 영향을 주는 명령은 주 Visual Studio 창의 셰이더 디자이너 모드 도구 모음에 있습니다. 디자인 도구와 명령은 셰이더 디자이너 디자인 표면에서 셰이더 디자이너 도구 모음에 있습니다.

다음은 셰이더 디자이너 모드 도구 모음입니다.

셰이더 디자이너 모달 도구 모음.

이 표에서는 왼쪽에서 오른쪽으로 나타나는 순서에 따라 나열된 셰이더 디자이너 모드 도구 모음에 있는 항목을 설명합니다.

도구 상자 항목	설명
Select	그래프에서 노드 및 가장자리와의 상호 작용을 사용합니다. 이 모드에서 노드를 선택하고 이동하거나 삭제할 수 있고 가장자리를 설정하거나 해제할 수 있습니다.
이동	창 프레임을 기준으로 셰이더 그래프의 이동을 사용합니다. 이동하려면 디자인 화면에서 한 점을 선택하고 주변으로 이동시킵니다. 선택 모드에서 ctrl 키를 누른 상태에서 팬 모드를 일시적으로 활성화합니다.
확대/축소	창 프레임을 기준으로 다소간 셰이더 그래프 세부 정보의 표시를 사용합니다. 확대/축소 모드로 디자인 화면에서 점을 선택하고 오른쪽이나 아래쪽으로 이동하여 확대하거나 왼쪽이나 위쪽으로 이동하여 축소합니다. 선택 모드에서 마우스 휠을 사용하여 ctrl 키를 누른 채 확대/축소할 수 있습니다.
크기에 맞게	창 프레임에 전체 셰이더 그래프를 표시합니다.
실시간 렌더링 모드	실시간 렌더링을 사용하는 경우 Visual Studio는 사용자 작업이 수행되지 않을 때도 디자인 화면을 다시 그립니다. 이 모드는 시간이 지남에 따라 셰이더 작업을 할 때 유용합니다.
구로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 구형 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
정육면체로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 큐브 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
원통으로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 원통형 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
원뿔로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 원뿔 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
주전자로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 주전자 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
평면으로 미리 봅니다.	활성화되면 셰이더를 미리 보는 데 평면 모델이 사용됩니다. 한 번에 한 미리 보기 모양만 활성화할 수 있습니다.
도구 상자	또는 도구 상자를 표시하거나 숨깁니다.
속성	또는 속성 창을 표시하거나 숨깁니다.
고급	고급 명령 및 옵션을 포함합니다. 내보내기 여러 형식으로 셰이더 내보내기를 사용합니다. 다른 이름으로 내보내기 HLSL 소스 코드 또는 컴파일된 셰이더 바이트코드로 내보냅니다. 셰이더 내보내기 방법에 대한 자세한 내용은 방법: 셰이더 내보내기를 참조하십시오. 그래픽 엔진 디자인 표면을 표시하는 데 사용되는 렌더러의 선택을 사용합니다. D3D11로 렌더링 Direct3D 11을 사용하여 셰이더 디자이너 디자인 화면을 렌더링합니다. D3D11WARP로 렌더링 Direct3D 11 WARP(Windows Advanced Rasterization Platform)를 사용하여 셰이더 디자이너 디자인 화면을 렌더링합니다. 보기 셰이더 디자이너에 대한 추가 정보의 선택을 사용합니다. Frame Rate(프레임 속도) 활성화되면 디자인 화면의 오른쪽 상단 모서리에 현재 프레임 속도를 표시합니다. 프레임 속도는 초당 그려지는 프레임 수입니다. 이 옵션은 실시간 렌더링 모드 옵션을 사용할 때 유용합니다. 팁 고급 단추를 선택하여 마지막 명령을 다시 실행할 수 있습니다.

노드 및 연결 작업

선택 모드를 사용하여 노드를 추가, 제거, 위치 변경, 연결 및 구성합니다. 이러한 기본 작업을 수행하는 방법은 다음과 같습니다.

선택 모드에서 기본 작업을 수행하려면

방법은 다음과 같습니다.
- 그래프에 노드를 추가하려면 도구 상자에서 노드를 선택한 다음 디자인 화면으로 이동합니다.
- 그래프에서 노드를 제거하려면 노드를 선택한 다음 Delete를 누릅니다.
- 노드 위치를 바꾸려면 노드를 선택한 다음 새 위치로 이동합니다.
- 두 개의 노드를 연결하려면 노드 한 개의 출력 터미널을 다른 노드의 입력 터미널로 이동합니다. 호환되는 형식의 터미널만 연결할 수 있습니다. 터미널 사이의 줄은 연결을 보여줍니다.
- 연결을 제거하려면 연결된 터미널 중 하나에 대한 바로 가기 메뉴에서 링크 중단을 선택합니다.
- 노드의 속성을 구성하려면 노드를 선택한 다음 속성 창에서 속성의 새 값을 지정합니다.

셰이더 미리 보기

셰이더가 응용 프로그램에 표시되는 방식을 이해하기 위해 효과를 미리 보는 방식을 구성할 수 있습니다. 응용 프로그램을 대략적으로 추정하기 위해 여러 개의 셰이프 중 하나를 선택하여 텍스처와 기타 재료 매개 변수를 렌더링 및 구성하고 시간 기반 애니메이션을 활성화하며 다른 각도에서 미리 보기를 검사할 수 있습니다.

도형

셰이더 디자이너에는 셰이더를 미리 보기 위해 사용할 수 있는 6개의 셰이프 모양 즉, 구, 큐브, 원통, 원뿔, 주전자 및 평면이 포함됩니다. 셰이더에 따라 특정 모양이 더 나은 미리 보기를 제공할 수 있습니다.

미리 보기 모양을 선택하려면

셰이더 디자이너 모드 도구 모음에서 원하는 도형을 선택합니다.

질감 및 재료 매개 변수

많은 셰이더는 응용 프로그램의 각 종류 개체에 대해 고유한 모양을 만들기 위해 텍스처와 재료 특성에 의존합니다. 응용 프로그램에서 셰이더가 어떻게 나타나는지 보기 위해 텍스처와 응용 프로그램에서 사용할 수 있는 매개 변수를 일치시키기 위해 미리 보기를 렌더링하는 데 사용하는 텍스처와 재료 속성을 설정할 수 있습니다.

다른 질감을 질감 레지스터에 바인딩하거나 다른 재료 매개 변수를 수정하려면

선택 모드에서 디자인 화면의 빈 영역을 선택합니다. 따라서 속성 창에 글로벌 셰이더 속성이 표시됩니다.
속성 창에서 변경할 텍스처 및 매개 변수 속성에 대해 새 값을 지정합니다.

다음은 수정할 수 있는 셰이더 매개 변수입니다.


		액세스 파일 이름
재질 주변		액세스 값
재질 확산		액세스 값
재질 발광		액세스 값
재질 반사		액세스 값
재질 반사 강도		액세스 값

시간 기반 효과

일부 셰이더는 효과를 애니메이션에 적용하는 시간 기반 구성 요소를 갖고 있습니다. 동작의 효과가 어떻네 나타나는지 보려면 미리 보기는 초당 여러 번 업데이트 해야 합니다. 기본적으로 미리 보기는 셰이더를 변경할 때에만 업데이트됩니다. 시간 기반 효과를 볼 수 있도록 이 동작을 변경하려면 실시간 렌더링을 사용해야 합니다.

실시간 렌더링을 사용하려면

셰이더 디자이너 도구 모음에서 실시간 렌더링을 선택합니다.

효과 검사

많은 셰이더는 각도 또는 방향성 조명 같은 변수의 영향을 받습니다. 이러한 변수 변화에 따라 효과가 반응하는 방법을 확인하기 위해 미리 보기 모양을 자유롭게 회전시켜 셰이더가 동작하는 방법을 관찰할 수 있습니다.

도형을 회전하려면

Alt를 누른 상태에서 디자인 화면의 한 점을 선택하고 이동시킵니다.

셰이더 내보내기

응용 프로그램에서 셰이더를 사용하기 전에 DirectX에서 인식할 수 있는 형식으로 내보내야 합니다.

HLSL 소스 코드 또는 컴파일된 셰이더 바이트코드로 셰이더를 내보낼 수 있습니다. HLSL 소스 코드는 .hlsl 파일 이름 확장명을 가진 텍스트 파일로 내보내집니다. 셰이더 바이트코드는 .cso 파일 이름 확장명을 가진 원시 이진 파일 또는 셰이더 바이트코드를 배열로 인코딩하는 C++ 헤더(.h) 파일로 내보낼 수 있습니다.

셰이더 내보내기 방법에 대한 자세한 내용은 방법: 셰이더 내보내기를 참조하십시오.

바로 가기 키

명령	바로 가기 키
선택 모드로 전환합니다.	Ctrl+G, Gtrl+Q S
확대/축소 모드로 전환	Ctrl+G, Ctrl+Z Z
이동 모드로 전환	Ctrl+G, Ctrl+P K
모두 선택	Ctrl+A
현재 선택 영역을 삭제합니다.	Delete
현재 선택을 취소합니다.	이스케이프
확대	Ctrl+마우스 휠 앞으로 더하기 기호(+)
축소	Ctrl-마우스 휠 뒤로 - 기호
디자인 화면을 위로 이동합니다.	마우스 휠 뒤로 PageDown
디자인 화면을 아래로 이동	마우스 휠 앞으로 PageUp
디자인 화면을 왼쪽으로 이동	Shit+마우스 휠 뒤로 마우스 휠 왼쪽 Shift+PageDown
디자인 화면을 오른쪽으로 이동	Shit+마우스 휠 앞으로 마우스 휠 오른쪽 Shift+PageUp
키보드 포커스를 다른 노드로 이동	화살표 키
키보드 포커스가 있는 노드를 선택합니다(노드를 선택 그룹에 추가)	Shift+스페이스바
키보드 포커스가 있는 노드의 선택 전환	Ctrl+스페이스바
현재 선택 전환(노드를 선택하지 않은 경우 키보드가 포커스를 갖고 있는 노드를 선택합니다)	스페이스바
현재 선택 항목을 위로 이동합니다.	Shift+위쪽 화살표
현재 선택 항목을 아래로 이동합니다.	Shift+아래쪽 화살표
현재 선택 항목을 왼쪽으로 이동합니다.	Shift+왼쪽 화살표
현재 선택 항목을 오른쪽으로 이동	Shift+오른쪽 화살표

제목	설명
게임 및 응용 프로그램을 위한 3D 자산 작업	텍스처, 이미지, 3차원 모델 및 셰이더 효과로 작업하기 위해 사용할 수 있는 Visual Studio 도구에 대한 개요를 제공합니다.
이미지 편집기	Visual Studio 이미지 편집기를 사용하여 질감과 이미지 작업을 수행하는 방법을 설명합니다.
모델 편집기	Visual Studio 모델 편집기를 사용하여 3-D 모델 작업을 수행하는 방법을 설명합니다.

다음을 통해 공유