07
18

 

2D 게임에서는 무엇을 최적화해야할까

3D 게임이라면 성능에 가장 영향을 미치는 부분이 정점의 갯수라이트 연산일 것이다.

하지만 2D 게임이라면 화면 해상도오버드로우가 가장 큰 영향을 미친다.

(물론 3D도 동일하게 영향을 미친다)

 

화면의 해상도가 FHD(1920x1080) 일 때, 픽셀의 갯수는 약 200만개로,

이미지를 겹칠 때마다 그려야하는 픽셀 갯수가 곱해진다. 이를 오버드로우(Overdraw) 라고 한다. 

아무래도 2D 게임에서는 이미지를 겹쳐서 표현해야하다보니 투명도 있는 이미지가 많아지게 되고,

오버드로우를 피할 수는 없다. 

하지만 최대한 투명한 부분을 그리지 않도록 하여 오버드로우를 줄이는 방법이 존재한다.

 

 

오버드로우를 확인해보자

실험을 위해 유니티에서 아래와 같이 스프라이트 세개를 캔버스에 배치한 뒤, 

유니티의 Overdraw 디버깅툴을 통해 화면에 실제 그리고 있는 부분을 확인해 볼 수 있다.

(겹쳐지면 겹쳐질수록 픽셀의 색이 밝아진다)

실제 이미지는 투명한 부분이 상당히 많이 차지하지만 유니티 내에서는 투명한 부분도 캐릭터가 그려져있는 픽셀과 아무런 차이없이 그리고 있는 것을 확인할 수 있다.

 

 

오버드로우를 최적화해보자

스프라이트의 임포트 세팅에서 MeshType 을 FullRect -> Tight로 바꿔주자.

그런 뒤 오른쪽 아래의 Sprite Editor 버튼을 눌러 열린 창에서

다시 Custom Outline을 누른다.

Tolerance를 0.1정도의 수치로 두고, Generate를 눌러 Outline을 자동 생성을 해보자.

아래와같이 투명하지 않은 픽셀을 기준으로 외각선이 자동생성된다. 

이를 적당히 수정해서, 아래와 같이 예쁜 외각선으로 만들어준다.

완전하게 타이트하게 할 필요는 없고 이 또한 메쉬에 해당하기 때문에 너무많은 적당히 

(선 위를 누르면 새 점을 생성, 점을 드래그해서 옮기거나 선택된채로 Delete를 눌러 지울수 있다)

그런 뒤, Image 컴포넌트의 Use Sprite Mesh를 체크해주자.

(월드에 배치된 2D 오브젝트면 따로 세팅할 필요없다)

이제 다시 overdraw를 확인해보면 스프라이트 에디터에서 설정한 외각선대로 메쉬가 그려지는 것을 확인할 수 있다.

투명한 부분을 그리지 않게되니 오버드로우가 최적화되었다!

 

주의사항

1. 이미지를 Slice-9으로 사용하려면 FullRect가 필수기 때문에, Tight로 체크하면 안된다. FullRect로 사용할것.

2. 쉐이더 등으로 물체의 외각선등을 표현할 때는 메쉬 경계선에 주의한다. 너무 타이트하면 잘려버린다.

 

 

 

 

 

COMMENT