그래픽 디자이너를 위한 기초 쉐이더 강좌2 by 김윤정


http://www.gamedevforever.com/32
에서 연재하는 글입니당 :)



1. 시작합니다.


저번 시간에는 프롤로그에 가까웠지요. 이번부터가 진짜 강의입니다. shaderFX는 다 설치 하셨는지요?
이번 시간에는 shaderFX의 기본 사용법과 기초 이론을 알아보도록 하지요.
또한 shaderFX 를 이용해서 할 수 있는 일도 간단하게 소개해 드릴께요.

2. ShaderFX 기본 사용법

2-1 실행해 봅시다.

이제 ShaderFX가 설치되었으면 우선 실행을 해야 합니다. Render/ShaderFX를 실행해 봅시다.



이런 창이 열릴 겁니다. 왠 도마뱀이 꼬리를 치고 있네요.
등록되었다지 않았다는 말이 나오고 있긴 하지만, 어차피 무료입니다. 사용하는데는 아무런 문제가 없습니다.

이게 shader FX 라고 하는 프로그램이고, 그냥 '또 하나의 메터리얼 에디터' 라고 생각하셔도 아무런 문제가 없습니다. [각주:1]



2-2 쉐이더를 만들고, 오브젝트에 적용해 봅시다.

자 그럼 뭔가 일단 하나 만들어 보고 시작할까요.
가장 만만한 녀석인, 주전자 하나 만들어 봅시다. 그래픽 디자이너라면 이 정도는 쉽게 하시겠지요?
네? 원화 디자이너라서 못하신다고요? 허허허허허허허허허허허허허허허허허허허허허허허허허허허허허허허허허허
이건 기술 축에도 들지 못하는 간단한 기능입니다. 그냥 클릭 두 번만 하면 되는건데요. [각주:2]



주전자가 만들어졌으니 이제 여기에 메터리얼(shader)을 입혀야 겠지요

shaderFX의 창에서 StandardMat_ 어쩌고라고 씌여진 창을 클릭합니다.
이게 지금부터 만들 shader의 루트(Root) 창 입니다. 가장 기본이 되는 베이스예요.

그리고 주전자도 클릭합니다. 이제 주전자에 이 shader를 적용할 예정이니,
반드시 두 개가 같이 선택이 되어 있어야만 하는 거지요.


자, 이렇게 두 개가 모두 선택이 되었다면, 이번엔 shaderFX의 창에서Tool/Assign Material to Selection 을 누릅니다.


음? 왠 경고가 뜹니다.


경고 내용을 차분하게 읽어보면, '당신은 아직 FX 파일이 어디에 생성될 것인지 결정하지 않았으니 임시로 내가 만들어 놓겠소' 라는 뜻입니다. 뭐, 일단은 큰 상관 없습니다. [확인] 을 눌러서 다음으로 넘어가 보지요.

짜잔.


축하드립니다! 첫 번째 쉐이더를 완성하셨습니다!!! 자 이제 끝!








... 물론 이건 끝이 아닙니다. 이제 시작일 뿐이죠.







2-3 빠알간 주전자를 만들어 봅시다.

프로그래머가 쉐이더를 배울 때, 제일 처음 하는 것이 바로 이 '빨간 공' 만들기 입니다 .
우리는 명색이 그래픽 디자이너이니, 빨간 공으로 만족할 수 없습니다. 빨간 주전자를 만들어 봅시다!!! 간디작살
만들기는 매우 간단합니다.

shaderFX의 화면의 빈 곳에서 오른쪽 클릭을 하면 나오는 메뉴에서, Maps/Color 를 선택하는 것입니다.
Map는 말그대로 맵을 만든다는 것이고, 그 중 "Color Map" 하나를 만든다는 것이지요.

필자의 이름이 그림에 고스란히 노출되었지만, 못 본 척 하고 지나가도록 합시다.


이렇게 하면, 왠 회색 사각형 카드 같은게 하나 나오게 됩니다. 이게 Color Map 오브젝트 입니다.
이름도 Color 네요.
이 Color 오브젝트를 선택하면 오른쪽에 해당되는 인터페이스가 나오므로, 여기서 빨간색으로 바꿔 줘 봅시다.
오른쪽 인터페이스에서 이름도 바꿀 수 있으니까, 원하시면 바꾸시면 되지요.


