[스팀파이터] 엔진 변경, 자바스크립트 게임엔진 Phaser

스팀파이터, pharser로 새로 만들까?

최근에 취미로 스팀파이터 관련 개발을 했었는데요.

스팀파이터 개발 도중에 어려움을 겪고 있었습니다.

먼저 기존에 F. LF2 (F. Project, 리틀파이터 웹버전)에서 시작을 했었는데 분석하는 것이 어려웠습니다. (많은 모듈들이 있는데 api가 없다.)

그리고 기능을 추가하는 것도 점점 코드가 누더기가 되었습니다.

그래서 결심한 것은 가장 최신의 javascript 게임 엔진을 찾아

그 위에서 게임 개발을 해보고자 하는 것입니다.

원래는 기존 코드에서 시작해서 빠르게 스팀파이터를 개발해보고 싶었으나

이렇게 새로 시작하게 된다는 소식을 전하게 되어

기대를 많이 하셨던 분들에게 죄송합니다.

장기적으로 봤을 때, 기반이 잘 닦인 게임 엔진에서 새로 시작하는게 좋을 것 같다고 생각했습니다.

스팀파이터는 여전히 운영중이긴합니다.
스팀파이터
에 접속하시면
게임을 할 수 있습니다.

단, 보상이 없고 컴퓨터랑만 할 수 있습니다.

새로운 시작

새로운 게임 엔진에서 시작하더라도 나쁘지 않습니다.

기존에 개발했던것도 그대로 사용 가능하기때문입니다.

  • 기존의 작업한 것 그대로 활용 가능
    • 시나리오
    • 스팀 커넥트 연동
    • 서버 연동

기존에 F. project 코드에서는 문제가 좀 있었습니다.

  • 기존 코드에서 확장하기 어려움
    • api가 부족함, 하나하나 분석하기 어렵고 시간이 오래걸림
    • 점점 코드가 복잡해졌다.
    • 기존 코드에 멀티 플레이를 적용하기 어려움
  • 라이센스 문제
    • 기존 코드를 상업적으로 사용할 경우, 허락을 받아야한다. (f. project 개발자가 허락은 해줌)

게임엔진 검색!

검색을 하다가
html5/javascript 에서 동작하는 game engine의 랭킹표를 찾았습니다.

https://html5gameengine.com/
image.png

여기서 제가 선택한 것은 Pharser입니다.


선택한 게임엔진은 Phaser

  • 튜토리얼, 예제가 많다.
  • 최근까지도 업데이트 되고 있다.
  • 무료다. BSD License
  • pixi 기반으로 만든 게임 엔진이라고 한다.

예제

https://phaser.io/tutorials/getting-started-phaser3/part5
https://phaser.io/tutorials/making-your-first-phaser-3-game
https://phaser.io/news/2018/03/how-to-create-a-game-with-phaser-3
https://phaser.io/news/2018/03/multiplayer-game-tutorial-series

Phaser 예제는 동작시켜보고 더 적도록 하겠습니다.

최근 회사의 일도 많이 바빠지고 퇴근 후도 바빠져
스팀파이터 개발은 많이 못했었습니다.

꾸준히 개발후기를 적어보고싶었으나 어렵군요.

꾸준히 작성하시는 분들 대단하십니다! ㅎㅎ

감사합니다.


This page is synchronized from the post: ‘[스팀파이터] 엔진 변경, 자바스크립트 게임엔진 Phaser’

[영화] 레디 플레이어 원, 최초의 가상현실 블록버스터, 그리고 현재는?

서론

안녕하세요.

어제 문화의 날인거 아시나요?

매달 마지막 주 수요일은 영화가 5천원입니다.

그리고 레디 플레이어 원의 개봉일이였습니다.

3월 28일!!

어제 보고왔습니다.

image.png

저는 게임 판타지 소설을 좋아합니다.

여러 종류의 게임 판타지 소설을 읽었고

이런 게임이 나오면 재밌겠다라는 생각을 많이 했었습니다.

그 중에 추천하고 싶은 소설은

팔란티어, 다른 이름으로는 옥스칼니우스의 아이들라는 책인데요.

1999년에 출판되었는데.. 3번은 본 것 같아요.

담에 이책에 대해 자세히 소개하겠습니다.

image.png

영화 이야기

한 마디로 이 영화를 표현하자면

많은 사람들이 꿈꾸던 것,
가상현실 게임이 있다면 어떤 모습일까?
어떤 문제가 있을까? 얼마나 재밌을까?

꿈꾸던 것을 영상으로 보여줬다고 생각을 했습니다.

역시 스티븐 스필버그!

보다보니 우리가 알고 있는 캐릭터들이 많이 나왔네

