본문 바로가기
유니티5 독학 & 게임 제작

유니티5 독학하기 그 78.5번째 걸음-패러렉스 스크롤링 살펴보기

by 인터넷떠돌이 2018. 8. 29.
반응형

안녕하세요?


이번에는 연습용으로 만드는 게임에서 패러랙스 스크롤이라고 해서, 먼 곳에 있는 배경은 느리게 움직이게 만들고, 가까이 있는, 카메라에 가까이 있을 수록 더 빠르게 움직이게 만드는 것으로 입체감을 주는 기법이 있습니다. 이걸 당장에 자세하게 알려주는 곳이 없어서, 일단 무료 에셋을 가지고서 한번 살펴보고자 합니다.



유니티5의 에셋스토어에서 한번 무료로 쓸 수 있는 parallax를 찾도록 합니다.



일단 Free Parallax for Unity(2D)라는 에셋을 선택하도록 합니다.



다운로드가 완료되면 기존의 프로젝트에 등장을 하게 됩니다.



일단은 먼저 Step by Step 가이드를 읽어보도록 했습니다. 그래도 실물을 보지 않고서는 정확하게 알 수 없기 때문에, 이제 실물을 보고자 합니다.



먼저 유니티5에서 기존의 프로젝트에 방해를 주지 않기 위해서 새로운 프로젝트를 생성해서 테스트를 하도록 해 봅니다.




일단 씬을 불러들였을 경우, 위 스크린샷과 같은 예제가 있는 것을 볼 수 있습니다.



일단 Parallax라는 게임 오브젝트를 생성한 다음, 여기 아래에다가 다른 게임 오브젝트들을 만들고, 당연히 Sprite Renderer 컴포넌트를 추가하는 것으로 해서, 하나하나 패러렉스 스크롤의 구성재료가 될 스프라이트와 배경화면등을 가지고 오도록 합니다.



먼저 Parallax라는 가장 상위의 게임 오브젝트를 클릭해서 인스펙터 뷰를 보면, Free Parallax.cs라는 스크립트에 관여되어 있는 컴포넌트가 있는 것을 볼 수 있는데, 여기서 가장 중요한 것은 Element들 입니다.



먼저 가장 먼 곳의 배경이 되는 화면을 한번 클릭해 보았습니다. 이 게임 오브젝트는 가장 카메라에서 멀리 있는 게임 오브젝트 이며, 2개의 그림이 이어져서 있는데, 여기서 중요한 것은 이 2개의 이미지가 계속 연속해서 이어져야 한다는 것 입니다.



다음으로는 Element1을 한번 보도록 했는데, 여기서는 먼저 Sorting Order의 값이 Element0에 비해서 더 큰 것을 볼 수 있는데, 이 값이 커지면 더 카메라에 가까워 진다고 합니다.




그리고 foreground를 구성하는 스프라이트도 윗쪽은 투명하게 비어 있는 지평선을 나타내는 바닥같은 배경이 있는데, 여기서도 역시 중요한 것은 이 2개의 스프라이트가 서로 이어져도 어색하지 않게 만들라는 것 입니다.



다음으로는 가장 가까이 있는 것으로 보이는 Element 2 입니다. 자세히 보면 점점 Speed Ratio가 더 커지는 것을 볼 수 있습니다. 그 만큼 같은 스크롤을 움직였을 경우, 이 레이어는 더 빨리 움직인다는 것을 알 수 있습니다.



여기서는 단 1개의 상부는 투명한 스프라이트라는 것을 볼 수 있는데, 여기서도 한가지 명심해야 하는 것은, 이 스프라이트가 계속해서 이어지기 때문에, 이어 붙어졌을 경우 어색하지 않아야 한다는 것 입니다.



그리고 이번에는 나무를 만들어 주는 Element 3인데, 여기서는 Min Y & Max Y, Min X & Max X를 설정해 주는데, 이 값을 저정해 주면, 저 값중에서 랜덤으로 위치가 결정된다고 보면 됩니다. 즉 가지런히 모여있는 타일이나 이런 것이 아니라, 드문드문 있는 저 멀리 있는 나무 같은 것들이 이런 식으로 하는 것으로 보입니다.



역시나 같은 나무의 스프라이트만 쓰면 심심할 수는 있어서 인지, 2개의 나무 스프라이트를 사용한 것을 볼 수 있습니다.




다음으로는 하늘에 항상 떠 있는 달인데, 이 경우에는 다시 생기면 안되기 때문에 Min X와 Max X가 9999로 최고 숫자로 만들어 준 것을 볼 수 있습니다. 그리고 속도 역시 0.0005로 정말 느리게 Speed Ratio를 지정했다는 것을 알 수 있습니다.



그리고 개인적으로는 position Mod라고 해서 스프라이트가 계속해서 연속해서 생성되는 것을 볼 수 있는데, 여기서 나머지는 화면의 상단이나 하단에 붙어 있다는 것은 이해할 수 있는데, 여기서는 Individual Start Off Screen과 Individual Start On Screen의 차이를 몰랐습니다.



먼저 Individual Start Off Screen의 경우입니다. 아직 파란색 박스안이 카메라가 비추는 화면이고, 빨간색 박스는 화면밖에서 미리미리 생성이 된 패러랙스 배경 화면입니다. 여기서 Individual Start Off Screen으로 해 주면, 화면이 시작하기 전에 생성이 되어서 미리미리 준비가 된 것을 볼 수 있습니다.



하지만 Individual Start On Screen으로 Re Positioning Mod가 설정이 되어 있는 꽃다발이 있는데, 여기서는 먼저 스크린을 지나서 나가야 합니다.



먼저 꽃다발이 화면밖으로 지나가서, 사라지는 순간이 오면.....



저 앞쪽에서 Individual Start On Screen으로 되어 있는 오브젝트가 파괴된 다음에 다시 생성이 되는 것을 볼 수 있습니다.



마지막으로 Parallax 게임 오브젝트에 무슨 컴포넌트를 지정해야 하느냐 인데, 우선 여기서는 그냥 Free Parallax.cs라는 스크립트만 추가한 것을 볼 수 있습니다. 이렇게 해서 대략적으로 어떻게 하면, 패러랙스 스크롤을 사용할 수 있으며, 제가 만들고 있는 연습게임에는 어떻게 해야 적용이 가능한지 알아보았습니다. 다음 포스팅에서는 패러랙스 스크롤을 적용해서 좀더 배경이 재미가 있는 게임을 만들어 오겠습니다.

반응형