JS 및 HTMLGAMING : Angry Birds에서 ZX 스펙트럼까지-JS 튜토리얼-php.cn

JS and HTMLGaming: From Angry Birds to ZX Spectrum 키 포인트

html5/javaScript 게임 분야는 빠르게 성장하고 있으며 개발자는 점점 더 풍부한 API와 도구를 가지고 있습니다. Mozilla Visual 프로그래머와 기술 전도자 Rob Hawkes는 브라우저 게임에서 HTML5와 JavaScript의 잠재력을 강조하여 이러한 게임의 복잡성이 증가하고 있음을 지적합니다.

HTML5/JavaScript 게임 개발에 관심이있는 개발자는 먼저 JavaScript 및 그래픽 API (예 : Canvas API 및 Audio API)에 익숙해야합니다. Crafty 및 Impact와 같은 게임 엔진도 유용합니다.

html5와 JavaScript는 레트로 게임의 부흥을 촉발 시켰으며, 이는 특히 WebGL과 같은 기술의 지원으로 미래에보다 복잡하고 몰입 형 게임 경험을 제공 할 수 있습니다.

인터넷의 개방성은 게임의 이익 모델에 도전과 기회를 가져 왔습니다. 개발자는 게임 내 지불부터 스폰서 십에 이르기까지 다양한 전략을 탐색해야합니다.

html5/javaScript 게임 필드는 최근에 빠르게 개발되었습니다. 브라우저 게임은 점점 더 인기가 높아지고 있으며 개발자는 편리한 API 및 기타 도구 세트를 발견하기 시작했습니다. Rob Hawkes는 HTML5 및 JavaScript 및 브라우저 게임의 응용 프로그램을 찬양하는 데 열정적입니다. Rob은 Mozilla의 시각적 프로그래머, 저자 및 기술 전도자이며 개발자 커뮤니티에서 Mozilla의 게임 작업을 담당합니다. 그는 5 월 멜버른에서 열린 Web Directions Code Conference에서 마감 기조 연설을했으며 HTML5와 JavaScript 게임이 얼마나 훌륭한지를 보여주었습니다.

<.> 안녕하세요, Rob. 개발 배경을 알려주십시오.

나는 약 13 년 동안 네트워크 개발 분야에서 일해 왔습니다. HTML과 CSS에 대해 조금 배웠습니다. 웹 디자인에 더 관심이 있었지만 서버 측 개발에서 매우 강력한 일을 할 수 있다는 것을 알게되면 PHP로 돌아섰습니다. 양식을 만드는 방법을 알면 이제이 데이터에 액세스하는 방법을 생각 했습니까? 모두가 양식에서 PHP를 배웁니다 ... 예! 어딘가에 데이터를 보낼 수 있다는 것은 정말 멋지다. 그래서 나중에 저는 업계에서 일했으며 주로 프론트 엔드 개발에 종사했으며 몇 년 동안 일했습니다. 나는 미디어에 관심을 갖고 JavaScript를 탐구하기 시작했고, 그 이후로 나는 웹 사이트를 만드는 것에 열정적이지는 않았지만 기술 학습 기술에 대한 열정이 더 열정적이지 않다는 것을 깨달았습니다. 나는 항상 게임 제작에 매우 관심이 있었고 그것이 어떻게 작동하는지 배우기 위해 미친 일을하기 위해 무언가를 취하는 것을 좋아합니다. 그래서 대학 중에는 많은 HTML5 작업, 특히 캔버스를했습니다.

당신은 초기에 캔버스와 함께 피기를 시작했을 것입니다.

