チュートリアル

このページでは、さまざまなタイプのウェブゲームを効果的に作成するためのワークフローを紹介する、複数のチュートリアルシリーズを掲載しています。

純粋な JavaScript を使ったブロック崩しゲーム

このステップバイステップのチュートリアルでは、純粋な JavaScript を使用してシンプルなブレイクアウトクローンを実装します。その過程で、 <canvas> 要素を使用して、画像の描画や移動、衝突検出、制御機構、勝利と敗北状態などの基本的なゲームメカニズムを実装する基本を学びます。

Phaser を使用した 2D ブロック崩しゲーム

このステップバイステップのチュートリアルでは、前回のチュートリアルシリーズと同じブレイクアウトクローンを実装しますが、今回は、 Phaser HTML ゲームフレームワークを使って実装します。このチュートリアルでは、フレームワークを使用する際の基本的なこと（および利点）を、基本的なゲームの仕組みと一緒に教えることを目的としています。

端末の方向を使用した 2D 迷路ゲーム

このチュートリアルでは、 HTML5 を使用して、 <canvas> 上の衝突検出やスプライトの配置などの基礎を取り入れた2D迷路ゲームを作成する方法を紹介します。これは、ゲームプレイを向上させるために、端末の方向とバイブレーション APIを使用したモバイルゲームであり、 Phaser フレームワークを使用して構築されています。

2D platform game with Phaser

このチュートリアルシリーズは、 Phaser を使って、スプライト、衝突、物理、コレクションなどの基本的なプラットフォームゲームを作成する方法を紹介するものです。