Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 1003753 of ゲーム開発

  • リビジョンの URL スラグ: Games
  • リビジョンのタイトル: ゲーム開発
  • リビジョンの ID: 1003753
  • 作成日:
  • 作成者: Uemmra3
  • 現行リビジョン? いいえ
  • コメント 90% translated

このリビジョンの内容

コンピュータアクティビティの中でゲームはもっともポピュラーなものです。新技術が頻繁に登場し、標準的なWebブラウザ上で動作するゲーム開発をより良くパワフルにしています。

Webゲーム開発の紹介

Webのためのゲーム開発紹介
ゲーム開発に役立つテクニック紹介と、Web技術を使ったゲーム開発のはじめかたについて。またビジネスでwebゲーム製作することにも詳しく見ています。
ビデオゲームとの違い
 
実際、ビデオゲームとは? 複数のゲームに共通する部分が(そうは見えなくても)あります この記事では、完全に一般的なコンテキストでのメインループといった概念の説明を見ていきます。焦点を当てる時は、web標準に向けるようにします。
ゲーム開発における特殊な考慮
アプリセンターのこの記事では、open web appとして実行するゲームを作成する時に、特に考慮すべき点を簡単に見ていきます。

外部リソース

新しいゲームを作る
多数のオープン web ゲーム開発のチュートリアルを載せた協力的なサイト。最近はそこまでアクティブではないが、まだまだ良いリソースがある。
Creative JS
印象的な JavaScript テクニックと実験の集まりで、ゲームに特化してはいないが、でも役立ちます。 最近はそこまでアクティブではないが、まだまだ良いリソースがある。
ゲームプログラミングパターン
Bob Nystrom によって書かれたオンライン書籍で、ゲーム開発におけいるプログラミングパターンを解説しています。解説されているパターンを利用することで、より効果的なコードを効率的に作成できるようになります。
Artillery ブログ
HTML5 ゲーム制作会社である Artillery のブログには、有用な記事が投稿されています。
Firefox OS 用ゲームの作成
Firefox OS や他のモバイルプラットフォームでの配信を目指して、HTML5 による 2D のゲーム開発を簡単にしょうか
週刊Gamedev.js
HTML5 ゲーム開発の週刊ニュースレターで、毎週金曜日に送られる。最新の記事や、ツールや、リソースがある。
HTML5 ゲームの開発フォーラム
開発者や、クリエーターや、パブリッシャー向けのフォーラム。質問して、フィードバックを得て、他の人を手助けしましょう。
HTML5 ゲームエンジン
最も人気の HTML5 ゲームフレームワークの一覧で、 レーティング、機能、サンプルがある。
JSBreakouts
JavaScript ブロック崩しのクローンを様々なフレームワークで比較し、あなたにあったものを選ぶのに役立てます。
Tuts+ Game Development
一般的なゲーム開発についてのチュートリアルと記事
#BBG IRC チャット
開発者と直接、リアルタイムに話しましょう。
HTML5 Gamedev Starter
ゲーム開発用のスターターで、様々な web 周りの便利なリソースへのリンクのキュレーション集。
js13kGames
JavaScript coding competition for HTML5 game developers with the file size limit set to 13 kilobytes. All the submitted games are available in a readable form on GitHub.
Mozilla Hacks blog
Games category on the Mozilla Hacks blog containing interesting gamedev related articles.

 

ゲーム開発トピック

ツール
この章は、Webゲームのエクスペリエンスを効率的に作成する補助ツール、例えばフレームワークや、Emscriptenのようなコンパイラや、デバッグツールを扱います。それぞれの背景にあるコア概念を説明して、使いこなすためのカッチリした基礎を与えます。
テクニック
この章は、ゲーム開発に必要なたくさんの記事を含んでいます、例えば物理や、衝突検出、アニメーション、3D、データストレージ、その他たくさんについて。
ワークフロー
この章はいろいろな事例研究を含んでいて、上記の基本ツールやテクニックを取り上げて、素晴らしいゲームを作るのにそれらを適用します。経験豊富なweb開発者で、2D や 3D ゲームを書きたい場合でも、ネイティブのゲームをWebに移植している C++ 開発者でも、より良いモバイルゲームを書きたいモバイル開発者であっても、何かを得ることができます。

デモ

