東京都教職員研修センター「夏休みスペシャル体験講座」

2014年8月9日(土)、NPO法人デジタルポケットは東京都教職員研修センターにて行われた平成26年度「企業等による体験型講座」『夏休みスペシャル体験講座in水道橋』にて 「Viscuitでコンピュータゲームづくり」授業をおこないました。。

当日の様子

taiken1
会場には小学校で行われる企業等による出前授業が集まり、参加する児童生徒は事前に申し込んだ授業に出席しました。東京都として初の試みだったこのイベント、なんと、応募総数は約9700件だったとのことです。児童、保護者からも企業等によって行われる授業に興味が集まっていることがわかります。当日は児童生徒が約480名、教員他参観者は約230名の方々が来場されました。

taiken2
デジタルポケットでは小学3年生から中学3年生までの児童生徒25名を対象に1時間半のViscuitをつかったプログラミングの授業をおこないました。かなり幅広い年齢層で、実際に当日に生徒児童が集まると一番背の低い児童と、一番背の高い児童の身長差が低い児童の1.5倍くらいありました。しかし、みんなプログラミングがしたい!プログラミングってなに?という気持ちは一緒です。一緒にプログラミングの授業を受けました。

taiken3
デジタルポケットのプログラミング授業では、説明を聞くときはコンピュータから離れて前に集まってもらいます。高学年児童、生徒は少し面倒くさがりますが「人間は、子どもも大人もコンピュータがあると話を聞かないものなので、集まってください」と、集まってもらいます。

taiken5
製作は、前半がそれぞれの机が集まった島で「うみ」をテーマにプログラミングアニメーションをつくる「ビスケットランド」、後半は各自で自分のゲーム作品をつくる時間でした。この写真は後半のゲームをつくっているときの写真です。楽しんでいる状況だと「わいわいがやがや」と音があるのかと思われがちですが、実は集中しているので教室は驚くほどしーんとしています。もくもくと自分の想像をゲームにするために頭を使ってプログラミングを組み立てます。

20140809fusen
ビスケットで作るゲームも、ゲームづくりの中で段階があります。前半は「①ボタンを押したら風船が割れる」「風船が割れたらその中から何かがでてくる」という簡単な「びっくり風船」をつくります。この風船は割れたらなぜかまな板がでてきて、まな板が下に動く、というプログラミングがされています。実際に遊ぶ場合はこちらから遊ぶことができます(Flashプレイヤーが必要です。リンクを開いたら、画面の任意の場所をクリックしてください。1キーが使えるようになります。スペースキーではじめの位置から再スタートできます)。

taiken4
一度、「びっくり風船」ができあがったら、席を立ち上がってもらって他の人の風船を割りにいってもらいます。そうすると自分では思いつかなかったアイデアをつかって、みんなが作品をつくっているのがわかります。逆に自分のアイデアは人が思いつかなかったアイデアです。自分の作品で人が喜んでいるところを見ると、自ずと創作意欲が湧いてきます。

20140809game1a
風船作りが終わったら、今度は自分の絵で、自分のアイデアも入れて、ゲームをつくっていきます。これは女の子がつくった作品です。ハサミが茶色い箱の上にきたときに①を押すと、箱が空いて、プレゼントがでてきます。プレゼントは②を押すと開きます。どんなものがでてくるか、みなさん、やってみてください。こちらから遊ぶことができます(Flashプレイヤーが必要です。リンクを開いたら、画面の任意の場所をクリックしてください。1キー、2キーが使えるようになります。スペースキーではじめの位置から再スタートできます)。

20140809game1b
ビスケットではメガネでプログラミングをしますが、このゲームのメガネは上のようになっています。メガネの左側に①②が入っているメガネが、それぞれ、①を押したとき、②を押したとき、という命令になっています。その他のメガネは同じ絵が入っていれば左の絵よりもずれた方向に動きますし、違う絵が入っていればその絵に変わります。