이래도 되는건가? 허락받았겠지? 생각이 들더군요.

  • 스타크래프트- 마린
  • 킹콩 & 쥬라기 공원 - 공룡
  • 건담
  • 조커, 할리 퀸
  • 춘리
  • 처키
  • 트레이서

image.png

이 영화에서는
아래와 같이 가상현실로 가기 위한 장치를 사용하였습니다.

  • VR 기기와 유사한 것
  • 슈트 (촉각을 위한)
  • 러닝머신과 같은 바닥

현실에서도 실제로 유사한게 있습니다.

카트워크(KAT WALK)라는 장비인데요.
https://youtu.be/HKCKb7uJo6E

다음은 HTC vive에서 개발하고있는 컨트롤러, 시뮬레이터입니다.

앞에 카메라도 추가하여

기존의 키보드와 마우스로 게임을 하는게 아니라

사람이 앉는다거나, 달리거나 손동작 등이

모두 게임의 입력 인터페이스로 사용된다고 하더라고요.

실제로 제가 해보지 않아 자세히 설명은 못해 아쉽네요.

image.png

위에 vive 시뮬레이터는 사용은 못해봤지만

대학로의 VR방은 가봤습니다.

좀비를 잡는 게임이였는데 아주 재밌더군요.

하지만, 눈도 피곤하고 조금 어지럽기도 했습니다.

1시간 정도 2~3개 게임을 했습니다.

image.png

결론

  • 가상현실게임에 대한 상상, 환상을 영화로 만들었다.
  • 앞으로도 현실에서도 이런 게임이 생겼으면 좋겠다.
  • 스토리가 탄탄하다.
  • 신기, 액션, 그러나 감동은 부족하달까?
    • ‘가상세계를 지키자’가 와닿지 않아서 그런가?
  • 5점 만점에 4.3!

This page is synchronized from the post: ‘[영화] 레디 플레이어 원, 최초의 가상현실 블록버스터, 그리고 현재는?’

[일기] 서동요, 선화공주와 서동

오늘은 저녁에 중국집에서

마파두부를 먹었다.

20170918_183327.jpg

월요일마다 요일 메뉴로 나오는데

시간이 되면 꼭 가서 먹는편이다.

마파두부를 먹으면서

천일야사, 선화공주와 서동이라는 단편 드라마를 봤는데..

너무 재밌었다.

image.png

기억나는 것들만 적어보려고 한다.

일단 배우들이 연기를 잘했다.

서동은 마를 팔던, 과부의 아들이다.
선화공주는 신라의 공주이다.

둘은 시장에서 만난다.


서동이 반지를 팔면서 이렇게 말한다.

이 반지가 잘어울릴 것 같아요.
백제에서 어디 성에서는 사람들이 줄을 서서 사요.

여자가 말하길,

장신구는 여자의 미모를 더욱 빛나게 하기 위한 것인데
이 반지는 너무 나대는군요!
(실제 대사에서 반지가 나댄다고 했다.)

재밌었다. ㅋㅋ

서동은 선화공주에게 반했고
선화공주의 마음을 얻고 싶었다.

자신의 스승? 선생님에게 가서 어떻게 마음을 얻을 수 있냐고
물어보니

원하는 것을 입 밖으로 천 번을 말해봐라
이뤄진다.

멋진 말이라고 생각했다.
서동은 그만큼 간절했고 그렇게 했을 것이다.

그러다가 절에서 우연히 만나게 된다.
이때 서동은 자신의 마음을 표한한다.

당신에게 반지를 줄려고 맨날 가지고 있었다고..

헤어진 후에도 어떻게든 만나고 싶어

꾀를 쓴다.

길거리의 아이들에게 동요를 외우게 한 것이다.

선화공주가 밤마다 서동을 만나러 나간대요~


그렇게 신라 전역에 소문이 퍼지고

왕실의 체면이 구겨졌다며

선화공주를 유배를 보낸다.

유배를 갈 때, 서동을 만나고

선화공주는 이렇게 말한다.

이 노래, 동요가 예언이며, 우리는 운명이군요.

image.png

이야기가 길군요.. ㅋㅋㅋ

선화공주와 서동은 행복하게 지내다가

선화공주는 서동이 동요를 만들고 자신을 속였다는것을 알았다.

선화공주는 배신감에 서동과 헤어졌죠.


그리고 시간이 지난 후,

동요의 가사가 바뀌었다.

선화공주가
매일 은행나무 밑에서
기다리고 있어요.

그렇다.

선화공주가 서동을 용서하고
길거리의 아이들에게 노래 가사를 바꿔서
다시 알려준 것이다.

이 서동요를 듣고 서동은
선화공주를 찾아오게 된다.

여기서 선화공주가 서동에게 한 말이 감동이었는데..