Emscripten、WebGL、そして WebRTC  で作成された、マルチプレー対応 3D 一人称視点シューティングゲーム (FPS) です。
Serpent game
古典的な「スネーク」ゲームを基にしたシンプルな Web ゲームです。素早くゲーム開発ができる WebGameStub を利用しています。
Monster Madness
Nom Nom Games と Trendy entertainment によって開発された、オンラインマルチプレーヤーシューティングゲームです。WebGL と asm.js を利用しています。
Auralux
WebGL と asm.js を利用しているストラテジーゲームです。
Swooop
飛行機を操作して宝石を集めるゲームです。PlayCanvas で実装されています。
Polycraft
難破して辿り着いた島を探検し、モンスターを打ち倒すゲームです。
Dead Trigger 2
ゾンビを倒すアクションゲームです。 Unity3D で作成されています。
Biolab Disaster
横スクロールシューティングです。Cavas を利用した初期の作例です。

付記: 作例 ページにより多くの例が掲載されています。

 

{{GameTechBox}}

Note that we are keeping track of ongoing work on game development documentation on our Game development documentation status page. If you want to help contribute to game development documentation, please have a look at this page to see what work needs doing!

 

{{CommunityBox("Games development", "community-games", "mozilla.community.games", "games", "Games Wiki|https://wiki.mozilla.org/Platform/Games|View Wiki|Find more information about Mozilla gaming efforts on the Games Wiki")}}

  1. イントロダクション
    1. Webのゲーム開発紹介
    2. ビデオゲームとの違い
    3. ゲーム開発における特殊な配慮
  2. ツール
    1. asm.js
    2. Emscripten
    3. WebVR
    4. Gecko profiler
    5. ゲームエンジンとツール
  3. ゲーム開発テクニック
    1. asm.jsの同期スクリプトを利用する
    2. 起動パフォーマンスを最適化する
    3. ピア通信チャンネルとしてWebRTCを利用する
    4. Webゲームの効率的なアニメーション
    5. Web上の 3D ゲーム
      1. Web上の 3D ゲームの概要
      2. 基本の3D理論の説明
      3. Three.js を使った基本的なデモ製作
      4. PlayCanvas を利用した基本的なデモの制作
    6. Web ゲーム向けの音
    7. 2D 衝突検出
    8. 3D 衝突検出
      1. 3D 衝突検出の概要
      2. THREE.js を使ったバウンディングボリューム衝突検出
    9. タイルとタイルマップ
      1. タイルとタイルマップの概要
      2. Static maps
      3. Scrolling maps
  4. ワークフロー
    1. そのままのJavaScriptを使ったブロックくずしゲーム
    2. Phaserを使ったブロックくずしゲーム
    3. デバイス回転方向を使った2D 迷路ゲーム
  5. ゲームを公開する
    1. ゲームを公開するには
    2. ゲームの配信
    3. ゲームのプロモーション
    4. ゲームのマネタイズ
  6. 作例

このリビジョンのソースコード

<div class="summary">
<p><span class="seoSummary">コンピュータアクティビティの中でゲームはもっともポピュラーなものです。新技術が頻繁に登場し、標準的なWebブラウザ上で動作するゲーム開発をより良くパワフルにしています。</span></p>
</div>

<div class="column-container">
<div class="column-half">
<h2 id="Webゲーム開発の紹介">Webゲーム開発の紹介</h2>

<dl>
 <dt><a href="/docs/Games/Introduction" title="/en-US/docs/Games/Introduction">Webのためのゲーム開発紹介</a></dt>
 <dd>ゲーム開発に役立つテクニック紹介と、Web技術を使ったゲーム開発のはじめかたについて。またビジネスでwebゲーム製作することにも詳しく見ています。</dd>
 <dt><a href="/docs/Games/Anatomy_of_a_vIdeo_game">ビデオゲームとの違い</a><br />
 &nbsp;</dt>
 <dd>実際、ビデオゲームとは? 複数のゲームに共通する部分が(そうは見えなくても)あります この記事では、完全に一般的なコンテキストでのメインループといった概念の説明を見ていきます。焦点を当てる時は、web標準に向けるようにします。</dd>
 <dt><a href="/docs/Web/Apps/Developing/Games/Special_considerations">ゲーム開発における特殊な考慮</a></dt>
 <dd>アプリセンターのこの記事では、open web appとして実行するゲームを作成する時に、特に考慮すべき点を簡単に見ていきます。</dd>
</dl>

<h2 id="外部リソース">外部リソース</h2>