실제로, 캔버스는 시작하기 전에 존재했습니다. Apple은 그것을 사용하여 대시 보드 위젯을 만들었습니다. 다른 브라우저에서는 실제로 안정화되지 않거나 적어도 결코 재미 있지는 않지만 항상 WebKit에 있습니다. 아무도 그것으로 아무것도 한 적이 없습니다. 그러나 내가 캔버스를 만났을 때, 나는 그것이 정말로 시원하다고 생각했습니다. 나는 좋은 시간에 시작했습니다 - 당시에는 책이 거의 없었지만 많은 기회를 가져 왔습니다. 나는 그것을 깊이 파고 들고있는 소수의 사람들 중 하나입니다. 또한 JavaScript API 실험에도 참여했습니다. 나는 디자이너 나 개발자가 아니라고 생각합니다. 나는 시각적 프로그래밍을 좋아합니다. 게임 제작 및 캔버스와 같은 것들은 하드 코어 개발과 실제로 직관적 인 인터페이스 경험을 결합 할 수 있기 때문에 완벽합니다. 그것이 제가 Mozilla에서 작업하는 것입니다.

html5/javaScript 게임에 관심이있는 이유는 무엇입니까? 당신은 게임 팬입니까?

나는 내 인생에 게임이 있습니다 - ZX 스펙트럼, 게임 콘솔이 있습니다 ...

와우! 당신은 ZX Spectrum의 팬입니까?

우리 아빠는 컴퓨터를 크게 좋아하지 않지만 어떤 이유로 그는 하나를 사는 것이 좋은 생각이라고 생각합니다. 그러나 나는 테이프를 삽입 한 후 게임이 나타났다는 생각에 깊이 매료되었습니다! 내 말은, 나는 아직도 아주 어렸지만 여전히 "오리와 싸우고있다"와 그 모든 미친 게임을 기억합니다. 그런 다음 PC 게임을 시작했을 때 생산성이 오랫동안 떨어졌습니다! 그러나 게임은 항상 나에게 재미있었습니다. Flash 및 JavaScript와 같은 기술로 인해 지금 게임을 만들 수 있도록 너무 시원하다는 것을 알게되었습니다. 그런 다음 게임을 시작하면 완전히 새로운 가능성의 영역을 열어줍니다. 웹 사이트를 처음 만들었을 때 느끼는 느낌과 같습니다. 게임 개발에서 배울 수있는 다양한 기술과 같은 다양한 기술이 있으며, 이는 표준 웹 사이트를 구축 할 때 항상 그 경험을 얻지는 못합니다. 게임에서는 항상 한계까지 물건을 밀어 넣습니다.

html5/javaScript 게임 개발에 관심이 있다면 먼저 무엇을 배워야하고 어떤 방향을 개발해야합니까?

마스터 JavaScript; 그러나 JavaScript에 만족하면 Canvas API와 같은 일부 그래픽 API를 살펴볼 수 있습니다. 캔버스는 아주 좋은 API입니다. 내가 그것을 발견 할 때까지, 나는 이미지를 만들지 않고 브라우저에서 무언가를 그리는 방법을 모르겠습니다. 오디오 API를 확인할 수도 있습니다. HTML5의 멀티미디어 기능은 매우 흥미 롭습니다. 게임 엔진을 확인하십시오. 반드시 처음부터 배울 필요는 없지만 기본 사항을 완전히 이해하지 않고도 신속하게 시작할 수있는 많은 게임 엔진이 있습니다. 예를 들어, Crafty, 나는 그것이 호주 엔진이며 무료라고 생각합니다. 그런 다음 $ 99의 가격이 책정 된 매우 좋은 엔진이 있으며, Impact는 매우 잘 문서화 된 문서화 된 매우 좋은 게임 엔진입니다. JavaScript로 게임을 만들고 싶지만 반드시 구현 세부 사항에 너무 깊이 들어가기를 원할 필요는 없다면이 엔진은 훌륭한 출발점입니다. 게임 개발의 INS를 자세히 살펴보고 싶다면 JavaScript에서 루프를 최적화 할 수있는 RequestAnimationFrame과 같은 도구를 사용하여 애니메이션을 사용하는 방법을 알아보십시오. 화면 주위의 정사각형 이동과 같이 캔버스 API와 결합하면 키보드를 사용하여 입력하는 것은 어려운 작업이 아닙니다. 거기에서 원하는 곳에서 가져갈 수 있습니다.

따라서 여전히 기본 JavaScript를 잘 이해해야 할 것 같습니다.

