4.그림을 그려보기
안녕하세요.
스마트폰 게임 기획 따라하며 배우기 강좌를 연재하는 써니라이더 입니다.
네번째 강좌로 4.그림을 그려보기를 올려 드리겠습니다.
스마트폰 게임 기획 따라하며 배우기
목차 :
1.장르 정하기
2.벤치마킹,게임 구조 파악
3.게임 룰에 대해 생각하기
4.그림을 그려보기
5.목차를 만들기
6.UI기획
7.게임 시스템,룰 기획
8.전체 구조도를 만들자
9.데이터 테이블 정의, 수치 작업
10.밸런싱 기획
11.사운드 기획
12.스펙 리스트 / 체크리스트
13.필요 인력 계획 / 개발일정
14.매출 시뮬레이션
15.이벤트 기획
4.그림을 그려보기
4.1. PPT로 시스템/UI기획을 만들기 위한 기초 스킬
지금까지 게임기획서를 쓰려면 무엇부터 시작해야 하는지에 대해서 주로 다루었다.
그럼 이제 부터는 PPT로 실제 스마트폰 게임 기획서를 어떻게 작성해야 하는지 디테일한 부분을다루려 한다.
예전 온라인 게임 시절에는 기획서를 워드와 엑셀 파일로 많이 작성하던 시절도 있었지만,
(왜냐 하면온라인 게임의 양 자체가 너무나 많아서 MMORPG정도의 게임이면PPT파일로 작성
하기엔 1000장이 넘어가도 게임의 모든 컨텐츠를 다 담기 어려운 경우가 생기기 때문에..)
스마트폰 게임은 PC온라인 게임 보다는 그 SIZE가훨씬 작으므로, 개발자와 디자이너가 이해하기
쉽게, 시스템/UI기획은 PPT파일로, 컨텐츠/수치파일은 엑셀로 많이 작성을 하기도 한다.
네트워크 예외 처리나 결재 예외 처리 등 디테일한 내용을 모두 포함 해도, SNG/RPG류와같은
대작게임도 PPT로는 500장 정도, 간단한 슈팅게임이나, 러닝게임 같은 경우에는 200장 정도면
충분히 소화할 수 있다.
그럼 먼저 파워 포인트를 열고 스마트폰 SIZE와 똑 같은 가로 비율로 사각형을 그려보겠다.
(이것은 가로비율로 플레이 하는 스마트폰 게임을 예로 든 것이다.)
화면 중앙에 큼직하게 만든 이유는 작게 만들면, 디자이너/개발자가보기 어렵기 때문이다.
(사람마다 스타일이있겠지만, 필자의 스타일은 보는 사람이 보기 쉽게 크게 보여주는 것을 선호한다.)
[먼저 폰 사이즈와 똑같이 PPT에사각형을 하나 그린다]
이제 흰 종이 캔버스에 무엇이든 그릴 준비가 되어 있다.
어떤 UI버튼도 우리는 넣을 수가 있다.
파워 포인트의 기본 클립아트를 사용할 수 있지만, 대부분 예쁘지 않기 때문에, 다른 방법을 추천한다.
다음은 아이콘 파인더닷컴이라는 무료 아이콘을 제공하는 사이트 이다.
[아이콘 파인더 닷 컴.UI를 그릴 때 재료로 쓰는 무료/유료 아이콘이 가득 있다.]
유료 아이콘도 많지만, 무료로 가져다 쓸 수 있는 아이콘도 많기 때문에 매우 유용한 사이트이다.
여기서 아이콘을 찾는 방법은 검색창에 영문으로 검색을 하면 된다.
예를들어 옵션창 UI를 만들어서 붙이고 싶다.그렇다면영문으로 Option을 검색해보자.
[아이콘 파인더에서 Option으로 검색하면 나오는 화면]
위와 같이 유용하게 쓸 수 있는 옵션 버튼이 가득하다 마음에 드는 것이 있으면 마우스 오른쪽 버튼을 눌러 다른이름으로 사진 저장을 하면 PNG파일로 다운받을 수 있다.
이것을 이용해서 파워 포인트에 간단한 옵션 버튼을 넣어 보았다.
[option버튼을 넣은 모습]
너무나 간단하게 option버튼이 만들어 졌다.
하지만 지금 이 상태에서는 게임 같지가 않다. 게임 플레이 화면 처럼 꾸며 보기로 하자.
간단한 디펜스 게임을 만든다고 가정하고, 왼쪽에 우리편 유닛을 내보낼 수 있는 버튼 3개를
추가해 보겠다.(캐릭터 이미지는 앵그리 버드의 캐릭터이미지를 사용하였다
[캐릭터 출격 버튼을 만든 모습]
아직 부족하다. 각 캐릭터 별로 버튼을 누르면 쿨타임 바가 생길 것이고, 캐릭터 마다 일정 자원을 소모하게 하고 싶다. 그리고 캐릭터를 누르면화면에 나오게 하고 싶다.
캐릭터 출격 버튼에 쿨타임 바 / 자원 소모 버튼을 추가하고, 캐릭터가 출격 되었을 때 상태, 그리고
캐릭터 머리 위에 HP바를 넣어 보자. (자원은 coin을 소모한다고 하고, 아이콘 파인더에서 coin을 검색하여 이미지 리소스를 찾았다.쿨타임 바는 파워 포인트의자유 곡선으로 그리고, 점 편집 기능을 통해서 수정하고, 회색채우기를한 다음 투명도를 준 것이다.
[캐릭터 출격 버튼에 필요 자원과 쿨타임 넣고, 필드에 캐릭터와 HP를 넣은 모습]
이제 조금 게임 같아 졌다. 적 도 넣어 보고 멋진 이팩트도 넣어 보자.
일정 쿨타임이 차면 전체 마법을 쓸 수 있으면더욱 좋을 것 같다.
(마법 이팩트는 따다 쓴 것이 아니라 파워 포인트 삽입-도형-자유곡선으로 대략 그리고,
마우스 오른쪽 버튼 점 편집 기능으로 편집을 하면된다.)
[게임 플레이 화면 중 전체 스킬 쓰는 화면을 표현한 모습]
끝! 자 이제 당신도 디자인을 못해도 어떤 게임 플레이 화면이든 그림으로 표현할 수 있는 기획자다!
P.S 캐릭터 스샷을 떠서 넣을때, 원치 않는 배경이 딸려 들어 올때는 포토샵의 기능을 이용해서
테두리를 제거 하고 투명이미지로 넣어야 한다. 필자는 포토샵을 매우 매우 못하므로..고거는 다른 좋은 포토샵 강의 찾아보세용^^
게임캠퍼스
게임기획스터디(게기스)