빨간색 오브젝트가 되었습니다. 공은 아직도 하얀색이지요. 별로 바뀐게 없습니다.

자 이번엔 빨간색 오브젝트 아래에 있는 RGB 라고 씌인 녹색 동그라미를 보십시오.
이걸 마우스 왼쪽 클릭 - 드래그 하면 왠 선이 나오는데 , 이것을 Ambient Color 로 이어줍니다.


선 끝에 float3 라고 씌여 있습니다. 조만간 이걸 설명할테니 관심을 가져 주세요.


그냥 드래그해서 Ambient Color에 놓고 오면 됩니다.
"빨간 맵을 엠비언트라고 하는 요소에 적용" 했습니다.
공이 빨갛게 변했습니다!!! 이런 종북좌파빨갱이!


선을 끊는 방법은, 선을 선택하고Delete 키를 누르기만 하면 됩니다.
다시 이어주는 것은 언제건 상관없이 할 수 있습니다.


색을 바꾸는 것은 다시 color 오브젝트를 선택하고 , 다른 색으로 바꿔주면 됩니다.
그런데 되지 않습니다. 응?



놀랄 필요 없습니다. 이렇게 칼라를 바꾸는 경우에는 F5나 Color옆의 'Set'버튼을 눌러주기만 하면 적용됩니다.



주의사항 : shader FX로 만들고 적용한 재질은 렌더링되지 않습니다!!!! 보통 그래픽 디자이너들이 말하는 렌더링은 , Render 버튼을 눌러서 파일로 렌더링 하는 오프라인 렌더링 (Offline Rendering)을 의미합니다만, 그것은 불가능합니다.

여기서 만들고 있는 Shader는 뷰포트에서만 보이는 리얼타임 렌더링(Realtime Rendering) 전용이기 때문에 뷰포트에서 보이는 것이 곧 결과물이므로, 이 결과물을 그래픽 파일로 만들고 싶으시면 화면을 캡쳐(PrintScreen) 하는 수 밖에 없습니다.




2-3 저장하기
일단 첫 쉐이더를 완성하셨음을 축하드립니다. 프로그래머들도 이런 식으로 첫 번째 쉐이더를 만들거든요. [각주:3]
어쨌거나 이제 이 쉐이더를 저장하는 법을 알려 드리겠습니다.

shaderFX 에서 저장하는 법은 두 가지가 있습니다. 하나는 shaderFX에서 만든 이 구조 (선을 연결해서 이어 만드는 구조 - 노드구조- 라고도 하지요) 를 .SFX 파일로 저장하는 것과, 여기서 제작한 것을 표준 쉐이더 파일 포맷인 .FX 파일로 저장하는 것입니다.

일반적으로 이 작업을 하실 때에는.SFX 파일을 꼭 저장하셔야 나중에 불러와 수정하거나 할 수 있기 때문에 이것은 꼭 저장을 하셔야 합니다. 이것이 일반적으로 그래픽 디자이너가 알고 있는 '저장' 의 개념이지요.[각주:4]
.SFX 파일은 shaderFX 전용 파일 포맷으로, 다른데서 쓸 수 없습니다. 오직 shaderFX에서만 쓸 수 있는 파일입니다.

.FX 로 저장한다는 것은, 마치 그래픽 프로그램에서 다른 프로그램으로 파일을 넘기기 위해 익스포트(Export) 하는 개념과 비슷합니다. .FX는 쉐이더 프로그램 언어인 HLSL(High Level Shader Language) 의 표준 파일 포맷으로, 이것으로 저장하게 되면 3D max를 비롯하여 일부의 게임 엔진에서도 이 쉐이더 파일을 직접 사용할 수 있으며, 다른 게임 엔진이라고 하더라도 약간의 수정을 통해 게임에서 실제로 사용할 수 있게 만들 수 있습니다.

.SFX 파일로 저장하기는 어렵지 않습니다.

그냥 우리가 알고 있는 일반적인 저장이기 때문입니다. Ctrl+S 만 눌러줘도 저장할 수 있습니다. .SFX 파일로요.