예. JQuery와 같은 게임 라이브러리가 있습니다. Crafty 및 Impact와 같은 엔진은 약간 비슷합니다. 그러나 그들은 jQuery만큼 추상적이지 않습니다. 더 복잡한 일을하고 싶다면 여전히 JavaScript를 작성해야합니다. 그러나 이미지를 스프라이트로 소개하고 움직이는 것과 같은 기본 애니메이션을하고 싶다면 Crafty로 그렇게 할 수 있습니다. 문제는, 당신은 무대 뒤에서 무슨 일이 일어나고 있는지 완전히 이해하지 못한다는 것입니다. 웹 밖에서 게임을 만들려면 복잡한 애니메이션 및 물리적 효과를 처리하는 방법을 추상화하므로 Flash 또는 Unity를 사용할 수 있습니다. 그러나 나에게 JavaScript를 이해한다는 것은 처음부터 게임을 만들 수 있음을 의미합니다. 그렇습니다. 어려울 수 있고 시간이 걸릴 수 있지만 장기적으로는 그만한 가치가 있습니다. 최소한 루프, 어레이 및 객체 등의 기본 사항을 이해할 수 있다면, 더 나아가고 싶을 때 정말 감사하게 될 것입니다.

html5와 JavaScript는 레트로 게임, 플랫폼 게임, Pong과 같은 오래된 게임의 부활을 이끌어 낸 것 같습니다. 보다 복잡하고 대화식 프로젝트와 같은 다른 방향으로 갈 것이라고 생각하십니까?

레트로 게임은 이와 관련하여 시원합니다. HTML5 게임은 상당히 단순한 단계에 있으므로 레트로 게임은 완벽합니다. 주로 2D로 많은 능력이 필요하지 않으며 만들기가 쉽습니다. 플래시 게임이 인기가 있었을 때도 마찬가지입니다. 개발자가 JavaScript를 사용하여보다 몰입감있는 경험을 만드는 것을 막을 수있는 것은 없습니다. 우리는 WebGL을 사용하는 방법을보기 시작했습니다. 많은 사람들이 하드웨어 가속과 같은 기술을 사용하는 iOS에서 볼 수있는 게임에 가까운 게임을 만들기 시작했습니다. "Pong"은 훌륭하지만 "Angry Birds"조차도 너무 많은 기술을 제공하지 않습니다. 나는 누군가가 WebGL에서 Quake 4를 만드는 것을 보았고 순조롭게 실행됩니다. 우리는 현대 게임을위한 플랫폼으로 웹을 설정하는 데 도움이되도록 이러한 게임을 더 많이 볼 필요가 있습니다. 우리는 이제 실제 게임을 만드는 데 필요한 기술과 기능을 갖추고 있습니다. 그리고 실제 게임이 의미하는 바는 PC 게임에서 볼 수있는 게임입니다. 우리는 회사와 개발자 가이 방향으로 움직이는 것을보기 시작했습니다. 인터넷을 위해 구축 된 온라인 게임을 만들어야합니다. 이제 우리는 대화식 게임의 부흥을보고 있지만 웹을 위해 특별히 만든 게임이 너무 많지 않습니다. 장치 제한을 실현하면서 네트워크를 활용하는 더 많은 게임을보고 싶습니다. 두 플랫폼에서 동일한 게임을 만들 수 있다고해서 정확히 동일해야한다는 의미는 아닙니다. 네트워크는 독립적 인 게임 플랫폼이 될 수있는 기회가 있다고 생각합니다. 즉, 표준 게임을 배치 할 수있는 다른 장소가 아니라 독특한 목표입니다. 게임 개발자 가이 문제를 파악하면서 우리는 정말 흥미로운 것을 볼 것이라고 생각합니다. 이제 웹의 게임은 실제로 다른 플랫폼을 복사하는 것입니다. 게임은 매우 정적이며 소셜 기능이나 다른 API에 연결하는 기능과 같은 웹이 제공하는 것은 실제로 사용하지 않습니다. 이 모든 것이 웹에 내재되어 있으며 웹 사이트에서 사용하고 있지만 게임에서 사용하면 어떻게됩니까?

