Comments
Description
Transcript
最小オブジェクトと最小スクリプトを用いて学ぶ 数学マイクロワールド A
最小オブジェクトと最小スクリプトを用いて学ぶ 数学マイクロワールド 野口孝文* 釧路高専 電気工学科 A Microworld Learning for Mathematics Using Minimum Objects and Scripts Takafumi Noguchi* Kushiro National College of Technology We have been teaching computer programming with game programming for more 10 years. Students can learn not only programming but also mathematics by trial and error in our system which we have been developed and improved. Computer programming teaching for novice requires various knowledge such as computer operation, tools for programming and programming language. Furthermore, we have to teach various kinds of students who have differences of ability at the same time in the class practice. It is therefore extremely important that we prepare suitable exercises. In this paper, we describe how to solve these issues. キーワード:プログラミング,数学学習,スクリプト,マイクロワールド,IntelligentPad 1. 開発用のプログラミング環境を授業に利用することが多 はじめに く,操作を限定しても初心者にとって理解しにくいとい これまで我々は,高専の電気工学科 2 年生を対象に, う問題があった.また,学習を意識した Squeak(3) や ゲーム作りを通したプログラミングの授業を 10 年以上 Alice(4)といったシステムも,システムの考え方を理解し 実践してきた(1)(2).我々の開発改良してきたシステムでは, プログラムの学習ばかりでなく高校で学ぶ数学を体験的 なければ使いこなすのは簡単ではない.例えば,実行結 果を表示するために必要な最小限のプログラミングも, に学ぶことにも対応している. 初心者にとっては,障害の一つである.さらに,多様な 初心者のプログラミング教育においては,コンピュー 学習者に対応する課題を用意することは,より難しい. タ利用に関する知識やプログラミング環境利用の知識, 我々のシステムは,可視化したオブジェクトを部品と プログラミング言語に関する知識,論理的思考力等の多 して用いることで,最小限の部品とスクリプトで多様な 様な知識を必要とするばかりでなく,これらの知識に関 プログラムを実現することができる.プログラミング環 して多様なレベルのユーザにも対応しなければならない 境として,制限した単純な環境を学習者に与えることが という難しさがある.したがってプログラミングの実習 できる.さらに,プログラムの制御構造を単純化して, では,学習者に与える課題も重要である.結果が一様に プログラミングを容易にしている. 限定されるような課題では,学生ごとに終了時間に大き また,プログラミングの課題をゲーム制作とすること な差ができる.例えば,学生全員が一定時間内でできる で,学生の興味を引くばかりでなく,学習者の多様な能 ような簡単な課題では,多くの学生が時間を持て余し, 力を発揮できるようにしている.例えば,プログラミン 難しい課題を与えるとほとんどの学生が時間内に終了し グの学習があまり進まなくても,ゲームのストーリーや ない. アニメーション,表示する絵などで,他の学生にない作 初心者のプログラミング学習では,学習者の負担を軽 品を作ることができる.そしてこれらも,部品化したオ 減しながらも多様な学習者に対応できるプログラミング ブジェクトの組み合わせ(プログラム)として作品に反映 環境が要求される.さらに多様な学習者を満足する適切 させることができる. な課題が要求される.従来のプログラミング学習では, 1 学生は,自身の知識に応じ試行錯誤しながら作品を仕 電流計表示パッド 上げることができる. 手続きパッド 本報告では,長期にわたる実践に用いているシステム スロット 結合 について述べる.また,実習の中からシューティングゲー ムの課題について紹介する.このゲームプログラミング 電流計パッド 抵抗パッド 回路解析パッド では,学生は,数学で学ぶ三角関数や図形などの数学を 試行錯誤から学習し,それを反映したオブジェクトを簡 図1 パッドの貼り合せ 2.2 単に作りゲームに組み入れている.プログラミングを不 手続きパッドとプログラミングの学習 得意とする学生も興味が持てる作品ができ,さらにプロ オブジェクト同士をダイナミックに結合する方法とし グラムを得意とする学生は,オブジェクトを簡単に複写 て,スクリプトを利用するというシステムは多くある. し再利用しながら,多数のオブジェクトを組み合わせた IntelligentPad では,パッド同士の結合は,標準化され 作品を実現している.本報告では,システムが複数の学 たスロットの結合によって行う.しかし,より多様な組 習に適応可能な理由とその事例について述べる. み合わせを実現するために,スクリプトの記述ができる 2. 「手続きパッド」がある. インテリジェントパッドを用いたプログ ラミング環境 本システムでは,プログラミングの学習にこの手続き パッドを用いている.手続きパッドと既存のパッドを組 2.1 IntelligentPad システム み合わせることで,最小のプログラムで,その結果を即 IntelligentPad は,パッドと呼ばれるオブジェクトを 座に確かめることができる.図 2 は,入力した値を 10 倍 ダイナミックに組み合わせたり,変更したりできるシス して表示するプログラムの例である.キーボードからの テムである. 数値の入力や結果の表示に,数値パッドを用い,プログ パッドは,ディスプレイ上に可視化されており,それ ラムは 5 行でできている. らに対する操作のインタフェースに「紙のメタファ」を 用いている.ユーザは,マウスによる直接操作でパッド テキストパッド を自由に組み合わせることができる. パッドは,他のパッドに貼付することによって,一体 化され,一体化されたパッドは,それぞれのパッドの機 能を併せ持った(機能合成された)新しい合成パッドとし て動作する.合成パッドを構成するパッドは,剥がした り,複写したりして別の合成パッドの部品に利用できる. 数値パッド また,パッドは,複数のスロットを持つことができ, 手続きパッド そこにさまざまなデータを保持できる.貼り合わされた パッド同士は,このスロットを結合しデータを共有でき 図 2 手続きパッドを用いたプログラム る.貼り合わされたパッド間には,任意のパッドを組み 合わせて機能合成を実現するための標準化が行われてい 2.3 る. 授業への適用 本システムは,電気工学科のプログラミング実習に用 図 1 は,複数のパッドを組み合わせて実現した学習支 いている.対象学生は,高専の 2 年生で高校の 2 年生に 援システムの例である.図1に示した手続きパッドは,C 相当する.45 分×2 を 1 回として 1 年間でおよそ 30 回 言語のサブセットからなるスクリプトを記述することが の実習を行っている.1 回の実習の中では,30 分から 45 できるパッドである.プログラミングの学習では,これ 分程度の説明を行い,残りを実習にしている.1 回目の授 を用いてプログラミングを学ぶ.このことについては, 業で,ガイダンス及びプログラムの働きを説明する他は, 次節で述べる. システムを使いながら実習を進めている. 2 カリキュラムの簡単な内容を表 1 に示す.授業項目数 て示してある.モデルの中のメソッドは,「setValue: が 30 回に満たないのは,試験の解答等に当てている時間 aSlot value: aValue」のみを示している.その他の矩形 を除いているためである.本報告の 3 章において,表の は,ビューのメソッドである.図 3 は,中央のパッドの 最後に示したシューティングゲームを例にして,本シス モデルからメッセージが開始したことを示している.こ テムが前述の多様な学生に対応していることについて述 のセージの流れは, 4 枚以上のパッドが貼り合わされても, べる. 全く同様に適用できる.また,図中の「×」は,無限ルー 表1 プログラミング実習内容 プを避けるためにメッセージの流れを阻止していること 実 習 1 2 を示している. 3 4~8 9~13 14~19 20~27 2.4 内 容 ガイダンス, コンピュータの構成,プログラムの働き,時 計プログラムの作成 手続きパッド,イベントドリブン,スロット, 演算プログラム 制御文,乱数,さいころプログラム等 モグラたたきプログラム 関数電卓プログラム シューティングゲームプログラム 7 updateToChildren A updateToParent view 6 8 9 3 updateToChildren updateToParent × 2 10 11 C updateToChildren updateToParent IntelgentPad では貼り合わせの基になるパッドを親 4 gimme: aSlot 1 updateView × set: aSlot value: aValue 強い制約とプログラムの自由度 5 setValue: aSlot value: aValue update B model updateView 15 メッセージの開始例 setValue: aSlot value: aValue 12 setValue: aSlot value: aValue 14 16 updateView 13 17 パッドと呼び,これに貼付したパッドを子パッドと呼ぶ. A 親パッドには複数のパッドを貼付できる.スロット結合 B C パッド において,子パッドは,ただ 1 つのスロットを親のスロッ メッセージの伝搬 伝搬阻止 gimme: aSlot メソッド × 図 3 3 枚のパッドの貼り合せとメッセージ制御 トに結合できる.貼り合わせとスロット結合に関しては, このように強い制約を課している. 2.6 共有複写による多様なデータ結合 この制約は,ユーザの自由度を減じているように見え 2.4 節で述べたようにスロット結合は,親子間でのみ許 るが,むしろ作成した合成パッドの再利用の可能性を広 している.しかし,1 つのボタン(マウスクリックで動作 げている.また,次節で述べるメッセージ制御を用いる する)パッドから親子関係にない複数のパッドを起動し ことによって,任意枚数のパッドを貼り合わせスロット たいときもある.それを可能にするパッドの仕組みとし 結合ができるようにしている. て共有複写がある.これは,パッドを構成する MVC オ 2.5 ブジェクトの一つであるモデルを複数のパッドで共有し スロット結合とメッセージ制御 本システムでは,複数のパッドを貼り合わせて,機能 た構造をしている. 合成した合成パッドを作ることができる.学生は作成し 共有複写は,例えばエクセルなどで,データを共有し た合成パッドを自由に複写したり組み合わせたりして作 た 2 つのビューの一方が表の表示を,他方がグラフの表 品に使用することができる. 示を行っているとき,グラフを操作してデータを変更し 複数のオブジェクトを自由に組み合わせるためには, たときにも,表を操作してデータを変更したときにも, メッセージの制御と組み合わせたオブジェクトの数に関 それぞれのグラフと表の表示に整合性が保たれることに 係なく動作させる標準化が必要である. 図3 に3 枚のパッ 似ている. パッドにおける実現方法を図 4 に示す.図の(a)は,共 ドを貼り合わせたときのパッド同士のメッセージの流れ を示す. 有複写を示している.(b)は,同じデータの共有をスロッ 図中 A,B,C の矩形は,パッドを表しており,さらにそ ト結合で実現していることを示している.(c)は,(a)と(b) れぞれの中の矩形は,メソッドを表している.各パッド の機能を組み合わせて,親子関係にないパッドのスロッ は,MVC(モデル・ビュー・コントローラ)のオブジェ トのデータを共有する方法を示している.共有複写され クトからなるがここでは,モデルとビューの 2 つについ たパッドの一方を透明にしておけば,親子関係にない 3 パッドのスロットを結合したように見える.これを「結 置が変わるので,理解が容易である. リスト 1 にプログラムの例を,図 5 に,プログラム実 線」と呼んでいる. 行の様子を示す.モービルパッドは移動機能を持った VC VC M VC パッドである.このパッドには,リスト形式の座標デー タを与えている.これは,表の表示機能を持ったパッド M VC とデータ形式を統一している.図 5 のプログラムのタイ M マパッドを起動することで,モービルパッドは,左下方 (b)スロット結合を用 いたデータ共有 (a)共有複写 から右上方に移動する.このときの座標は,台紙のパッ ド(任意)の左下方を(0,0)に,右上方を(1,1)に正規化し VC VC ている. (1,1) M M VC M VC タイマパッド <clock> 共有複写 パッド メッセージの流れ (c)共有複写を用いたデータ共有 図 4 共有複写とデータ共有 モービルパッド 3. シューティングゲーム用いたプログラミ ング (0,0) ここでは,30 回の実習の最後の 8 回を割り当てている 手続きパッド 図 5 イベントによるプログラムとモービルパッドの移動 課題「シューティングゲーム」について述べる.この課 リスト 1 題では,パッド(オブジェクト)をスクリプトで様々な形に slot Dictionary zahyo; slot Command clock; slot Number x,y; action clock() { Dictionary temp; if(x>1) x=0; x=x+0.1; y=y+0.1; put(temp, "x", x); put(temp, "y", y); put(zahyo,"ABC", temp); } 組み合わせ,それを部品としてより複雑な組み合わせを 作成する.手続きパッドにスクリプトを記述することは プログラミングであるが,様々なオブジェクトを組み合 わせることもプログラミングである.しかし,学生はそ のことを認識することなく課題の制作ができる.本シス テムでは,プログラミングを得意とする学生ばかりでな く,様々な学生が作品制作に取り組んでいる.以下に, この課題の実習内容について述べる. 3.1 <zahyo> モービルパッドを用いたアニメーション ウインドウ上にアニメーションを表示するには,図形 3.2 の描画やその書き直し等の操作が必要になる.初心の学 イベント駆動によるプログラムの簡単化 前節に示したプログラムでは,全く繰り返しの制御構 生にとって,図形の軌道の計算ばかりでなく移動前や移 造を使っていない.初心の学生にとって繰り返しや条件 動後の図形の位置等を考えることは,負荷が大きい.本 分岐といった制御構造は,プログラムの理解をより難し システムでは,図形を表示するオブジェクトや移動する くしている.本システムでは,この繰り返しをタイマに オブジェクトを与えることで,学生の負担を軽減してい よるイベント駆動で実現し,プログラムを簡単化してい る.学生にとって,ディスプレイ上に表示されるオブジェ る(1). クトに座標のみを与えるだけで,オブジェクトの表示位 イベント駆動は,学習者にとっても理解が容易である. 4 図 5 のパッドでは,タイマによって繰り返しイベントを している. 発生させているが,ボタンパッドを貼付するだけで,マ モービルパッド タイマパッド ウスクリックによってイベントを発生させ,パッドの動 作やスロットの値を確かめることができる. <list> 汎用のプログラミング開発環境では,デバッグモード <clock> <zahyo> に切り替えてステップ動作で各部の変数を確かめること (a) ができるが,こちらの方が,操作は簡単である. 3.3 <counter> 手続きパッド 直感的に分かる数学マイクロワールド 貼り合わせが逆 本実習のシューティングゲームの課題では,いろいろ <clock> <zahyo> な軌道データを作り画面上で複数のオブジェクトを動か <list> す必要がある.本システムでは,試行錯誤しながら容易 に軌道を確かめることができる.例えば,図 5 で示した モービルパッド プログラムの 1 行を変更するだけで,様々な関数の形状 タイマパッド 結線 <counter> (b) 台紙パッド 図 6 手続きパッドとモービルパッドの貼り合わせ関係 を見ることができる.プログラムの下線部を 3.5 「y=0.2*sin(x*10)+0.5;」と置き換えるだけで,モービル 独立したパッドの連携 パッドは正弦波の軌道を描いて動き出す.三角関数につ 複数のモービルパッドを独立して動作させる方法を前 いては,1 年生で学んでいるが,この授業で,多くの学生 節で述べた.シューティングゲームの場合,動く物体を が各パラメータの意味を実感する.例えば,0.2 や 10, 弾で撃ち落とす必要がある.そのためには,2 つのモービ 0.5 といった値をスロットに置き換え,キーボードから直 ルパッドの重なりを検知し,その状態の変更によって, 接変更することによって,軌道を即座に変更させて見る. 軌道を変える必要がある. この検知するパッドとして,レーダパッドを用意した. このことは学生にとって印象的で,いろいろと試行錯誤 レーダパッドは,共有複写を利用して重なりを検知する. している学生の姿が毎年見られる. また,図 5 のプログラムにおいて,0.1 の値を他の値に 共有複写の数は,何枚でも可能にしている. 変更することで,モービルパッドを任意の方向へ直線運 レーダパッドには, <hit>と<search>というスロットが 動させるプログラムを作ることができる.方向をθ,1 ある.定期的に重なりを調べるために,共有複写したレー 回のプログラム実行での移動量を dr とし,x と y のプロ ダパッドの1つに,タイマパッドをスロット結合する. グラムを x=x+dr*cosθ,y=y+dr*sinθとすれば,θを変 図 7 では,レーダパッドの<search>スロットとタイマ 更するだけで任意の直線の軌道を作ることができる. パッドを結線で結合している.<hit>スロットには,重な りがあるとTRUEがセットされ, 重なりがないとFALSE この直線運動を組み合わせて,任意の多角形のプログ がセットされる. ラムを作ることは,3.5 節で述べる. 3.4 図 7 は,重なりを調べるために,<hit>スロットにその オブジェクトの貼り合わせを変える 図 5 のパッドは,手続きパッドを台紙にして,その上 値によって表示が変わるスイッチパッドを結合し,レー ダパッドが重なりを調べる様子を示している. にモービルパッドとタイマパッドが貼り合わせされてい る.この貼り合わせ順序を逆にすることで,再利用可能 3.4 節で作成したモービルパッドのプログラムを,リス な動くパッドが実現できる.その貼り合わせを図 6 に示 ト 2 に示したプログラムで置き換え,さらにその手続き す.図 6 において,(a)から(b)を作る.作成したパッドを パッドにレーダパッドを貼付すると,複数のモービル 台紙パッドの上に複数並べると,それぞれ独立して動か パッドが重りによって動きを変える(打ち落とす)プロ すことができるようになる.ただし,タイマパッドは, グラムが可能になる.図 8 は,このプログラムを実行し それぞれの手続きパッドに貼付する代わりに,前章の 2.6 たときのモービルパッドの動きを示している. 節で述べた「結線」で行っている.システムは,共有複 写したパッドの一方のパッドを透明化して,これを実現 5 を観察できる. 次章では,以上の試行錯誤をしながら作成した学生の レーダパッド 作品を紹介する. FALSE になる リスト 3 スイッチパッド slot Dictionary zahyo; slot Command clock; slot Number x,y,r,dr,th; action clock() { Dictionary temp; x=x+dr*cos(2*th*PI/3); y=y+dr*sin(2*th*PI/3); r=r+dr; if(r>1) {/*r は辺の長さで,1 になると向きを変える*/ r=0; th=th+1; if(th==3) th=0; } put(temp, "x", x); put(temp, "y", y); put(zahyo,"ABC", temp); } 重なり 結線 TRUE になる タイマパッド 図 7 共有複写されたレーダパッド リスト 2 slot Dictionary zahyo; slot Command clock; slot Number x,y; slot Boolean rakka,hit; action clock() { Dictionary temp; x=x+0.01; if(rakka ==TRUE) y=y - 0.1;/*下方への移動*/ else y=0.5;/*水平移動*/ if(x>1 || y<0) {/*表示範囲を超えると初期値に戻す*/ x=0; rakka =FALSE; } put(temp, "x", x); put(temp, "y", y); put(zahyo,"ABC", temp); } action hit() {/*一度 hit が TRUE になると rakka は TRUE*/ if(hit==TRUE) rakka = TRUE; } 4. 実践例 4.1 学生に提示するプロトタイプのゲーム 学生に提示しているシューティングゲームを図 9 に示 す.また図の下に,パッドの貼り合わせを示す.ただし 一部,ボタンパッド等を省略してある. このゲームは, 「shoot」ボタンを押すと左下から絵を 表示したパッドが放物状に打ち出される.一方,別のパッ ドが毎回高さをランダムに変え左端から現れる.パッド 同士が当たると,下から打ち出されたパッドは,左下隅 に消え,当てられたパッドは,下方に落下する. 多くの学生は,前節で述べた順にプログラムを作成し, 共有複写したレーダパッド ここで示したような作品を作る.その後学生は,初めに 手続きパッド 作った動くパッドを複写し,その中の手続きパッドに記 重なるとモービ ルパッドの移動 方向が変わる されたプログラムを変更したり,初期値を変更したりし て,さらにたくさんの動くパッドを作る.それぞれの動 モービルパッド 台紙パッド くパッドは,独立して動きを確かめることができるので, 図 8 条件によって移動方向が変わるモービルパッド ゲームを構成するパッドの数は,学生によっては,100 枚を超える.なお図 9 に示したパッドは,20 枚ほどから 3.3 節でも述べたが,このように複数の軌道をプログラ 構成されている. ムすることで,任意の幾何学図形に沿った軌道で動く 2008 年度の学生が作成した作品2 点を以下の節に示す. パッドを作ることができる.リスト 3 は,正 3 角形に動 一つは,使用しているパッドの数がそれほど多くない学 作させるプログラムである.任意のパラメータをスロッ 生の作品で,もう一つは多くのパッドとスクリプトが記 ト化することで,その値をリアルタイムで変化させ動き 6 ラムが定義されている. 述された学生の作品である. 次節に紹介する学生に比べるとパッドの使用枚数は多 くはないが,絵を工夫し,ゲームとしておもしろくなる ようにまとめている. 4.3 学生のプログラミング例 2 図 11 に示すゲームを作成した学生は,プログラミング を得意としている.キーボードの矢印操作で,飛んでく る障害を避けながら主人公が前に進む.いろいろな場面 手続きパッド が用意されており,得点の状態などにより様々なメッ レーダパッドとタイマ パッドとの結線 イメージパッド セージが表示される. この作品にも用いているパッドの数は, 286枚である. レーダパッド その内,手続きパッドは 20 枚で,その中に記されたプロ 共有複写 <hit> <zahyo> <hit> <clock> <zahyo> グラムの行数は,2600 行である.用いている絵の数も 69 <search> <hit> 枚である.手続きパッド 1 枚あたり,130 行のプログラ 結線 ムが定義されており,前節の学生に比べると多い. モービルパッド <counter> 台紙パッド タイマパッド 図9 シューティングゲームとパッドの貼り合わせ 4.2 学生のプログラミング例 1 学生の作成したシューティングゲームを図 10 に示す. このゲームは,アイスホッケーゲームで,キーボードの 矢印操作で「パック」のシュート位置を決め,スペース 図 11 プログラムが得意な学生の作成したゲーム キーを押すとシュートできるというゲームである. 4.4 多様な学生への対応 4.2,4.3 節の作品で見るように,学生によって様々な 作品が作られる.パッドの組み合わせ方やパッドの動き, 絵の表示は,それぞれの学生ごとに異なることが分かる. プログラミングの実習で,問題を与えそれを解きプロ グラムソースを提出させるという課題であれば,ほとん どが同じ解答になってしまう.本実習においても,異な る学生の作品で,手続きパッドに記されるプログラムの 内容が類似したものも多数ある.しかし,プログラムで は,オブジェクトの組み合わせもプログラミングである. シューティングゲームの課題として,学生のプログラム を比較するとすべてが同じになることはない. シューティングゲームは,工夫の可能性が多くまた, 図 10 プログラムが苦手な学生の作成したゲーム 試行錯誤の中で学ぶことも多い,優れた課題である.た この学生のパッドの使用数は,69 枚,手続きパッドは だし短時間で作品に仕上げるには,本システムのような 10 枚である. その中に記述しているプログラムの行数は, 仕組みが必要である. 300 行である.手続きパッド 1 枚あたり,30 行のプログ 7 5. おわりに 本報告では,高専の電気工学科 2 年生を対象に,ゲー ム作りを通してプログラミングの実習を 10 年以上実践 してきたことについて述べた.我々の開発改良してきた システムでは,プログラムの学習ばかりでなく高校で学 ぶ数学や物理を体験的に学べる. パッド(オブジェクト)を組み合わせることもプログラ ミングであるが,学生はそのことを意識していない. シューティングゲームでは,オブジェクトは可視化され ているので,学生は部品を組み合わせるようにプログラ ムを作っている.また,このプログラミングの中で,学 生は様々な動きをするパッドを作っている.ゲーム作成 の過程で,数学的知識を試行錯誤しそれをプログラムに 取り込んでいる. さらにプログラムに興味を持った学生は,パッドが多 数になる作品に挑戦している.コンピュータ上のオブ ジェクトには,親子間のスロット結合の仕方や貼り合わ せ方法等の強い制約があるが,これが結果的に自由度の 高いシステムを実現している. 我々のシステムは,多様な学生に対応でき,プログラ ミング教育ばかりでなく,学習者自身が考えを試すこと ができる数学教材としても有用であると考えている. 参考文献 (1) 野口孝文, 田中譲, プログラミング学習のための ツールキットシステムを用いたマイクロワールド, 教育システム情報学会論文誌,Vol. 16, No.4, pp. 208-216 (2000) (2) 野口孝文,マイクロワールドにおける教材提示と管 理」 ,電子情報通信学会,教育工学研究会論文集, pp.39-42 (2006) (3) Stephane Ducasse, Sueak: Learn Programing with Robots, Apress, p. 351 (2005) (4) Alice: An Education that teaches students computer programming in a 3D environment, Carnegie Mellon university, www.alice.org, (2009) 8