당신이 부자였다면 이렇게 하지 않았겠죠
당신의 간절함을 생각해봤어요.
한눈을 감고..
당신의 간절함을 믿고 싶다고..


그렇게 둘은 다시 만나게되고
..
알고보니 서동은 백제의 숨겨둔 자식이였다.
그렇게 서동은 무왕이 되고
선화공주는 부인, 왕후가 된다.


결론

이걸 보면서 느낀점은

  • 원하는 것을 입 밖으로 천 번 말하는 것
    말의 힘이 중요하다.
  • 바라는 것을 간절히 생각하고 행동하는 것
    간절히 바라는 것이 중요하다.

  • 서동과 선화공주의 사랑이야기는 재밌다.

  • 선화공주는 예뻤다.

드라마를 보고 생각나는대로 적은거라
조금 말한게 많이 다를 수 있지만,
재미있었다.


This page is synchronized from the post: ‘[일기] 서동요, 선화공주와 서동’

디자인 패턴 - 상태 머신

코드를 작성하다가

상태 머신을 구현해야할 필요가 있었다.

언젠가 수업에서 배운적이 있지만, 제대로 기억이 안나

정리를 하게 됐다.

상태 머신 (State machine)

image.png
<위키 백과>

유한 상태 기계(finite-state machine, FSM) 또는 유한 오토마톤(finite automaton, FA; 복수형: 유한 오토마타 finite automata)는 컴퓨터 프로그램과 전자 논리 회로를 설계하는데에 쓰이는 수학적 모델이다. 간단히 상태 기계라고 부르기도 한다. 유한 상태 기계는 유한한 개수의 상태를 가질 수 있는 오토마타, 즉 추상 기계라고 할 수 있다. 이러한 기계는 한 번에 오로지 하나의 상태만을 가지게 되며, 현재 상태(Current State)란 임의의 주어진 시간의 상태를 칭한다. 이러한 기계는 어떠한 사건(Event)에 의해 한 상태에서 다른 상태로 변화할 수 있으며, 이를 전이(Transition)이라 한다. 특정한 유한 오토마톤은 현재 상태로부터 가능한 전이 상태와, 이러한 전이를 유발하는 조건들의 집합으로서 정의된다. - 위키백과


다시 한번 정의

상태 기계는 상태 머신이라고도 부른다.

상태 머신에서 사용하는 용어들에 대한 설명을 먼저 한다.

상태 머신을 이루는 중요한 요소 현재 상태, 사건, 전이이다.

현재 상태(Current State)란 임의의 주어진 시간의 상태를 칭한다.

머신의 상태는 어떠한 사건(Event)에 의해

한 상태에서 다른 상태로 변화할 수 있으며,

이를 전이(Transition)이라 한다.


장점

상태 머신은 복잡한 문제를 단순화시킬 수 있다.

즉, 큰 문제들을 여러 개의 작은 문제들로 나눈다.

그래서 작은 문제에 집중할 수 있고,

프로그램이 동작하는 프로세스를 한 눈에 볼 수 있었다.


예시

나같은 경우, 로봇에 상태머신을 적용하였다.

상위 레벨에서 로봇의 상태를 체크, 관리, 상태에 따른 동작을 수행하도록 하였다.

로봇이 목적지 A까지 이동을 하여야한다.

보통 정상적으로 목적지에 도착하지만,

여러 이유로 멈춘다.

목적지에 장애물이 있다던가

벽에 부딛혔다던가

배터리가 떨어졌다던가

여러 가지 상태에 따라 특정한 동작을 수행하도록 하였다.

이렇게 상태에 따른 동작을 하게 해서

큰 문제를 작게 나눠서 풀 수 있었다.

즉,

상태 A에서 상태 B로 가는 event를 정의한다.

그 이벤트가 발생했을 때, 상태를 A에서 B로 바꾸고,

그에 따른 특정 함수를 실행한다.

그래서, 초기 상태에서 목적 상태로 갈 수 있도록 한다.


코드 작성을 위한 참고 링크

참고한 블로그가 있든데

http://boycoding.tistory.com/110
http://icecola89.blogspot.kr/2016/05/c.html

디자인 패턴 중에 상태 머신 패턴이 있다.
(디자인 패턴이란 자주 나오는 문제들을 보다 쉽게/효율적으로 해결할 수 있는 코드/아키텍쳐 디자인을 말한다.)

상황에 맞는 적절한 디자인패턴을 활용하여 코드를 작성하는 것은 코드를 보기좋고 유지관리하기에 좋다.

상태 머신 패턴을

단순히 하나의 쓰레드에서 동작시킬 것인지,

멀티 스레드 환경에서 동작하는지에 따라

고려할 것도 많고 구현할게 많아 귀찮을수있다.

나 같은 경우는 하나의 쓰레드에서만 해도 충분했다.