브라우저 게임에서 많은 개발자들이하는 일이 종종 과거를 파기하는 것과 관련이 있습니다. 반드시 나쁜 것은 아닙니다. 그러나 개념과 아이디어의 확장을 볼 수 있습니까?

그게 내 꿈이 될거야. 이제 우리는 HTML과 웹을 게임 플랫폼으로 불공평하다고 생각합니다. 우리는 이전 플랫폼과 비교합니다. 예를 들어, 우리는 iOS에서 게임을 포팅하고 있습니다. 우리는 웹에서 HTML 버전의 Angry Birds를 실행합니다. 우리는 그것이 성공했기 때문에 그것을 가져 왔습니다. 이것은 불공평합니다. 우리는 웹 플랫폼을 기본 플랫폼과 비교합니다. 물론 기본 플랫폼이 더 좋습니다. 터치 제어, 일부 프로그래밍 언어 및 기술을 위해 제작되었습니다. 우리는 네트워크를 이전에 수행 한 작업으로 제한함으로써 네트워크를 독립적으로 성장시키지 않을 것입니다. 우리는 네트워크의 힘을 발휘하고 우리가 일반적으로 플레이하는 게임만큼 제한되지 않은 것을 시도 할 수 있습니다. 예를 들어, 게임이 브라우저의 작은 상자에 포함되어 있음을 알 수 있습니다. 게임이 웹 사이트의 일부로 작은 상자에 나타날 이유는 없습니다. 네트워크의 일부가 될 수 있습니다. 트위터에서 게임을 할 수없는 이유는 없습니다. 사람들이 점차 온라인 게임에 대한 아이디어를 받아들이면서 많은 새로운 게임이 오기를 바랍니다. JavaScript API는 네트워크를 위해 구축되었습니다. 이것은 매우 기본적인 기술입니다. 웹 소켓 연결과 일부 이벤트를 설정하면 웹 서버로 메시지를 실시간으로 보내고받을 수 있습니다.

시장의 가치가있는 아이디어를 어떻게 만들 수 있습니까?

