UNITY COOKBOOKSHOT BY. INS

PART 13빛과 캔버스

빛의 표현

유니티에서는 ‘ Directional Light’ 의 표현만 있는 것이 아닙니다 .한 객체를 표현하더라도 여러가지의 빛 연산을 통해 물체를 표현하고 우리가 식별할 수 있게끔 구성되어 있습니다 .게임에서의 필요한 광원이 무엇이 있고 유니티에서 어떻게 활용하는지에 대해서 하나씩 알아보겠습니다 .

( 1 / 11 )

# Global Illumination # 광원의 기본요소 3 가지 # Ray Tracing

Skybox #1

에디터를 처음 실행했을 때의 하늘은 구름 한 점 없는 밋밋한 상태죠 . 그러나 이 하늘마저도 커스텀마이징이 가능합니다 .어셋스토어에서 위 이미지의 어셋을 받은 뒤에 ‘ Window’ – ‘Lighting’ 옵션에서 ‘ Skybox’ 를 조정하는 공간이 있습니다 .우리가 받은 어셋 중 하나를 적용해보면 게임상에서의 하늘이 변경되는 것을 볼 수 있습니다 .

( 2 / 11 )

# 변경 된 skybox

Skybox #2

게임상에서의 하늘 표현은 간단합니다 .육면체를 구성하는 여섯 개의 텍스쳐를 이어붙여 그 안에 카메라가 들어가는 개념이죠 . 그래서 ‘ skybox’ 입니다 .다른 엔진에서는 돔 형태로 하늘을 씌우는 테크닉도 존재합니다 .

( 3 / 11 )

# 박스 형태의 하늘 # 돔 형태의 하늘

환경광 (Ambient Light)

전에 배운 ‘ diffuse’, ‘specular’ 라이팅에 이어 ‘주변광ㆍ환경광‘ 이라고 불리우는 ‘ ambient light’ 이라는 녀석을 소개합니다 .말 그대로 환경에서 받는 라이트이며 , 육안으로도 볼 수 있듯이 ‘ skybox’ 색감에 따라 모든 물체가 받는 색감이 달라집니다 .이는 태양으로부터 받는 빛이 여러 물체에 산란되어 주변을 밝히는 테크닉이였지만 비용이 너무 들어서 내놓은 방안이‘skybox’ 같은 광원의 평균 색상치를 모든 객체의 합성하는 식으로 만드는 추세입니다 .

( 4 / 11 )

산란 조도 (Reflection Bounce)

물론 빛의 산란이 아예 존재하는 것은 아닙니다 . ‘Reflection Bounce’ 이라는 기능으로 별도로 존재하죠 .빛이 산란하여 튕겨져 받는 세기 값만 판별하여 고급스럽고 비용이 큰 알고리즘 대신에 근사한 값을 쓰는 녀석이죠 .값을 조정해보면 바닥에 튕겨져 비추는 빛의 세기를 느낄 수 있습니다 .

( 5 / 11 )

안개 (Fog)

마지막으로 Lighting 의 기능인 안개 (Fog) 를 알아보겠습니다 .카메라의 거리를 식별하여 일정 범위 내에서의 빛의 휘도 (luminance) 를 감쇄시켜 버립니다 .거리가 멀리 있는 물체는 빛의 세기를 잃어 어두컴컴하게 보이게 되는 안개 효과를 가지게 되는 것이죠 .

( 6 / 11 )

캔버스를 더 고찰 #1

우리가 전에 배웠던 캔버스는 카메라와 카메라끼리의 혼합 (Blending) 이라고 알고있습니다 .심지어 캔버스용 카메라는 2D 형식이라 World Space 공간의 게임 카메라와는 크게 거리가 멀죠 .그래서 3D 오브젝트를 캔버스에 그리고 싶으면 일반적인 방법이 2D 로 컨버팅 해주는 컴포넌트가 필요합니다 .이러한 2D 객체를 표현하기 위해서 나온 것이 ‘ UI‘ 기능입니다 .

( 7 / 11 )

캔버스를 더 고찰 #2

텍스트를 스크립트로 조정하는 방법을 알아보겠습니다 . 우선 멋진 폰트를 ‘ Project View’ 에 추가하고‘Text’ 에 폰트를 입혀봅니다 . 그리고 스크립트를 새로 만드는데 UI 를 접근하려면 ‘ UnityEngine.UI’ 를 항상 기재합니다 .프레임당 1 씩 추가하여 ‘ Text’ 에 직접적으로 그려주는 스크립트를 만들고 ‘Text’ 에 적용하면 카운트가 올라가는 ‘ Text’ 를 보실 수 있습니다 .

( 8 / 11 )

캔버스를 더 고찰 #3

이제 ‘ Image’ UI 를 다루는 방법을 알아보겠습니다 .일반적으로 이미지 객체도 2D 개념이기 때문에 일반적은 Texture 를 지원받지 않습니다 .텍스쳐 자체를 ‘ Sprite’ 형식으로 컨버팅 후에 적용하는 방식이라 . 직접 ‘ Project View’ 에서 수정 뒤 적용해야 합니다 .

( 9 / 11 )

캔버스를 더 고찰 #4

마지막으로 슬롯머신을 만들어보겠습니다 . 여러 종류의 사진과 배경이 투명한 사진을 준비한 뒤에 ‘ Sprite’ 로 전환합니다 .이후 ‘ Sprite Mode’ 를 Multiple 를 적용하면 Sprite 를 별도의 작은 파일로 관리할 수 있는데 ‘ Sprite Editor’ 을 눌러보면포토샵과 같은 구간이 나옵니다 . ‘slice’ 버튼을 누르면 자동으로 투명 픽셀이 아닌 곳을 찾아 별개의 파일로 잘라줍니다 .포토샵이 필요없는 아주 좋은 녀석이죠 .

( 10 / 11 )

캔버스를 더 고찰 #5

위와 같은 스크립트를 작성하시고 아까 잘라 놓은 이미지 파일들을 스크립트에 집어넣습니다 .이후 게임을 실행하여 스페이스바를 눌러보면 랜덤으로 이미지가 불러와 지는 것을 볼 수 있습니다 .이상 빛의 표현과 캔버스 UI 응용에 대해서 알아보았습니다 .

( 11 / 11 )

Thank You !