Comments
Description
Transcript
Processing アプリの段階的再コーディングに基づく 初心者用
Processing アプリの段階的再コーディングに基づく 初心者用プログラミング教材の開発 B4 堅田耀介 １. 研究背景 学生にかかる負荷が大きいと考えたため、 計算理論研究室では、教育支援班とアル 穴埋め問題が採用された。穴埋め問題のメ ゴリズム班に分かれている。明治大学の情 リットはいくつかの要素が組み合わさった 報科学科では C 言語の基礎を学んでもらう 複合問題、例えば for 文の要素や if 文の要 ために MAX/C というプログラミング学習 素が混ざっている問題では順序を隔てて考 用 e-Learning システムがある。 えることができるため、学生が着実に理解 このシステムではすべての学生に同じ問題 していくことが可能である。 を同じ順序で出題しているため、学生の理 2.3 トレース問題 解度のばらつきにより、理解が進まない学 トレース問題では、プログラムを読ませ 生や、その逆のもっとレベルの高い問題を て、出力結果や変数の値をトレースさせる。 解かせるべき学生がいる。 if 文における分岐の流れ、 while 文や for そこで教育支援班では、学生の能力をモデ 文のループの動きを確かめることができる。 ル化し、そのモデルに応じて学生に適した 3. 春学期での研究内容のまとめ 問題を出題する MILES/Java という java 春学期ではシステムの開発での役割が明 学習用 e-Learning システムの開発をして 確に定まっていなかったので、システムの いる。 開発に向けて自身の知識の向上に努めた。 2. MILES/Java とは 主に学習した言語は PHP という言語であ MILES から出題される問題は主に三つ る。これは動的に HTML データを生成する に形式に分類される。 ことによって、動的なウェブページを実現 1. 知識確認問題 することを主な目的としたプログラミング 2. 穴埋め問題 言語、およびその言語処理系である。一般 3. トレース問題 的には PHP と省略して用いられており、こ 以下、それぞれの概要の説明を行う。 れは「個人的なホームページ」を意味する 2.1 知識確認問題 英語の 知識確認問題では C 言語における基礎的 な知識を選択形式で回答を促す。 2.2 穴埋め問題 穴埋め問題では、一部が隠されたプログ "Personal Home Page" に由来 する。 4. 秋学期での研究内容 秋学期では UWM システムの開発に取り 組んだ。UWM とは Unitwise Molting の ラムを学生に記述させる問題である。 略のことで、 java の学習システムの一つで、 MAX/C では穴埋めという形式ではなく最 段階的に学習者にコーディングというシス 初から全部書かせる問題が多く、それでは テムである。以下 UWM の一連の構想を説 明する。 習が捗り、理解を促進しやすいのではない ・Processing および Android 等のアプリで かと考えたからである。また Processing を のゲームもしくは他のコンテンツで動作を 言語として選んだ理由は他の言語より比較 行うプログラムを用意する。 的描画に優れた言語であるので学習者が視 ・学習者にはそのコンテンツをメソッド毎 覚効果を得やすいと考えたからである。 に記述させる。順序を追って理解しやすく 4.1.2 作成した Processing アプリ するためである。 弱 神経衰 ・学習者に結果をフィードバックできるよ うな単体テストを実装する。 ・学習者が誤ったコードを提出した場合、 それを組み込んだ場合のアプリケーション を実行することができその誤ったコードで の動きを確認することができる。 ・学習者がフィードバックや誤ったアプリ 図 1 スタート画面 ケーションの動作を目で確認することでプ ログラムを修正しながら完成に近づいてい く。 ・学習が終了すれば視覚効果と意味のある 動作を確認できるので今後のプログラミン グの学習において取組意欲の向上につなが るということを意図している。 図 2 ゲーム画面 4.1 UWM における Processing アプリケー ションによる教材の開発 UWM に お け る コ ン テ ン ツ で 私 は Processing でゲームの開発をすることにし た。ゲームのコンテンツを選んだ理由とし ては、ゲームは可視化して動きを把握しや すいという点がある。またゲーム性のある 図 3 結果画面 プログラムは学生にとって興味を持ちやす いという理由もある。またこれからプログ ラミングを学ぶ未経験の学習者にとって学 図１は神経衰弱のスタート画面のスクリー ンショットであり、初期状態である。初期 状態ではプレイヤーの人数を選択でき、 最 大 4 人でプレイすることが可能である。図 ２はゲーム画面である。ここではイメージ 画像を使用し、描画を行っている。 図３は結果画面を表している。ゲームが終 了したときに一番得点が高い人とその得点 表示している。 4.2 Junit による単体テストの記述 単体テストとはプログラム全体ではなく テスト対象となる 1 つクラスやメソッドに 対して各々メソッドを用意し仕様書通りの 図 4 変数の説明 動作を確認するためのテストである。 また、JUnit とは java プログラムの単体 テストを自動化するためのフレームワーク のことである。 UWM における開発を進めるにあたりこ こでの単体テストの意味合いは学習者が書 いたコードに対して正しいフィードバック をするためである。 4.3 HTML による問題文の記述 学習者が各メソッドを実装するための学 習ページを HTML で作成した。 図 5 メソッドの説明 4.4 UWM としての実行例 UWM として学習者に向けて開発したシ ステムの実行例を挙げる。 学習者が学ぶためにはメソッド名だけで はどのように実装すればよいかわからない ため、各変数の説明や用意したメソッドの 一部の説明をそれぞれ記述した。 図 6 メソッド実装のする際のページの一部 図 6 より”実装する”というボタンを学習者 が押すと内部のメソッドを記述させる画面 に移行する。 図 9 誤ったコードでのアプリケーション実 行画面 図 9 にあるように間違ったコードで提出し 図 7 メソッド記述例 た場合でもこのようにアプリケーションを 今回は図 7 におけるメソッドの記述例を実 起動することができる。正しいプログラム 行例として取り上げる。本来返すべき値と の場合は図 2 ゲーム画面のようになってい は違う値を代入してある。このまま”提出” ないといけないはずだが図 9 ではそうなっ ボタンを押すと次のフィードバック画面が ていないことが明確に分かる。 表示される。 4.4.1 UWM の効果に対する考察 実行例でも示したように UWM の効果に よるフィードバックは視覚化されていて間 違いがわかりやすく、個々で段階的に学習 図 8 学習者に対するフィードバック画面 このフィードバックより本来返すべき値と 学習者の返した値を比較することができる。 また”置き換え結果のダウンロード”ボタン より誤ったコードを書いてしまった場合で も実行してアプリケーションの動作を確認 することができる。 できる環境ではないかと考える。またゲー ム性や意味のある動作からより取り組む意 欲がより増すのではないかと考える。 しかしまだ完璧なシステムが完成した訳 ではない。テストケースの量を増やし、テ ストするメソッドの数も増やさなければな らない。実際に使ってみて学習者が意図し た通りに感じるかわからないので実用化さ れてからもシステムの調整等が必要になる に違いない。 4.5 秋学期での研究内容のまとめ 決して順調に研究が進んだわけではない が最後まで研究を終わらせることができて 達成感を得ることができた。また触れたこ とのない言語の学習や教材をつくるという ことで学習者側ではない私自身の知識の向 上にも繋がったと思われる。 5. 全体を通してのまとめ 春学期では研究内容が明確に定まらず、 他のプログラミング言語を学習していたが それは秋学期において HTML を扱う部分 などで効果的であった。 今後この研究内容が UWM の学習システ ムの一部として実用化されることに期待し たい。 参考文献 1) PHP: Hypertext Preprocessor – Wikipediahttp://ja.wikipedia.org/wiki/P HP:_Hypertext_Preprocessor 2) TECHSCORE 単体テストと JUnit http://www.techscore.com/tech/Java/Ot hers/JUnit/1/