[Unity] 제작한 디자인 소스를 유니티 프로젝트에 적용하기
안녕하세요~
PI Brain Battle 게임 UI 디자인을 맡은 S양 입니다.
보통 디자인 작업을 한다고 하면 포토샵, 일러스트, XD, 피그마 등등은 익숙하시죠?
저도 그랬답니다.
처음에는 피그마로 화면 디자인을 잡아 개발자 팀원에게 전달하려 했지만...
개발자 팀원이 디자인물을 보고 두 번 작업해야 하는 상황이 발생하기 때문에
개발언어인 Unity에서 디자인 작업을 하고 파일을 전달 하기로 했습니다.
본격적인 작업에 들어가기 전!
저희 팀은 작업 시간 단축을 위해 유니티 에셋 스토어 안 kit를 구매하여 사용했습니다.
그러나, 디자인 해 보신 분들이라면 알겠지만 소스는 100% 활용하기가 어려울 때가 많습니다.
직접 디자인이 필요한 경우가 더 많죠.
저희 팀의 경우 국가 캐릭터가 그러했습니다.
(노가다가 필요했던 26개국의 캐릭터들..)
Unity에서는 어떻게 등록하면 좋을까요?
1. 원하는 이미지를 png(배경 투명화)로 저장합니다.
(경우에 따라 jpg(배경 있음)으로 저장하셔도 상관없지만, 앱 소스는 보통 배경과 어우러는 일이 많기 때문에 png를 추천합니다.)
2. 사용 중인 Unity 프로젝트 > assets 파일 경로에 제작한 이미지 파일을 옮겨줍니다.
예시 : (C:\Users\My project\Assets\GUI PRO Kit - Casual Game\ResourcesData\Sprite\Component)
저희 팀은 "GUI PRO Kit (이하생략)"을 사용했기 때문에 접근이 용이하도록 해당 파일 안에 제작한 이미지를 보관했습니다.
assets 파일에 바로 보관하셔도 상관없습니다.
3. 제작 중인 Unity Project로 이동합니다.
4. Hierarchy 창에서 오른쪽 마우스를 클릭하고 UI > Image 레이어를 추가해 줍니다.
5. image 레이어가 선택되어 있는 중, Inspector 창에서 Image 속성에 Source Image 창을 클릭한 후, asset에서 등록한 파일명을 검색합니다.
의외로 쉽고 간단하게 추가가 가능하죠?
만약, 크기를 키워도 일정 부분을 일그러지게 하고 싶지 않다면
sprite editor를 사용해서 움직이는 범위를 지정해 주시면 됩니다.
예를 들어 아르헨티나 국가 캐릭터의 눈코입만 일그러지지 않게 하고 싶다고 칩시다.
그럼 크기를 키우고, 줄여도 눈코입 부분만 일그러지지 않는 것을 확인할 수 있습니다!
댓글
댓글 쓰기