이것은 우리가 모질라에서 해결하려는 문제 중 하나입니다. 이것은 우리가 게임 개발자들로부터 얻는 일반적인 문제 중 하나입니다. "좋은 소리를냅니다. 그러나 사람들이 DRM과 코드 보호에 익숙해지고 웹에옵니다. 모든 것이 열려 있습니다. 따라서 여기서 해결해야 할 두 가지 문제가 있습니다. 첫째 : 개방형 기술을 사용하는 것이 좋은 생각이라고 사람들에게 어떻게 설득 할 수 있습니까? 나는 당신이 당신의 게임이 도난당하는 것에 대해 걱정한다면, 나는 네트워크가 당신을위한 것이라고 생각하지 않기 때문에이 문제를 해결하기 쉽다고 생각합니다. HTML에서 게임을 만들 수 있다고해서 게임에 가장 적합한 플랫폼이라는 의미는 아닙니다. 또한 코드 축소와 같은 이러한 문제를 완화하는 방법이 있습니다. 이러한 방법은 개발자가 이미 많은 시간을 보낸 코드를 게시하는 데 조금 더 편안하다고 느낄 수 있습니다. 두 번째 질문은 마케팅입니다. 게임을 어떻게 판매합니까? 생계를 유지할 수 없다면 적어도 회사로서 게임을하는 것은 말이되지 않습니다. 당신은 길을 갈 수 있고 돈을 쓰지 않으면 사람들이 게임에 들어가는 것을 막는 것에 대해 너무 걱정할 필요는 없지만 기부 모드를 사용할 수 있습니다. 반면에, 게임 비용을 지불하지 않고 실제로 끄고 싶다면 그렇게 할 수 있습니다. 우리는 Mozilla에서 오픈 웹 응용 프로그램 API를 개발하고 있으며,이를 통해 게임 개발자 서버에서 확인 해야하는 영수증을 제공 할 수 있습니다. 우리는 사람들이 소스 코드를 보는 것을 막는 대신 코드의 개방성을 수용 할 수있는 방법을 찾고 있습니다. 그렇지 않다면, 당신은 완전한 경험을 얻지 못할 것입니다. 이것은 마술 알약이 아닙니다. 그들이 이미 지불 한 싱글 플레이어라면, 모든 소스 코드를 얻으면 사람들이 네트워킹 기술로하는 일을하는 것을 막을 방법이 없습니다. 인터넷의 게임이 다른 곳에서 게임보다 더 많이 도난 당하지 않을 것이라는 의심의 여지가 있습니다. 불법 복제 게임은 소스 코드를 얻는 것보다 훨씬 더 복잡합니다. 서버 측 구성 요소가있는 경우 보호 기능이 있으며 수신 시스템이 작동 할 수 있습니다. 누군가가 서버를 방문하지 않으면 게임을 재생할 수 없다는 것을 알고 있다면 경험을 제어 할 수 있습니다. 프론트 엔드 코드를 훔치면 서버 측 코드를 얻지 못하고 서버에 들어갈 수 있다면 다른 문제가 있습니다. 온라인으로 게임을 수익 창출하는 데 아무런 문제가 없다고 생각합니다. 현재 문제는 아직 큰 성공을 거두지 못했다는 것입니다. 닭고기 나 계란의 문제입니다. 사람들은 성공을 기다리고 있으며 사람들이 기다리고 있기 때문에 성공하지 못합니다. 우리는 앞으로 와서 그것을 시험해 볼 사람이 필요합니다. 인터넷이므로 예전처럼 게임을 판매 할 필요가 없습니다. 게임 내 결제로 돈을 벌 수 있으므로 무료 게임 경험을 가질 수 있지만 사람들이 게임에서 경험 한 것 (레벨 플레이어가 도달하는 레벨, 갑옷 또는 에너지 이득을 제어 할 수 있습니다.우리가 가능한 것이 무엇인지 완전히 이해하면, 우리는 특히 EA와 같은 대기업이 합류 한 후에 수익을 창출하는 방법을 알아냅니다. 누군가 돈을 버는 방법을 알고 있다면 그 사람들입니다. 나는 독립 개발자들이 소송을 따를 것이라고 생각합니다. iOS만큼 쉽지는 않지만 이미 큰 리드가 있습니다. 온라인으로하는 방법에는 여러 가지가 있습니다. 신문은 Paywalls 소개를 고려하기 시작했습니다. 반드시 작동하는 것은 아닙니다. 문제는 콘텐츠를 차단해야합니까? 이것은 인터넷의 원래 의도에 위배됩니까? 인터넷에 더 적합한 돈을 버는 다른 방법이 있습니까? 어쩌면 그 질문에 대한 답은 "지불하지 않으면 게임을하는 것을 어떻게 막을 수 있습니까?" 플레이어에서도 그곳에서 돈을 벌지 만 스폰서로부터 돈을 벌 수 있습니다. 나는 우리가 1 년 안에 어디에 있을지 알고 싶습니다. 우리는 일련의 성공적인 게임이 많은 돈을 벌 수있는 것을 볼 수 있습니다.

html5 게임 및 webgl 에 대한 질문이 자주 묻습니다 WebGL이란 무엇이며 HTML5 게임에 중요한 이유는 무엇입니까? WebGL은 웹 그래픽 라이브러리를 나타냅니다. 플러그인이없는 호환 웹 브라우저에서 대화식 3D 및 2D 그래픽을 렌더링 할 수있는 JavaScript API입니다. WebGL은 HTML5 게임에 중요합니다. 개발자는 다양한 장치에서 원활하게 실행할 수있는 풍부하고 고품질 그래픽 경험을 만들 수있는 기능을 제공하기 때문입니다. 이는 브라우저에서 직접 재생할 수있는 복잡하고 몰입 형 게임을 만들 수 있으므로 게임 개발의 끝없는 가능성을 열어줍니다.

HTML5 게임은 기존 게임 플랫폼과 어떻게 비교됩니까?

