ワークショップ:JavaScriptを使ってゲームブックを作ろう

担当者

金堀利洋(筑波技術大学)


到達目標

Webページを操作するプログラミング言語JavaScriptを使って、簡単なゲームブックを作ります。

JavaScriptの関数を呼び出すことができるようになること、条件文を使って物語に変化をつけられるようになること、さらには、変数を使って様々なパラメーターを利用できるようになることを目指します。


実施内容の概要

  1. ゲームブックとは

    もともとは本の形式になっていて、物語の途中に「道が左右に分かれています。どちらに進みますか?右に進むなら10ページ、左に進むなら30ページを開いてください。」といったように読者に判断を求める文章が出てきます。読者は選択肢から選んだ行動にしたがって、ページを開いて物語を読み進めていくというものです。
    さらにはサイコロによって結果が決まったり、アイテムを使ったり、体力や魔力といったパラメーターが用意されていたりと、非常に内容が豊富なものもあります。

  2. JavaScriptとは

    JavaScriptは、Webページの内容を操作するためのプログラミング言語で、これを使うことで、Webページを見ている人にあわせて、その人の名前を表示させたり、色を変えたり、アニメーションを入れたりといった事ができるようになりました。今回は、このJavaScriptを使って、Webページ上でゲームブックを作ります。

  3. Webページの中身

    WebページはHTMLという言語で書いてあります。
    いくつか例外はありますが、<タグ名>中身という書き方で構成されていて、”中身”に対して、”タグ名”という意味をつけていきます。

  4. 関数の使い方

    JavaScriptでは関数を呼び出して様々な機能を利用します。また、自分で関数を作ることもできます。
    今回は、便利な関数を用意しましたので、それらを使ってゲームブックを作ってもらいます。

  5. 条件文の使い方

    条件文を使って、変化に富んだ物語を作ってみましょう。

  6. 変数を利用する

    変数という、数字や文字などを入れておく箱を使うと、さらにいろいろな事ができるようになります。
    今回は、あらかじめheroという変数を用意しています。これは主人公のパラメーターを入れておくものです。
    自分で変数を作ることもできますので、これを利用して敵キャラを作ったりして、より複雑な物語を作ることができます。


事前に準備しておいて欲しいこと

自分で作ってみたい物語をあらかじめ考えておいてください。ただし、あまりに壮大なものは時間内につくるのは難しいので、コンパクトにお願いします。
プログラムは日本語とアルファベットだけでなく、いろいろな記号を使って書くので、できればキーボードにある記号にどんなものがあるか、また、どこあたりにあるか調べてみてください。

読んでおくと役に立つ参考書など

特にありません。

プログラムに戻る