<dl>
 <dt><a href="https://buildnewgames.com/">新しいゲームを作る</a></dt>
 <dd>多数のオープン web ゲーム開発のチュートリアルを載せた協力的なサイト。最近はそこまでアクティブではないが、まだまだ良いリソースがある。</dd>
 <dt><a href="https://creativejs.com/">Creative JS</a></dt>
 <dd>印象的な JavaScript テクニックと実験の集まりで、ゲームに特化してはいないが、でも役立ちます。 最近はそこまでアクティブではないが、まだまだ良いリソースがある。</dd>
 <dt><a href="https://gameprogrammingpatterns.com/">ゲームプログラミングパターン</a></dt>
 <dd>Bob Nystrom によって書かれたオンライン書籍で、ゲーム開発におけいるプログラミングパターンを解説しています。解説されているパターンを利用することで、より効果的なコードを効率的に作成できるようになります。</dd>
 <dt><a href="https://blog.artillery.com/">Artillery ブログ</a></dt>
 <dd>HTML5 ゲーム制作会社である Artillery のブログには、有用な記事が投稿されています。</dd>
 <dt><a href="https://leanpub.com/buildinggamesforfirefoxos/">Firefox OS 用ゲームの作成</a></dt>
 <dd>Firefox OS や他のモバイルプラットフォームでの配信を目指して、HTML5 による 2D のゲーム開発を簡単にしょうか</dd>
 <dt><a href="https://gamedevjsweekly.com/">週刊Gamedev.js</a></dt>
 <dd>HTML5 ゲーム開発の週刊ニュースレターで、毎週金曜日に送られる。最新の記事や、ツールや、リソースがある。</dd>
 <dt><a href="https://www.html5gamedevs.com/">HTML5 ゲームの開発フォーラム</a></dt>
 <dd>開発者や、クリエーターや、パブリッシャー向けのフォーラム。質問して、フィードバックを得て、他の人を手助けしましょう。</dd>
 <dt><a href="https://html5gameengine.com/">HTML5 ゲームエンジン</a></dt>
 <dd>最も人気の HTML5 ゲームフレームワークの一覧で、 レーティング、機能、サンプルがある。</dd>
 <dt><a href="https://www.jsbreakouts.org/">JSBreakouts</a></dt>
 <dd>JavaScript ブロック崩しのクローンを様々なフレームワークで比較し、あなたにあったものを選ぶのに役立てます。</dd>
 <dt><a href="https://gamedevelopment.tutsplus.com/">Tuts+ Game Development</a></dt>
 <dd>一般的なゲーム開発についてのチュートリアルと記事</dd>
 <dt><a href="https://webchat.freenode.net/?channels=bbg">#BBG IRC チャット</a></dt>
 <dd>開発者と直接、リアルタイムに話しましょう。</dd>
 <dt><a href="https://html5devstarter.enclavegames.com/">HTML5 Gamedev Starter</a></dt>
 <dd>ゲーム開発用のスターターで、様々な web 周りの便利なリソースへのリンクのキュレーション集。</dd>
 <dt><a href="https://js13kgames.com/">js13kGames</a></dt>
 <dd>JavaScript coding competition for HTML5 game developers with the file size limit set to 13 kilobytes. All the submitted games are available in a readable form on GitHub.</dd>
 <dt><a href="https://hacks.mozilla.org/category/games/">Mozilla Hacks blog</a></dt>
 <dd>Games category on the Mozilla Hacks blog containing interesting gamedev related articles.</dd>
</dl>

<p>&nbsp;</p>
</div>

<div class="column-half">
<h2 id="ゲーム開発トピック">ゲーム開発トピック</h2>

<dl>
 <dt><a href="/docs/Games/Tools">ツール</a></dt>
 <dd>この章は、Webゲームのエクスペリエンスを効率的に作成する補助ツール、例えばフレームワークや、Emscriptenのようなコンパイラや、デバッグツールを扱います。それぞれの背景にあるコア概念を説明して、使いこなすためのカッチリした基礎を与えます。</dd>
 <dt><a href="/docs/Games/Techniques">テクニック</a></dt>
 <dd>この章は、ゲーム開発に必要なたくさんの記事を含んでいます、例えば物理や、衝突検出、アニメーション、3D、データストレージ、その他たくさんについて。</dd>
 <dt><a href="/docs/Games/Workflows">ワークフロー</a></dt>
 <dd>この章はいろいろな事例研究を含んでいて、上記の基本ツールやテクニックを取り上げて、素晴らしいゲームを作るのにそれらを適用します。経験豊富なweb開発者で、2D や 3D ゲームを書きたい場合でも、ネイティブのゲームをWebに移植している C++ 開発者でも、より良いモバイルゲームを書きたいモバイル開発者であっても、何かを得ることができます。</dd>
