얼추 몬스터 BT 제작이 마무리 되는 느낌이 되자 같이 몬스터를 구성하는 팀원과 플레이어를 구성하는 팀원들 간의 전투시스템에 대한 회의가 오갔다.
나는 주말동안 UI 디자인을 시작했다.
레퍼런스는 엘든링이다.
디자인에 사용한 프로그램으론 Adobe Photoshop, Illustrator를 썼다. 요즘 시대가 좋아져서 Photoshop에서ai 이미지 생성으로 도움을 받았다.
일딴 처음 애플리케이션 실행시 보일 TitleScene을 만들어 봤다.
TitleScene
- Title
- Press Any Button
- Press Any Button의 배경이미지
그리고 PlayScene에서 필요한 UI를 만들었다.
PlayScene
- Player : HP, SP, Weapon 1~4
- Monster : HP
- BattleEnd : Win, Lose, Background
PlayScene에서 캔버스 구성에서 고민을 했다.
- 플레이어는 보스방에 진입 전 대기상태이다.
- 대기시에는 비무장상태로 보스에 대한 정보가 안 떠있다.
- 이후 보스방 진입시 보스에 대한 정보가 뜬다.
- 보스와 전투를 하다가 플레이어가 지거나 이기게 된다.
일딴.. 생각으론 상황마다 유니티에서 캔버스를 활성화 시키면 될꺼같다고 생각했다.
Canvas Scaler에서
화면 비율을 1920X1080으로 셋팅했다.
불러온 이미지들은 Texture Type을 Sprite로 변경해주고 캔버스에 이미지를 추가한다.
보통 이미지를 작업하면 도형은 일러스트로 제작하고 텍스쳐가 많이 들어가는 이미지는 포토샵으로 제작했었는데 이번에 UI작업하면서 일러스트에 신규로 업뎃한 치수 기능을 잘 썻다.
포토샵은 option키 누르면 치수가 자동으로 떠서 편했다.
그리고 캔버스에 이미지 넣으면서 UI기획 피드백받았던것이 생각났다. 각 UI 픽셀 치수 알아놔야한다는 것이었는데 Rect transform에 정확한 치수를 넣어서 제작하기 때문인가 싶었다.
제작하다 어려운점이라면 Slider였는데 만들다가 ctrl+z를 누르면 fild가 제멋대로 없어지거나 크기가 변해서 애를 먹었다.
후에 팀원에게 물어보니 유니티 버그라 프로그램을 껏다 켜보라는 조언을 받았다. 해결이 됐는지 확인해보기엔 슬라이더에 너무 많은 시간을 써서 뒤로가기를 안 누르면서 제작했다.
이후에 보스와 플레이어 전투시스템이 완성되면 스크립트랑 연결하여 피가 줄어드는것과 무기 스왑 상태가 잘 보이는지 확인해야겠다.
에필로그.
다른 팀원이 엘든링을 보면 플레이어의 HP의 총량이 늘어나기도 하는데 이건 어떤식으로 제작하는 걸까? 라는 질문을 하길래 나는 HP바 프레임이 첫부분과 끝 부분에 장식이 들어가 있는데 이게 어떻게 늘어나는건지...? 생각하다 Sprite 에 이미지 분할기능이 있다는게 생각났다. 그리고 팀원도 HP용량이 늘어나는 방법을 찾았다.
스크립트 부분은 유투브에 유니티로 엘든링과 다크소울을 만드시는 분 영상을 많이 참고하고 있다. 감사하다.
