게임 (3) 썸네일형 리스트형 Phaser 3로 게임 개발하기 - Tutorials(3) Part 5, 6 지형지물을 생성했으니 이제는 돌아다닐 캐릭터를 만들 차례다. 먼저 스프라이트에 대해 알아야하는데 스프라이트란 애니메이션 효과를 위한 이미지로, 이미지 배열 이미지라고 생각할 수 있다. 예를 들어, 0번째 이미지부터 3번째 이미지가 반복된다면 왼쪽으로 이동하는 듯한 애니메이션을 적용할 수 있다. 애니메이션 효과를 쉽게 관리하기 위해 여러개의 이미지를 하나의 이미지로 합쳐서 관리한다. function create () { this.add.image(400, 300, 'sky'); platforms = this.physics.add.staticGroup(); platforms.create(400, 568, 'ground').setScale(2).refreshBody(); platforms.c.. Phaser 3로 게임 개발하기 - Tutorials(2) part2 에서는 assets 폴더에 있는 이미지 파일들을 preload 한다. preload 함수인 줄 모르고 처음에는 왜 아무 이미지도 안뜨는지 헤맸다. function preload () { // this.load.image('이미지 선언명', '이미지 파일 경로') this.load.image('sky', 'assets/sky.png'); // 후에 'sky'로 sky.png 파일을 호출한다. this.load.image("ground", "assets/platform.png"); this.load.image("star", "assets/star.png"); this.load.image("bomb", "assets/bomb.png"); // spritesheet는 애니메이션 효과를 위한 이미지이다.. Phaser 3로 게임 개발하기 - Tutorials(1) Phaser Tutorials Site Phaser 공식사이트에서 튜토리얼을 제공한다. 영어 울렁증이 있어서 좀 어지러웠지만, 코드가 그렇게 어렵지 않아서 어찌저찌 쉽게 튜토리얼을 진행해 볼 수 있었다. 공식사이트에서 제공하는 파일을 다운 받아준다. 그리고 파일을 열어주면 튜토리얼을 진행 하는데 필요한 이미지 파일들과 각 단계 별로 완성된 HTML 파일들이 있다. part1.html을 열어보면 튜토리얼을 시작하는 기본 틀이 구현되어있다. 그런데 part1.html을 실행해보면 아무것도 안뜬다. 알아보니 웹서버를 세팅해주어야 한다는데… 서버에 대한 지식이 별로 없어서 좀 헤멜뻔 했으나 관성적으로 라이브 서버를 이용해서 html을 파일을 실행하다보니 튜토리얼이 다 끝나고 나서야 알아챘다. 나처럼 일단 튜토리.. 이전 1 다음