</dl>

<h2 id="デモ">デモ</h2>

<dl>
 <dd>Emscripten、WebGL、そして WebRTC&nbsp; で作成された、マルチプレー対応 3D 一人称視点シューティングゲーム (FPS) です。</dd>
 <dt><a href="/docs/Web/Apps/Tutorials/Games/Serpent_game">Serpent game</a></dt>
 <dd>古典的な「スネーク」ゲームを基にしたシンプルな Web ゲームです。素早くゲーム開発ができる <a class="external" href="https://github.com/mozilla/WebGameStub">WebGameStub</a> を利用しています。</dd>
 <dt><a href="https://hacks.mozilla.org/2013/12/monster-madness-creating-games-on-the-web-with-emscripten/">Monster Madness</a></dt>
 <dd>Nom Nom Games と Trendy entertainment によって開発された、オンラインマルチプレーヤーシューティングゲームです。WebGL と asm.js を利用しています。</dd>
 <dt><a href="https://www.auraluxgame.com/game/">Auralux</a></dt>
 <dd>WebGL と asm.js を利用しているストラテジーゲームです。</dd>
 <dt><a href="https://playcanv.as/p/JtL2iqIH">Swooop</a></dt>
 <dd>飛行機を操作して宝石を集めるゲームです。<a href="https://playcanvas.com/">PlayCanvas</a> で実装されています。</dd>
 <dt><a href="https://ga.me/games/polycraft">Polycraft</a></dt>
 <dd>難破して辿り着いた島を探検し、モンスターを打ち倒すゲームです。</dd>
 <dt><a href="https://beta.unity3d.com/jonas/DT2/">Dead Trigger 2</a></dt>
 <dd>ゾンビを倒すアクションゲームです。 <a href="https://unity3d.com/">Unity3D</a> で作成されています。</dd>
 <dt><a href="https://playbiolab.com/">Biolab Disaster</a></dt>
 <dd>横スクロールシューティングです。Cavas を利用した初期の作例です。</dd>
 <dd>
 <div class="note">
 <p><strong>付記</strong>: <a href="/docs/Games/Examples">作例</a> ページにより多くの例が掲載されています。</p>
 </div>
 </dd>
</dl>

<dl>
 <dt>&nbsp;</dt>
</dl>
</div>
</div>

<p>{{GameTechBox}}</p>

<div class="note">
<p><strong>Note that we are keeping track of ongoing work on game development documentation on our <a href="/ja/docs/Games/Doc_Status">Game development documentation status</a> page. If you want to help contribute to game development documentation, please have a look at this page to see what work needs doing!</strong></p>
</div>

<p>&nbsp;</p>

<p>{{CommunityBox("Games development", "community-games", "mozilla.community.games", "games", "Games Wiki|https://wiki.mozilla.org/Platform/Games|View Wiki|Find more information about Mozilla gaming efforts on the Games Wiki")}}</p>

<h5 id="Subnav">Subnav</h5>

