diff options
Diffstat (limited to 'files/ja/games/tutorials')
13 files changed, 40 insertions, 40 deletions
diff --git a/files/ja/games/tutorials/2d_breakout_game_phaser/physics/index.html b/files/ja/games/tutorials/2d_breakout_game_phaser/physics/index.html index 283cabbffd..0556233fa2 100644 --- a/files/ja/games/tutorials/2d_breakout_game_phaser/physics/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_phaser/physics/index.html @@ -9,7 +9,7 @@ original_slug: Games/Workflows/2D_breakout_game_Phaser/Physics <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Move_the_ball", "Games/Workflows/2D_Breakout_game_Phaser/Bounce_off_the_walls")}}</p> <div class="summary"> -<p>全 16回の<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser">ゲーム開発チュートリアル</a> の 5 回目です。 今回終了後のソースコードは <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson05.html">Gamedev-Phaser-Content-Kit/demos/lesson05.html</a> でご覧になれます。</p> +<p>全 16回の<a href="/ja/docs/Games/Workflows/2D_Breakout_game_Phaser">ゲーム開発チュートリアル</a> の 5 回目です。 今回終了後のソースコードは <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson05.html">Gamedev-Phaser-Content-Kit/demos/lesson05.html</a> でご覧になれます。</p> </div> <p><span class="seoSummary">モノ同士の衝突を正しく処理するためには、物理演算が必要になります。この文書では、Phaser での実装と、典型的な例を紹介します。</span></p> @@ -86,6 +86,6 @@ function update() { <h2 id="次のステップ">次のステップ</h2> -<p>次のステップでは、<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser/Bounce_off_the_walls">ボールの跳ね返り</a> を実装します。</p> +<p>次のステップでは、<a href="/ja/docs/Games/Workflows/2D_Breakout_game_Phaser/Bounce_off_the_walls">ボールの跳ね返り</a> を実装します。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Move_the_ball", "Games/Workflows/2D_Breakout_game_Phaser/Bounce_off_the_walls")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html index 9a1833d45e..c7cab2f4e9 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html @@ -11,10 +11,10 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_w <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>3番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson03.html" rel="noopener">Gamedev-Canvas-workshop/lesson3.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>3番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson03.html" rel="noopener">Gamedev-Canvas-workshop/lesson3.html</a>で入手できます。</p> </div> -<p><span class="seoSummary">ボールが動くのを見られたのは良いことですが、画面からすぐ消えてしまっては面白くないじゃありませんか! これを解決するためにとても簡単な衝突検知 (<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/Breakout_game_from_scratch/Collision_detection">後ほど</a>詳しく説明します) を導入し、Canvasの四辺でボールを弾ませます。</span></p> +<p><span class="seoSummary">ボールが動くのを見られたのは良いことですが、画面からすぐ消えてしまっては面白くないじゃありませんか! これを解決するためにとても簡単な衝突検知 (<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch/Collision_detection">後ほど</a>詳しく説明します) を導入し、Canvasの四辺でボールを弾ませます。</span></p> <h2 id="簡単な衝突検知">簡単な衝突検知</h2> @@ -101,6 +101,6 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) { <h2 id="次のステップ">次のステップ</h2> -<p>ボールが動き、かつゲームボードに留まるようになることまでこぎつけました。第4章では操作できるパドルを実装してみます。 <a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls">パドルとキーボード操作</a>を見てみましょう。</p> +<p>ボールが動き、かつゲームボードに留まるようになることまでこぎつけました。第4章では操作できるパドルを実装してみます。 <a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls">パドルとキーボード操作</a>を見てみましょう。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html index 154b273e25..7220f84470 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_ <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>6番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson06.html" rel="noopener">Gamedev-Canvas-workshop/lesson6.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>6番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson06.html" rel="noopener">Gamedev-Canvas-workshop/lesson6.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ゲームプレイ制御を修正することにより負けることができるようになります。この大きな変更により、ついにゲームらしさを感じられるようになりました。ですが、壁とパドルでボールが弾むだけではすぐに空きてしまいます。ブロック崩しで本当に必要な要素、それはボールで崩すことができるブロックです。これが今回作り込んでいく部分になります。</span></p> @@ -108,6 +108,6 @@ var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;</pre> <h2 id="次のステップ">次のステップ</h2> -<p>というわけでついにブロックができました。でもボールはブロックに全く反応しません。第7章、<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection">衝突検知</a>ではこれを変えます。</p> +<p>というわけでついにブロックができました。でもボールはブロックに全く反応しません。第7章、<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection">衝突検知</a>ではこれを変えます。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html index db29a8dec4..0f4dc41587 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detect <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>7番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson07.html" rel="noopener">Gamedev-Canvas-workshop/lesson7.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>7番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson07.html" rel="noopener">Gamedev-Canvas-workshop/lesson7.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ブロックは既に画面上に現れていますが、ボールが素通りしてしまうのでは面白くありません。ボールがブロックで弾み、ブロックが壊れるように衝突検出を追加することを考えなくてはなりません。</span></p> @@ -128,6 +128,6 @@ for(var c=0; c<brickColumnCount; c++) { <h2 id="次のステップ">次のステップ</h2> -<p>着実にゴールに近づいています。では、先に進みましょう。第8章ではどのように<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win">スコアと勝ち負けを記録するか</a>見てみます。</p> +<p>着実にゴールに近づいています。では、先に進みましょう。第8章ではどのように<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win">スコアと勝ち負けを記録するか</a>見てみます。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html index edbd9e1d3f..046b910bd8 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html @@ -12,7 +12,7 @@ original_slug: >- <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>1番最初</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson01.html">Gamedev-Canvas-workshop/lesson1.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>1番最初</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson01.html">Gamedev-Canvas-workshop/lesson1.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ゲームの機能を書き始める前に、ゲーム内部を記述する基本的な構造を作る必要があります。これにはHTMLと{{htmlelement("canvas")}}要素を用います。</span></p> @@ -109,6 +109,6 @@ ctx.closePath();</pre> <h2 id="次のステップ">次のステップ</h2> -<p>ここまでで基本的なHTMLを組み上げcanvasに少し学習しました。それでは、第2章に進み<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball">どうやってゲーム内のボールを動かすか</a>学びましょう。</p> +<p>ここまでで基本的なHTMLを組み上げcanvasに少し学習しました。それでは、第2章に進み<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball">どうやってゲーム内のボールを動かすか</a>学びましょう。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html index b277e0f86d..5d6c9d30ba 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up <p>{{Previous("Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>10番目、最後</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson10.html" rel="noopener">Gamedev-Canvas-workshop/lesson10.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>10番目、最後</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson10.html" rel="noopener">Gamedev-Canvas-workshop/lesson10.html</a>で入手できます。</p> </div> <p><span class="seoSummary">書いたゲームのどれも常に改善の余地があります。例えば、プレイヤーに1つ以上のライフを与えることができます。1回や2回間違えてもゲームを終わらせられるようにするのです。また、描画も改善できます。</span></p> @@ -91,8 +91,8 @@ else { <h2 id="ゲームクリア_-_今のところは。">ゲームクリア - 今のところは。</h2> -<p>おめでとうございます。これで全てのレッスンを終えました。ここまでで、キャンバス操作の基本をと簡単な2Dゲームの裏にあるロジックを学んだはずです。フレームワークを学びゲーム開発を続ける良い時期です。このシリーズに対応する<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">Phaserを使ったブロックくずしゲーム</a>や<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">デバイス回転方向を使った2D 迷路ゲーム</a>チュートリアルを見てみると良いでしょう。<a href="https://developer.mozilla.org/ja/docs/Games">MDNのゲームセクション</a>で発想やより多くの知識を探してみても良いでしょう。</p> +<p>おめでとうございます。これで全てのレッスンを終えました。ここまでで、キャンバス操作の基本をと簡単な2Dゲームの裏にあるロジックを学んだはずです。フレームワークを学びゲーム開発を続ける良い時期です。このシリーズに対応する<a href="/ja/docs/Games/Workflows/2D_breakout_game_Phaser">Phaserを使ったブロックくずしゲーム</a>や<a href="/ja/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">デバイス回転方向を使った2D 迷路ゲーム</a>チュートリアルを見てみると良いでしょう。<a href="/ja/docs/Games">MDNのゲームセクション</a>で発想やより多くの知識を探してみても良いでしょう。</p> -<p>また、<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">このチュートリアルシリーズの目次</a>を見返せます。コーディングを楽しみましょう。</p> +<p>また、<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">このチュートリアルシリーズの目次</a>を見返せます。コーディングを楽しみましょう。</p> <p>{{Previous("Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html index 771de0d6e5..0ce491e613 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html @@ -10,7 +10,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field")}}</p> -<div class="summary">これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>5番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson05.html" rel="noopener">Gamedev-Canvas-workshop/lesson5.html</a>で入手できます。</div> +<div class="summary">これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>5番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson05.html" rel="noopener">Gamedev-Canvas-workshop/lesson5.html</a>で入手できます。</div> <p><span class="seoSummary">ボールが壁で弾むのを見たりパドルを左右雨に動かしたりできるのは楽しいですが、そのことを除くとこのゲームは何もせず、進捗や最終目標といったものが全くありません。ゲームプレイの観点からすると、まず負けることができるようにするのが良いでしょう。ブロック崩しで負けるということの裏にある論理は簡潔です。もしパドルでボールを逃してボールが画面の下端についてしまったらゲームオーバーになるのです。</span></p> @@ -82,6 +82,6 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) { <h2 id="次のステップ">次のステップ</h2> -<p>今のところかなり順調に進歩してきていて、ゲームも負けるようになったことでもっと遊ぶ価値が感じられるようになってきました。第六章<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field">『ブロックのかたまりを作る』</a>に進み、ボールが壊せるブロックを作りましょう。</p> +<p>今のところかなり順調に進歩してきていて、ゲームも負けるようになったことでもっと遊ぶ価値が感じられるようになってきました。第六章<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field">『ブロックのかたまりを作る』</a>に進み、ボールが壊せるブロックを作りましょう。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/index.html index 2332bd2bf9..06051cec72 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/index.html @@ -21,22 +21,22 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript <p>全てのレッスン、そしてこれから一緒に作る<a href="http://breakout.enclavegames.com/lesson10.html">MDNブロック崩しゲーム</a>の各バージョンは<a href="https://github.com/end3r/Canvas-gamedev-workshop">GitHub上で入手可能</a>です:</p> <ol> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it">Canvasを作ってその上に描画する</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball">ボールを動かす</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls">ボールを壁で弾ませる</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls">パドルとキーボード操作</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over">ゲームオーバー</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field">ブロックのかたまりを作る</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection">衝突検出</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win">スコアと勝ち負けを記録する</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls">マウス操作</a></li> - <li><a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up">仕上げ</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it">Canvasを作ってその上に描画する</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball">ボールを動かす</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls">ボールを壁で弾ませる</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls">パドルとキーボード操作</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over">ゲームオーバー</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field">ブロックのかたまりを作る</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection">衝突検出</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win">スコアと勝ち負けを記録する</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls">マウス操作</a></li> + <li><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up">仕上げ</a></li> </ol> <p>まずはJavaScriptだけで始めるのがWebゲーム開発の確実な知識を手に入れる一番良い方法です。そのあと、自分のプロジェクトで使うフレームワークを選びましょう。フレームワークはJavaScript言語で書かれた単なるツールです。ですから、たとえフレームワークを用いて開発しようとしていてもまずはその言語を学び、手元で実際に何が起こっているか理解すると良いでしょう。フレームワークは開発速度を上げ、ゲームのとるに足らない部分を処理してくれますが、もし何かが思ったように動かないなんてことがあったらいつでもデバッグしたり、あるいは単にJavaScriptで自分なりの解を出すということもできるのです。</p> <div class="note"> -<p><strong>ノート</strong>: ゲームライブラリを用いた2D Webゲーム開発に興味があるのであれば、このシリーズに対応する<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_breakout_game_Phaser">Phaserを使ったブロックくずしゲーム</a>も参照してください。</p> +<p><strong>ノート</strong>: ゲームライブラリを用いた2D Webゲーム開発に興味があるのであれば、このシリーズに対応する<a href="/ja/docs/Games/Workflows/2D_breakout_game_Phaser">Phaserを使ったブロックくずしゲーム</a>も参照してください。</p> </div> <div class="note"> @@ -45,6 +45,6 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript <h2 id="次のステップ">次のステップ</h2> -<p>それでは始めましょう! 最初の章、<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it">『Canvasを作ってその上に描画する』</a>に進みます。</p> +<p>それでは始めましょう! 最初の章、<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it">『Canvasを作ってその上に描画する』</a>に進みます。</p> <p>{{Next("Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it")}} </p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html index 676302d3f2..31d2ac0e1f 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>9番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson09.html" rel="noopener">Gamedev-Canvas-workshop/lesson9.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>9番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson09.html" rel="noopener">Gamedev-Canvas-workshop/lesson9.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ゲーム自体は実際に完成したので、磨き上げにかかりましょう。既にキーボード操作を追加していますが、マウス操作も簡単に追加できます。</span></p> @@ -53,6 +53,6 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls <h2 id="次のステップ">次のステップ</h2> -<p>最後に微調整する準備が整った、完全なゲームが完成しました。では、<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up">仕上げ</a>に入りましょう。</p> +<p>最後に微調整する準備が整った、完全なゲームが完成しました。では、<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up">仕上げ</a>に入りましょう。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html index 6d50976800..b87aceacb0 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html @@ -9,7 +9,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>2番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson02.html">Gamedev-Canvas-workshop/lesson2.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>2番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson02.html">Gamedev-Canvas-workshop/lesson2.html</a>で入手できます。</p> </div> <p><span class="seoSummary">前回のレッスンを一通りこなしてみてボールの描き方が分かりました。では今回はそれを動かしましょう。技術的には、ボールを描画し、またそれを消してからほんの少し違う位置に描画し直すという処理を毎フレームずつ行うことで動いているような印象を生み出します。ちょうど映画がどのように動くのかと同じです。</span></p> @@ -136,6 +136,6 @@ function draw() { <h2 id="次のステップ">次のステップ</h2> -<p>ボールを描画して動くようにしましたが、そのままCanvasの縁から消えていってしまいます。第3章ではどのように<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls">ボールを壁で弾ませる</a>か探っていきます。</p> +<p>ボールを描画して動くようにしましたが、そのままCanvasの縁から消えていってしまいます。第3章ではどのように<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls">ボールを壁で弾ませる</a>か探っていきます。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html index 15b18e0bb5..9728bef6c5 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keybo <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>4番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson04.html" rel="noopener">Gamedev-Canvas-workshop/lesson4.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>4番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson04.html" rel="noopener">Gamedev-Canvas-workshop/lesson4.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ボールは壁で自由に弾み、あなたはずっとそれを見ていることができますが、今の所何の対話要素もありません。操作できないものなんてゲームじゃありません! ですからユーザーとの対話要素、操作できるパドルを追加しましょう。</span></p> @@ -124,6 +124,6 @@ else if(leftPressed && paddleX > 0) { <h2 id="次のステップ">次のステップ</h2> -<p>ゲームっぽい要素を追加しましょう。今問題なのはただパドルでボールを永遠に打ち続けることしか出来ないという点です。これは第5章、<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch/Game_over">ゲームオーバー</a>でゲームの終了状態を追加することで完全に変わることになります。</p> +<p>ゲームっぽい要素を追加しましょう。今問題なのはただパドルでボールを永遠に打ち続けることしか出来ないという点です。これは第5章、<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch/Game_over">ゲームオーバー</a>でゲームの終了状態を追加することで完全に変わることになります。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over")}}</p> diff --git a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html index 6e9b796c0b..dc5119dd85 100644 --- a/files/ja/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html +++ b/files/ja/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html @@ -11,7 +11,7 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_ <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls")}}</p> <div class="summary"> -<p>これは<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>8番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson08.html" rel="noopener">Gamedev-Canvas-workshop/lesson8.html</a>で入手できます。</p> +<p>これは<a href="/ja/docs/Games/Workflows/Breakout_game_from_scratch">ゲーム開発Canvasチュートリアル</a>の10ステップのうち<strong>8番目</strong>のステップです。このレッスンを終えたあとの完成予想のソースコードは<a class="external external-icon" href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson08.html" rel="noopener">Gamedev-Canvas-workshop/lesson8.html</a>で入手できます。</p> </div> <p><span class="seoSummary">ブロックを崩せるのは最高ですが、より素晴らしいものにするためにユーザーが壊した全てのブロックに対してポイントを与え、合計スコアのカウントを更新し続けましょう。</span></p> @@ -90,6 +90,6 @@ original_slug: Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_ <h2 id="次のステップ">次のステップ</h2> -<p>この時点でもこのゲームはかなりよく見えます。次のレッスンでは<a href="https://developer.mozilla.org/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls">マウス操作</a>を追加することでゲームの魅力を広げます。</p> +<p>この時点でもこのゲームはかなりよく見えます。次のレッスンでは<a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls">マウス操作</a>を追加することでゲームの魅力を広げます。</p> <p>{{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls")}}</p> diff --git a/files/ja/games/tutorials/index.html b/files/ja/games/tutorials/index.html index 5ece03f6be..7d02c40371 100644 --- a/files/ja/games/tutorials/index.html +++ b/files/ja/games/tutorials/index.html @@ -17,10 +17,10 @@ original_slug: Games/Workflows <p>This page contains articles that highlight different workflows for effectively creating different types of web games, whether you want to create a 2D or 3D game from scratch, or port a C++ or Flash game over to open web technologies.</p> <dl> - <dt><a href="/en-US/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">2D breakout game using pure JavaScript</a></dt> + <dt><a href="/ja/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">2D breakout game using pure JavaScript</a></dt> <dd>In this step-by-step tutorial you'll implement a simple breakout clone using pure JavaScript. Along the way you will learn the basics of using the {{htmlelement("canvas")}} element to implement fundamental game mechanics like rendering and moving images, collision detection, control machanisms, and winning and losing states.</dd> - <dt><a href="/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">2D breakout game using Phaser</a></dt> + <dt><a href="/ja/docs/Games/Workflows/2D_breakout_game_Phaser">2D breakout game using Phaser</a></dt> <dd>In this step-by-step tutorial you'll implement the same breakout clone as the previous tutorial series, except that this time you'll do it using the<a class="external external-icon" href="http://phaser.io/">Phaser</a> HTML5 game framework. This idea here is to teach some of the fundamentals (and advantages) of working with frameworks, along with fundamental game mechanics.</dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">2D maze game with device orientation</a></dt> - <dd>This tutorial shows how to create a 2D maze game using HTML5, incorporating fundamentals such as collision detection and sprite placement on a {{htmlelement("canvas")}}. This is a mobile game that uses the <a href="/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Device Orientation</a> and <a href="/en-US/docs/Web/Guide/API/Vibration">Vibration</a><strong> APIs</strong> to enhance the gameplay and is built using the <a href="http://phaser.io/">Phaser</a> framework.</dd> + <dt><a href="/ja/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">2D maze game with device orientation</a></dt> + <dd>This tutorial shows how to create a 2D maze game using HTML5, incorporating fundamentals such as collision detection and sprite placement on a {{htmlelement("canvas")}}. This is a mobile game that uses the <a href="/ja/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Device Orientation</a> and <a href="/ja/docs/Web/Guide/API/Vibration">Vibration</a><strong> APIs</strong> to enhance the gameplay and is built using the <a href="http://phaser.io/">Phaser</a> framework.</dd> </dl> |