HTML5 게임은 기존 게임 플랫폼에 비해 많은 장점이 있습니다. 첫째, HTML5 게임은 플랫폼 공연성이며 스마트 폰, 태블릿 및 컴퓨터를 포함한 웹 브라우저가있는 모든 장치에서 재생할 수 있습니다. 이는 플레이어가 아무것도 다운로드하거나 설치하지 않고 좋아하는 게임을 즐길 수 있음을 의미합니다. 둘째, HTML5 게임은 일반적으로 전통적인 플랫폼보다 더 빠르고 쉽게 개발할 수 있으며 게임에는 일반적으로 전문 지식과 도구가 필요합니다. 마지막으로, HTML5 게임은 쉽게 업데이트되고 배포 될 수 있으므로 개발자와 플레이어 모두에게 매력적입니다.

오프라인으로 html5 게임을 할 수 있습니까?

예, HTML5 게임의 큰 장점 중 하나는 오프라인으로 플레이 할 수 있다는 것입니다. 이는 HTML5의 애플리케이션 캐싱 기능 덕분에 웹 애플리케이션이 네트워크 연결이 없을 때 사용하기 위해 사용자의 장치에 데이터를 저장할 수 있도록합니다. 즉, 인터넷에 연결되어 있지 않더라도 좋아하는 HTML5 게임을 계속 플레이 할 수 있습니다.

html5 게임이 안전합니까?

html5 게임은 일반적으로 다른 웹 애플리케이션만큼 안전합니다. 그러나 모든 소프트웨어와 마찬가지로 제대로 설계되고 유지되지 않으면 공격에 취약 할 수도 있습니다. 개발자는 보안 프로토콜 사용, 사용자 입력 확인 및 잠재적 보안 문제를 해결하기 위해 게임을 정기적으로 업데이트하고 패치하는 등 웹 보안에 대한 모범 사례를 따라야합니다.

인기있는 HTML5 게임의 몇 가지 예는 무엇입니까?

오늘날 간단한 퍼즐 게임에서 복잡한 멀티 플레이어 온라인 게임에 이르기까지 오늘날 인기있는 HTML5 게임이 많이 있습니다. 주목할만한 몇 가지 예로는 "2048", "hexgl"및 "gem maze"가 포함됩니다. 이 게임은 HTML5와 WebGL의 힘과 다양성을 보여주고 웹 기반 게임의 미래에 대한 통찰력을 제공합니다.

내 자신의 HTML5 게임을 어떻게 시작합니까?

HTML5 게임을 개발하려면 HTML, CSS 및 JavaScript를 잘 이해하고 WebGL API에 익숙합니다. Phaser, Pixi.js 및 Three.js와 같은 개발 프로세스를 단순화 할 수있는 몇 가지 사용 가능한 라이브러리 및 프레임 워크도 있습니다. 또한 HTML5 게임 개발을 시작하는 데 도움이되는 온라인 자습서와 리소스가 많이 있습니다.

내 html5 게임을 수익을 창출 할 수 있습니까?

예, HTML5 게임으로 수익을 창출하는 방법에는 여러 가지가 있습니다. 일반적인 접근 방식은 광고를 통한 것입니다. 광고는 게임에 광고를 표시하거나 유료 광고가없는 게임 버전을 제공하여 달성 할 수 있습니다. 또 다른 방법은 플레이어가 게임에서 가상 상품이나 서비스를 구매할 수있는 게임 내 구매를 통한 것입니다. 마지막으로, 일부 개발자는 자신의 웹 사이트 나 게임 배포 플랫폼을 통해 게임을 직접 판매하기로 선택합니다.

HTML5 게임의 미래는 무엇입니까?

HTML5 게임의 미래는 매우 밝게 보입니다. 웹 기술의 지속적인 발전과 모바일 게임의 인기가 높아짐에 따라 앞으로 더 혁신적이고 흥미 진진한 HTML5 게임을 볼 수 있습니다. 또한 가상 및 증강 현실 기술의 증가는 HTML5 게임 개발의 새로운 가능성을 열 수 있습니다.

HTML5 게임의 한계는 무엇입니까?