<ol>
 <li><a href="#">イントロダクション</a>

  <ol>
   <li><a href="/ja/docs/Games/Introduction" title="An introduction to the technologies useful for game developers and how to get started developing games using Web technologies. This article also looks at the business case for why it makes sense to create games for the Web">Webのゲーム開発紹介</a></li>
   <li><a href="/ja/docs/Games/Anatomy" title="What is a video game, really? There are certain parts that are common between games (even if it doesn't seem like it). This article looks to explain concepts like main loops in a completely general context. When it does focus, it does so toward web standards.">ビデオゲームとの違い</a></li>
   <li><a href="/ja/docs/Web/Apps/Developing_game_apps/Special_considerations" title="This article from the App Center looks briefly at things you need to consider spefically when trying to create a game that will run as an open web app.">ゲーム開発における特殊な配慮</a></li>
  </ol>
 </li>
 <li><a href="/ja/docs/Games/Tools">ツール</a>
  <ol>
   <li><a href="/ja/docs/Games/Tools/asm.js" title="asm.js is a very limited subset of the JavaScript language, which can be greatly optimized and run in an ahead-of-time (AOT) compiling engine for much faster performance than your typical JavaScript performance. This is, of course, great for games.">asm.js</a></li>
   <li><a href="/ja/docs/Mozilla/Projects/Emscripten" title="An LLVM to JavaScript compiler; with Emscripten, you can compile C++ and other languages that can compile to LLVM bytecode into high-performance JavaScript.">Emscripten</a></li>
   <li><a href="https://developer.mozilla.org/ja/docs/Web/API/WebVR_API">WebVR</a></li>
   <li><a href="https://addons.mozilla.org/en-us/firefox/addon/gecko-profiler/" title="The Gecko profiler extension lets you profile your code to help figure out where your performance issues are so that you can make your game run at top speed.">Gecko profiler</a></li>
   <li><a href="/ja/docs/Games/Tools/Engines_and_tools" title="A list of engines, templates and technologies useful to game developers.">ゲームエンジンとツール</a></li>
  </ol>
 </li>
 <li><a href="/ja/docs/Games/Techniques">ゲーム開発テクニック</a>
  <ol>
   <li><a href="/ja/docs/Games/Techniques/Async_scripts" title="Especially when creating medium to large-sized games, async scripts are an essential technique to take advantage of, so that your game's JavaScript can be compiled off the main thread and be cached for future game running">asm.jsの同期スクリプトを利用する</a></li>
   <li><a href="/ja/docs/Apps/Developing/Optimizing_startup_performance" title="How to make sure your game starts up quickly, smoothly, and without appearing to lock up the user's browser or device.">起動パフォーマンスを最適化する</a></li>
   <li><a href="/ja/docs/Games/Techniques/WebRTC_data_channels" title="In addition to providing support for audio and video communication, WebRTC lets you set up peer-to-peer data channels to exchange text or binary data actively between your players.">ピア通信チャンネルとしてWebRTCを利用する</a></li>
   <li><a href="/ja/docs/Games/Techniques/Efficient_animation_for_web_games">Webゲームの効率的なアニメーション</a></li>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Techniques/3D_on_the_web">Web上の 3D ゲーム</a>
    <ol>
     <li><a href="https://developer.mozilla.org/ja/docs/Games/Techniques/3D_on_the_web">Web上の 3D ゲームの概要</a></li>
     <li><a href="https://developer.mozilla.org/ja/docs/Games/Techniques/3D_on_the_web/Basic_theory">基本の3D理論の説明</a></li>
     <li><a href="https://developer.mozilla.org/ja/docs/Games/Techniques/3D_on_the_web/Building_up_a_basic_demo_with_Three.js">Three.js を使った基本的なデモ製作</a></li>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_on_the_web/Building_up_a_basic_demo_with_PlayCanvas">PlayCanvas を利用した基本的なデモの制作</a></li>
    </ol>
   </li>
   <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Audio_for_Web_Games">Web ゲーム向けの音</a></li>
   <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/2D_collision_detection">2D 衝突検出</a></li>
   <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_collision_detection">3D 衝突検出</a>
    <ol>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_collision_detection">3D 衝突検出の概要</a></li>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_collision_detection/Bounding_volume_collision_detection_with_THREE.js">THREE.js を使ったバウンディングボリューム衝突検出</a></li>
    </ol>
   </li>
   <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps">タイルとタイルマップ</a>
    <ol>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps">タイルとタイルマップの概要</a></li>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps/Square_tilemaps_implementation%3A_Static_maps">Static maps</a></li>
     <li><a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Tilemaps/Square_tilemaps_implementation%3A_Scrolling_maps">Scrolling maps</a></li>
    </ol>
   </li>
  </ol>
 </li>
 <li><a href="/ja/docs/Games/Workflows">ワークフロー</a>
  <ol>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">そのままのJavaScriptを使ったブロックくずしゲーム</a></li>
   <li><a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">Phaserを使ったブロックくずしゲーム</a></li>
   <li><a href="/ja/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">デバイス回転方向を使った2D 迷路ゲーム</a></li>
  </ol>
 </li>
 <li><a href="https://developer.mozilla.org/ja/docs/Games/Publishing_games">ゲームを公開する</a>
  <ol>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Publishing_games">ゲームを公開するには</a></li>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Publishing_games/Game_distribution">ゲームの配信</a></li>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Publishing_games/Game_promotion">ゲームのプロモーション</a></li>
   <li><a href="https://developer.mozilla.org/ja/docs/Games/Publishing_games/Game_monetization">ゲームのマネタイズ</a></li>
  </ol>
 </li>
 <li><a href="https://developer.mozilla.org/ja/docs/Games/Examples">作例</a></li>
</ol>
このリビジョンへ戻す