그런데, 이 쉐이더 파일을 게임엔진이나 맥스에서 사용할 수 있는 전용 쉐이더 프로그램으로 export 하려면, 다른 메뉴를 사용해야 합니다. 이것은 실제로 이 강의 동안에 사용할 일은 없을 것입니다만, 만약 여러분들이 만든 쉐이더를 실제로 게임에 사용해야 할 필요가 생겼다던가 할 때에는 FX 파일로 익스포트를 해 주어야 합니다.

이렇게 저장하기 위해서는 아래 그림과 같이, 3D max에서 사용할 수 있는 FX 파일과
기타 다른 프로그램들에서 사용할 수 있는 FX 파일로 익스포트 할 수 있습니다.


익스포트 옵션은 여러 개가 있습니다. DirectX 를 위한 옵션도 있고, 다른 여러 엔진에 따라 저장할 수 있는 옵션들이 있습니다. 미리 익혀 둘 필요는 없고, 만약 사용할 일이 생기면 그 때 엔진 프로그래머와 상의하면 되겠습니다.


이렇게 FX로 출력하면, "표준 hlsl 언어"로 출력되어, 대부분의 게임엔진에서 어느 정도만 수정하면 사용할 수 있게 됩니다. 그렇지만 연습용이 아닌 이상 실제로 사용하기는 쉽지 않은데요,

그것은 바로 아래와 같이 '코드가 너무 쓸데없이 복잡하게 나오기 때문' 입니다.
단순히 붉은 주전자 하나만 출력하는 쉐이더 코드임에도 불구하고, 최적화를 전혀 해주지 않기 때문에 복잡한 라이트 연산이 모두 들어 있는 채로 출력됩니다. [각주:5]

즉 제작하기 간편한 대신 최적화가 전혀 되어 있지 않은 채로 익스포트 되기 때문에, 사실상 실무에서 사용하기 위해서는 이 fx 파일을 바로 사용하기 보다는 이 파일을 참고해서 재 작성하는 쪽이 훨씬 빠르고 편합니다.



저도 hlsl언어를 직접 다루게 된 이후부터는 이렇게 shaderFX에서 출력한 쉐이더 코드를 직접 사용하지는 않게 되었지만, 가끔씩 기능 구현의 힌트를 얻고 싶을 때에는 이렇게 쉽게 짜서 출력한 코드를 보고 참고하면 꽤 도움이 될 때도 있었습니다.


자, 이렇게 해서 가장 기본적인 쉐이더를 shaderFX를 이용하여 작성해 보았습니다. 다음 시간에는 이런 것이 연재됩니다.

- 텍스쳐를 넣어봅니다!!! 뭐, 사실 위의 것을 할 수 있으시다면 벌써 할 수 있으십니다!!! 매우 쉽지요.
- 그런데, 여기서 드디어 이론이 들어갑니다! float3의 비밀이 풀리는 시간입니다. 색의 이론에 대해서 배우게 되지요.
  1. 실제로 최신 버전 3D max의 메터리얼 에디터는 shaderFX와 흡사한 모양의 에디터 창을 가지고 있습니다. [본문으로]
  2. 미리 말씀드렸다시피, 3Dmax의 기초 정도는 아셔야 가능한 강의입니다. 기초 책을 봐도 2-3일 정도만 공부하시면 알 수 있는 레벨이지요. 별로 안어렵습니다. 공부하세요. [본문으로]
  3. 물론 프로그래머들은 같은 일을 각종 코드들을 쳐 넣어서 하지만요 [본문으로]
  4. 프로그래머들은 '워크 스페이스를 저장한다' 라고 말하면 알아듣습니다. [본문으로]
  5. 실제 저 빨간 주전자 구현을 코드로 짜면, 몇 줄밖에 되지 않습니다. [본문으로]

덧글

  • 김경진 2012/01/03 09:39 #

    강좌 고맙습니다.

    여기까지 무사히 왔습니다.


    float3의 비밀이 풀리는 시간입니다.....비밀이 기대 됩니다. ^^
  • 김윤정 2012/01/03 19:39 #

    기다려 주셔서 감사합니다 :) 연재주기를 빠르게 하고 싶네요!!!
※ 로그인 사용자만 덧글을 남길 수 있습니다.


MyADD

<script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>