나노바나나로 게임 UI 만들기

https://cafe.naver.com/devalone/27

나노바나나로 게임 UI 시안 만들기

 

나노바나나로 인디게임 UI시안 만들기

​

"나노 바나나"라는 이름의 이미지 생성AI로 게임 UI시안을 만들어 봤다.

컨셉과 요소를 어느정도 제시해 주면 원하는 모습에 가깝게 뽑을 수 있다.

​

다음은 내가 적은 프로픔트와 결과물이다.

​

프롬프트 :

나는 모바일 좀비 FPS를 만들고 있어.

가로 모드 화면이야.

UI시안을 한 장 받고 싶어.

​

컨셉:

배경 이미지는 투명으로 해줘.

너무 군대 게임 같은 무거운 느낌 보다는 캐주얼 게임 느낌으로.

단, 너무 가볍거나 발랄하면 안돼, 좀비 게임답게 채도를 좀 낮춰서 , 캐주얼이지만 무게감 있게.

​

요소:

상단 왼쪽 : score표시

상단 중앙 : 플레이어의 HP표시

상단 오른쪽 : 총알 수 표시

하단 오른쪽 : Fire 버튼

하단 오른쪽 Fire 버튼 위 : 사용 가능한 무기 2 종류

하단 왼쪽 : Reload 버튼

​

​

결과물:

​

짠~ 이렇게 멋진 시안을 불과 1분만에 만들어준다.

이걸 그대로 게임에 쓰기에는 불편하므로 이미지 편집 프로그램으로 가져와서 약간 손을 봐준다.

포토샵, 김프 같은 툴 사용법을 조금은 익혀놓는게 좋다.

나는 주로 오픈소스 이미지 편집툴인 김프를 사용한다.

​

이렇게 배경이 투명한 png파일로 따주고 게임내에서 텍스트로 출력할 부분도 제거해 준다.

플레이어의 HP바 같은 경우 유니티의 Slider바 규격에 맞게 배경 영역과 채워질 영역을 분리해 줘야 한다.

​

인게임에 붙이면 이런느낌이다.

​

요즘 AI이미지 퀄리티가 정말 좋아져서 1인개발 할 때 아주 유용하게 써먹을 수 있다.

어느정도 후가공이 필요하지만 기본적인 UI시안과 레이아웃을 뽑아주는것만 해도 1인개발에 있어서는 엄청난 혁신이다.

이미지 편집툴만 조금 쓸 줄 안다면 AI를 써서 빠르게 시안 뽑아보고,

편집툴로 내가 원하는 규격에 맞게 다듬으면 바로 게임에 넣어볼 수 있는 것이다.

만약 이정도 UI시안을 사람이 직접 만든다면 아무리 빨라도 몇 시간은 걸릴 것이다.

프로그래머로서 항상 아트 리소스가 고민이었는데 일단 UI에 있어서는 초기 프로토타입 혹은 그 이상도 AI를 활용하여 만들 수 있을 것 같다.