あるくテック

「分かる」をつくりたい。

プログラミングの授業例 Webゲームの授業について

今回は、Webゲーム制作の授業の様子をざっくりとご紹介です。

Webゲーム(ブラウザゲーム)とは

Webページを見るためのアプリケーションを「ブラウザ」または「Webブラウザ」と呼びます。代表的なものはGoogle Chrome、Safari、Edge、Internet Explorerなどです。

そしてこのブラウザがあれば遊べるゲームのことを、一般的にWebゲームまたはブラウザゲームと呼ばれています。

ゲームを作るために必要なもの

ゲームを作る、つまりプログラミングするために使うものを「開発環境」といいます。無料で使える開発環境も今はいろいろとあります。

Webゲームのための開発環境

授業では、HTML、CSS、JavaScriptの3つのプログラミング言語を用いた実習を行っていました。最低限必要なものは

  1. ブラウザ(Google Chromeなど作ったプログラムを動かすため)
  2. テキストエディタ(メモ帳、Brackectsなど無料のものが豊富にある)
  3. インターネット環境(場合によっては無くても可)

の、実は3つだけです。とはいえこれだけだと不便なので学習しやすいように開発環境を工夫しています。

どんな授業?

Webゲーム制作の環境を工夫することで、こんな授業ができます。

  • 数十行のプログラムを入力するだけで、ゲームが完成する。
  • 作ったプログラムがすぐに動く

文字を入力して行うプログラミング(テキストベースとも呼ばれます)では、1つのプログラムを動かすために数十行から時には数千、数万行というかなりの量の文字入力を行います。しかもたった一文字でも違っていると、プログラムは正常に動作しません。

ですので少ない入力で動かせるのは、学習効率の向上にも役立ちます。初めてテキストベースのプログラミングを学ぶ人にとっても気軽に取り組めますね。

 開発環境についてのより詳しい情報は過去記事にて(古い過去ですいません)

arukutech.hatenablog.com

arukutech.hatenablog.com

 

arukutech.hatenablog.com

記事中のjsdo.itは残念ながら2019年にサービスが終了しています。

jsdo.it - Share JavaScript, HTML5 and CSS

おまけ。プログラミングにアクティブラーニングが必要な理由

過去記事に書きましたので、よかったら合わせてご覧ください。

arukutech.hatenablog.com