← Log

I am Ironman: 프로젝트 소개

I am Ironman 게임 개발기· 1 / 7
  1. 1 — I am Ironman: 프로젝트 소개
  2. 2 — I am Ironman: 프로젝트 세팅
  3. 3 — I am Ironman: 게임 화면 구현
  4. 4 — I am Ironman: 콘텐츠 모션과 애니메이션
  5. 5 — I am Ironman: 콘텐츠 물리 충돌 처리
  6. 6 — I am Ironman: 게임 씬 구성
  7. 7 — I am Ironman: 게임 배포와 프로젝트 점검

블로그를 작성하면서 지난 사이드 프로젝트들을 정리하는데, 오래된 사이드 프로젝트 하나를 현재의 주 프로그래밍 언어로 컨버팅하고 싶은 욕심이 갑자기 생겼다.

2년 전 Python 언어를 활용한 체험식 게임 개발을 했었는데, 그때 개발 했던 것이 Pygame 라이브러리를 사용한 “I am Ironman”이라는 미니 슈팅 게임이다.

I am Ironman

이 프로젝트를 Pygame → Phaser.js 컨버팅 및 포팅하게 된 주된 <동기> 는 다음과 같다.

  • 나의 개발 블로그에서 바로 실행할 수 있도록 하고 싶었다.
  • 클래스 기반의 모듈화를 연습하고, 게임 특성상 클래스, 의존성, 인스턴스, 객체를 가시적으로 체감할 수 있어 학습 효과가 좋을 것이라고 생각했다.
  • 나의 주 프로그래밍 언어인 JavaScript(혹은 TypeScript) 로 개발한 프로젝트로 남기고 싶었다.

Phaser.js 소개

Phaser.js 은 JavaScript(TypeScript) 기반의 HTML5 게임 개발을 위한 오픈 소스 2D 게임 라이브러리.

일단 웹 실행에 최적화되어 있다는 점이 이번 컨버팅·포팅의 주된 목적에 부합한다.

* 반면, Pygame은 데스크톱 앱 실행에 최적화되어 있는 라이브러리.

라이브러리 특징

  • HTML5를 활용하여 웹 브라우저에서 게임을 실행할 수 있다.
  • 모바일 기기에서도 최적화된 성능을 제공하며, 반응형 디자인을 지원한다.
  • JavaScript 기반의 게임 라이브러리 중에서 2D 게임 개발에 특히 적합하고, 커뮤니티가 활발하고 러닝 커브가 비교적 낮다.
* 게임은 웹 렌더링 시 HTML5의 <canvas>태그에 담긴다.

게임 소개

I am Ironman”은 마블 히어로인 아이언맨을 주인공으로 한 미니 슈팅 게임으로, 현재는 콘텐츠의 움직임과 충돌 시스템 등 기본 사항에 초점을 맞춘 프로토타입 단계이다.

컨트롤 방식

  • 키보드 방향키 및 특정 키 조작
  • 일대다 슈팅 스타일

게임 시스템

  • 생존 시간과 적의 종류에 따른 차등으로 점수가 증가하는 스코어링
  • 에너지 게이지를 충전해 사용하는 스킬 발동
  • 피격 시 플레이어의 생명력 감소

시각적 및 음향적 요소

  • 콘텐츠 상황별 이미지 전환 적용
  • 상황별 효과음 적용
  • 화면(Scene) 전환으로 진행 과정 구분

아직 게임의 다양한 설정이 미흡하고 보스 시스템, 스테이지 구분 등의 고급 기능 요소는 없지만, 기본 기능을 우선 구현한 후 조금씩 추가 기능과 요소를 덧붙여 나갈 계획이다.

목차