20140809game2a
このゲームは①を押すとロケットが5発一斉に上にとんでいきます。そうすると風船にぶつかって点数が表示されます。画面上に書かれているように300点以上出せばクリアだそうです。風船の色が違うと出てくる点数も違います。赤、青、緑の風船の色が鮮やかでとてもかわいいですね。また、ゲームを説明しているヒヨコの黄色も鮮やかです。こちらから遊ぶことができます(Flashプレイヤーが必要です。リンクを開いたら、画面の任意の場所をクリックしてください。1キーが使えるようになります。スペースキーではじめの位置から再スタートできます)。

20140809game2b
メガネの数はそんなに多くはありません。一つ一つの風船に「ぶつかったら」のメガネが用意されています。また、それぞれの風船に横に動くプログラミングがされています。あとは、①を押したらロケットが火のついたロケットにかわる、火のついたロケットは上に進む、の8つのメガネでできています。先のハサミで箱を開けるゲームと同じ数です。

20140809game3a
これはゲームにはなってないのですが、とてもおもしろい世界観が表現されています。女の子のつくった作品なのですが、遊び合いのときに「これはボタンの機能をつかってもおもしろいのに」と話すと、「そんなことができるの?知らなかった」と、言っていました。おそらく、最初の方の絵と絵が「ぶつかったら」のプログラミングで発想がひらめいて、集中してずっとつくっていたのでしょう。タイトルは「モミジ狩りしようぜ!〜モミジいがいにもあるよ〜」だそうです。こちらから遊ぶことができます(Flashプレイヤーが必要です。リンクを開いたら、画面の任意の場所をクリックしてください。スペースキーではじめの位置から再スタートできます)。

20140809game3b
メガネをみてみるとこんなにたくさんのメガネがつくられています。ざるを持っている主人公がいて、左上にある「もみじ」「いちょう」「包丁」「爆弾」がそれぞれ下に移動するようにプログラムされていて、それぞれに当たったときのリアクションが全て用意されています。そして、リアクションを撮った後に、また最初の絵に戻るようにしてあります。

taiken6
最後は自分のゲームにタイトルをつけて遊び合いです。「ようきな人の大ぼうけん」「なぞのぼう人間」「一生続くゲーム」「パクパクくん」「飛行機ゲーム」など、オリジナルのゲームが並びました。105分の短い時間でしたが、できたゲームのクオリティーは驚くほど高かったです。簡単に思いを形にできるのはビスケットの特徴ですね!

taiken8
遊び合いが終わった後は、ビスケットでつくった、ウィルスが伝染するシミュレーションを見てもらい、情報の特性の話をしました。話だけではなかなか難しいことですが、ちょうどいままでその特性を使ってゲームをつくっていたところです。「ああ、こういうことだったのか」と納得してもらえたと思います。
最後はみんなに修了書が手渡されました。

出来上がった作品

※作品の閲覧にはFlashプレイヤーが必要です。

前半(ビスケットランド)

海1

4-3umi
大きな画面でみるにはこちら
ひとつひとつの作品はこちら

海2

20140809land2
大きな画面でみるにはこちら
ひとつひとつの作品はこちら

海3

20140809land3大きな画面でみるにはこちら
ひとつひとつの作品はこちら

ゲームづくり

左側に表示されるサムネイル画像から遊びたい作品を選ぶことができます。
上部のメニューの中にある「あそぶ」ボタンをクリックすると全画面で遊ぶことができます。
その場合は、画面の任意の場所をクリックすると上下左右1,2キーでゲームを操作することができます。
こちらから作品が見れます。

授業の詳細

授業のタイムスケジュール

00:00 自己紹介
00:05 ビスケットの基本的なプログラミングをレクチャー
00:10 レクチャーを受けた範囲で自由制作(テーマ「うみ」)
00:20 さらに新しいプログラミングの技をレクチャー(回転・2つの命令)
00:35 ビスケットランド発表会〜前半の授業のまとめ
00:40 びっくり風船の作り方レクチャー
00:55 びっくり風船で遊び合い 
01:05 ゲームづくり開始
01:30 遊び合い開始
01:40 授業のまとめ(「風邪のシミレーション」)
01:45 終了

実施

日時:2014年8月9日(土) 90分の授業(実際の持ち時間は105分でした)
参加者人数:22名
参加者学年:小学3年生〜中学3年生
場所:東京都教職員研修センター
講師:デジタルポケット講師1名+アシスタントファシリテータ2名
内容:プログラミングゲームづくり