추후 멀티스레드 환경에서 구현하는 것도 해봐야겠다.


This page is synchronized from the post: ‘디자인 패턴 - 상태 머신’

[영화] 허리케인 하이스트, 목숨 10개

image.png

최악의 허리케인이 급습한 도시.대피령이 내려진 텅 빈 도시에 미 연방 재무부 금고를 노리는 범죄 조직이 나타난다. 이들은 가장 안전한 지역인 태풍의 눈을 이용한 범죄 계획을 세운다.한편, 범죄 조직에게 인질로 잡힌 형을 구해야 하는 천재 기상학자 ‘윌’과 금고 속에 남겨진 6,500억 원을 지켜야 하는 재무부 특수 요원 ‘케이시’는 돈과 생존을 둘러싼 사투를 시작하는데…태풍의 눈 속으로 질주하라!단 한 번의 기회가 그곳에 있다! - 네이버 영화

태풍
연방 재무부
특수요원
천재 기상학자
수리공 형

다시 설명하자면,
태풍으로 사람들이 다 대피할 때
미국 연방 재무부 금고를 노리는 조직을
기상학자와 형, 요원 한명이 힘을 합쳐 이겨내는 내용입니다.

어울리지 않지만
주인공들은 자연스럽게 만납니다.

영화를 보기 전에 줄거리만 보고 갔을 때,
이게 재난영화인가? 뭐지? 했습니다.
이 영화는 재난과 액션을 잘 섞은 영화입니다.

저는 4D로 영화를 봤는데,
흔들리고 물뿌리고 바람불고 재밌었습니다.


보면서 느낀점

미국의 기상학자는 운동도 잘하는구나 (뛰는 사람은 형입니다.)

image.png

목숨이 한 10개 있으면 해볼 수 있을 방법들로 살아남습니다.

미션 임파서블이 떠오르는군요.

아래 사진에 있는 사람들은 주인공들입니다.

image.png


팝콘과 콜라를 마시며

재밌게 액션을 볼 수 있는 영화였습니다 ㅎㅎ


@roys-market 1회차


This page is synchronized from the post: ‘[영화] 허리케인 하이스트, 목숨 10개’

스팀 기반의 게임 벤치마킹 (Game based on steem, Benchmark)

안녕하세요.

저는 스팀기반의 게임을 만들고있습니다.

스팀파이터!!!!

개발하는와중에 기존의 스팀기반 게임은 뭐가 있을까?

궁금했습니다.

제가 생각하는 스팀 기반의 게임이라 하면

로그인을 스팀으로 한다던가

게임의 보상을 스팀으로 준다던가

게임머니가 스팀이라던가

스팀 api, 스팀의 유저정보를 활용한다던가

이러한 게임들을 스팀기반의 게임이라고 생각합니다.

매력적입니다.


이제 기존의 스팀기반의 게임이 무엇이 있는지 분석해봅시다!

Steemgar

스팀파이터

  • Web game
  • 격투게임
  • 현재 컴퓨터 대전 가능, 개발중
  • 추후 배틀 및 싸이월드 같은 기능 개발 예정
  • 수익모델
    • Steemgar의 수익모델 괜찮아보인다.
    • 고래의 지원 필요, 어떻게? 게임 완성도를 높인 후 찾자
    • utopian을 통한 개발 글 작성
  • 만든다면 Steemgar만큼 충분히 재밌을 것이다.
  • 스팀파이터.oa.to
  • steemfighters.com

image.png

Steempunk

  • 크롬 확장 프로그램으로, 스팀잇 사이트를 들어가면 사이드에 아래 사진처럼 뜬다.
  • 현재 서비스 중
  • MMORPG
  • 비슷한 게임으로는 턴제, 클래시오브 클랜 같은 느낌이다.
  • 유저들이 서로 스팀잇 블로그에 들어가서 전투신청을 해야한다.
    다른 사람들의 블로그에 방문할 수 있게 유도하는 점은 좋아보인다.
  • 하지만 중간의 결과물이 없고 배틀 신청 –> 2시간 후 –> 배틀 결과가 나오는 것으로 보인다.
  • 개인적으로는 재미없다. 지워버림.
  • 스팀펑크 백서
    image.png

Ork Hulk

결론

Steemgar는 잘 만들었다.
스팀이랑 연동도 잘했다.
보상을 주는 방식도 괜찮고, 서비스도 잘 만들었다.

지렁이 게임하고 비슷한데, 관련 오픈소스가 있는걸까?

추가적으로 분석을 해볼만한
이더리움 기반의 게임, 스팀 기반의 게임이 있을 경우,
알려주시면 감사하겠습니다.


This page is synchronized from the post: ‘스팀 기반의 게임 벤치마킹 (Game based on steem, Benchmark)’

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×