설모의 기록

ParticleSystem 이 뭐지? 게임 엔진들은 각각 기본적으로 ParticleSystem 을 제공합니다. Cocos creator 도 마찬가지인데요. 위와 같이 Cocos creator 에는 ParticleSystem 컴포넌트를 추가하실 수 있습니다. 그렇다면 ParticleSystem 이란 무엇일까요? 기본적으로 파티클은 위치가 있고 모양과 행동을 결정하는 여러 프로퍼티를 추가할 수 있는 오브젝트를 말합니다. 그리고 그러한 파티클들을 emitter 를 사용해 방출하는 것을 ParticleSystem 이라고 합니다. 파티클 시스템은 불, 연기, 거품 등 여러 이펙트 효과를 발생시키기 위해 사용됩니다. 근래에는 ParticleSystem 이 적용되지 않은 모바일 또는 웹 게임을 찾기가 힘듭니다. 그만..

ray cast 란? 이번에도 클래시 로얄 게임으로 예를 들어보겠습니다 (제가 요즘 클래시 로얄에 빠져있어서..ㅎ). 위의 그림에서 보시면 빨간색의 상대방 캐릭터가 제 캐릭터인 드래곤과 충돌해 공격을 준비하는 장면입니다.만약 ray cast 를 사용하지 않고 그냥 attack () 함수를 이용해 드래곤의 hp 를 깎아주도록 구현을 했다면 어색한 장면이 보일겁니다. 빨간색 캐릭터는 불을 쏴서 드래곤을 공격하지만 그 불은 드래곤을 지나쳐 뒤따라오는 두 마리의 고블린에게도 타격을 입히는 모습이 나타나기 때문입니다. 이런 어색한 장면이 있다면 상대방에게는 너무 억울한 상황이겠죠? 불 공격 한방으로 세 마리의 캐릭터에게 타격을 입혀야하는데 겨우 드래곤 한 마리라니,, 그래서 적용하는 것이 ray cast 개념입니..

Object pool? 객체 풀이 뭐야? 대뜸 배틀그라운드 사진을 첨부해서 놀라셨죠? 이번 포스팅은 게임을 개발할 때 성능을 좌지우지하는 object pool 을 설명하기 위해 배틀그라운드 사진을 첨부했습니다. 위와 같은 게임에서는 총수들이 총을 쏘며 캐릭터들을 죽이는 장면을 쉽게 볼 수 있습니다. 그런데 만약, 제가 총 쏘기를 1000번을 수행했다면 총알을 1000을 만들어야 할까요? '에이~ 요즘 컴퓨터들이 얼마나 빠른데 1000개 만드는거까지 성능 최적화를 해야하나요?' 라고 말씀하실 수 있습니다. 그러나 유저들에게 제공되어야하는 게임의 속도는 어색하지 않고 끊김이 없으며 부드러워야 합니다. 총알 객체를 new 하고 이미지를 입히고 애니메이션 이미지들을 로드해 애니메이션을 적용해 화면을 붙이는 작업..

Group Manager 란? 물리엔진을 사용해 충돌에 관련된 작업들을 하려고 할 때 group manager 를 사용의 장점을 알아보겠습니다. 예를 들어, 클래시 로얄 게임을 생각해 볼까요? 빨간색 hp 를 가진 캐릭터들이 적 캐릭터, 파란색 hp 를 가진 캐릭터들이 제 캐릭터 입니다. 제가 지금 이 게임을 개발하는 중이라고 가정하겠습니다. 저는 캐릭터끼리 충돌이 일어났을 때 싸우도록 구현을 하려고 합니다. 그렇지만 제 캐릭터끼리 만났을 때는 싸우면 안되겠죠? 같은 그룹인 (내 캐릭터 그룹, 상대방 캐릭터 그룹) 캐릭터끼리는 충돌했을 때 싸우지 않도록 구현하고 싶은 것입니다. 이럴 때 Cocos creator 에서는 group manager 라는 기능을 제공합니다. 제 캐릭터 노드들은 같은 그룹으로 설..

Draw Call 게임 엔진의 성능에 대해 공부를 할 때, delta time 과 함께 등장하는게 바로 드로우 콜입니다. 드로우 콜은 말 그대로 그려달라는 요청입니다. 하나의 오브젝트를 화면에 그리기 위해 CPU 가 GPU 에게 "화면에 그려줘~!" 라고 요청하는게 바로 draw call 입니다. 따라서 이미지 1000개를 그리기 위해서는 1000번의 요청이 필요하고 한 프레임안에 그 요청을 수행해야하니 delta time 이 낮아지겠죠? 그렇게 게임이 느려지게 되는 것입니다. 따라서 드로우 콜이 높아질수록 게임의 성능은 낮아질 수밖에 없습니다. 그렇기 때문에 draw call 을 줄이는 작업은 매우 중요합니다. 이 draw call 을 줄이기 위해 게임엔진들은 batch 기술을 제공합니다. 아래의 예시..

cocos-2d js 에서 기본으로 제공하는 js 파일인 CCGeometry.js 파일 내 메소드들에 대해서 알아보겠습니다. 저는 캐릭터의 사각형 충돌체와 장애물의 사각형 충돌체가 겹치는 때를 알기 위해 update 문에서 cc.rectIntersectRect() 메소드를 사용했었는데요. 이처럼 두 점 비교, 점과 사각형 비교, 사각형과 사각형을 비교하는 등의 작업을 할 때 이 파일 내의 메소드를 사용합니다. cc.pointEqualToPoint : 두 cc.p() 의 x, y 값이 같은지를 비교합니다. 123cc.pointEqualToPoint = function (point1, point2) { return point1 && point2 && (point1.x === point2.x) && (poin..

Cocos Creator 엔진, VS Code IDE, TypeScript 로 게임을 개발하기 위한 개발환경 구축에 대해 정리해보았습니다. 1. Cocos Creator 설지아래의 사이트에 들어가 본인의 OS 에 맞게 Cocos Creator 를 설치해줍니다.http://cocos2d-x.org/creator 아래는 Cocos creator 의 api reference 사이트입니다.http://cocos2d-x.org/docs/api-ref/creator/v1.0/2. Visual Studio Code 설치먼저 본인의 OS 에 맞게 VS Code 를 설치해줍니다.widow: https://code.visualstudio.com/docs/setup/windowsmac: https://code.visuals..

chipmunk.js 는 cocos-2d js 에서 물리를 사용해 구현하려할 때 사용하는 라이브러리이다. chipmunk 에 존재하는 중력과 충돌을 이용해 게임을 구현할 수 있다. chipmunk를 사용하기 위해서는 우선 project.json에 라이브러리를 추가해준다. 중력공간을 구현하려는 Scene 또는 Layer 에 cp.Space 를 구현한다.- gravity: 중력을 어느방향으로 줄 것인지에 대한 벡터값- iterations: 이 값이 높아질수록 정확해지지만 cpu사용이 많아지고, 낮을수록 충돌할 때 출렁이는 물결이 커보임. 기본값은 10이다.- damping: 제동력. 기본값은 1이다.- idleSpeedThreshold: body가 idle 상태가 되는 가속도 값. 기본값은 0이다.- sle..