スマートフォン，タッチタブレットを活用した教育の情報化
青山学院大学社会情報学部 伊藤一成1. 目的，研究の方法
近年，モバイルラーニングの研究が再燃している．その理由の一つにiデバイス(iPhone, iPad)の登場がある．筆者の所属する学部は，2009年5月全国に先駆けて学生および教員全員にスマートフォンを配布した[1][2]．従前の電子端末にはない機能性により,教育の場にもこのようなスマートフォンやタブレットが浸透するのも時間の問題となってきた．
MM総研の報告によると2015年には約5千万人がスマートフォンを所有するという報告がある．また2011年度より名古屋文理大学，武蔵野学院大学，大谷大学などで大規模なタブレットの教育利活用も予定されている．従前からある利活用事例ではなく，来たるモバイルネット社会を見据えた情報教育の指針を目指す．
特に今回は以下の2点について集中的に研究開発する．
第1にオープンスタンダードなWebコンテンツ技術についてスマートフォンやタブレット上での利活用を学ぶための授業実践である．今回はプレゼンテーションコンテンツをテーマとする．またそれを応用して，スマートフォンをクリッカー端末として利用した新しいプレゼンテーションシステムを開発する．近年学生の理解調査や質問など対話的に授業を進めるのに役立つ．学生側端末となるスマートフォン上では，教員が提示したコンテンツと全く同一のURLを参照しているにもかかわらず，スタイルシートの適用により，デバイスの特性に合わせてそれぞれ最適な形式で表示される．さらに手書き認識によるジェスチャーを送出できるようにする．
第2にスマートフォンを活用したプログラミング教育について研究する．
初学者に対するプログラミング教育でC言語やJava言語などが広く用いられているが，言語仕様とロジック/アルゴリズムの両者を同時並行で学ぶ必要性があるため，少なくない学生が挫折してしまうことはよく知られている．そこでビジュアルプログラミングScratchを導入する．特にスマートフォンを導入した授業を実際に実践し，のちに高級言語を学習する学生をターゲットにした授業コンテンツなどを作成する．また，これらの取り組みの成果はインターネット上での公開はもちろんのこと，各種セミナーや招待講演，学会発表により広く周知する．
2. 実施した研究内容
1) インタラクティブ性を高めた授業を支援するためのシステムの実装
これまで開発されてきたクリッカーや専用アプリケーションは，システム構築のコストの問題や，利用可能なモバイル端末の制限，PCの種別制約などがあり，気軽に運用できないという問題点がある[3][4]．そこでオープンスタンダードなWeb技術を基軸するのが望ましいと考え，HTML Slidyをベースに構築することとした．HTML SlidyはW3Cで開発されたスライドコンテンツ及び関連ツールの総称である[5]．コンテンツはHTMLで記述する．スタイルシートの適用により，スライド一枚分の表示となる．またキーボードやマウスクリックなどのイベント処理はJavaScriptで実装されている．これによりスライドを切り替えられる．
文字装飾，配置，箇条書き，表，メディアファイルの埋め込みなどはHTMLの記法がそのまま適用されるので，通常のホームページ作成ソフトやエディタで簡単に編集することができる． スマートフォンはPCブラウザとほぼ等価の機能を有するレンダリングエンジンを搭載したブラウザを搭載している．学生側端末であるスマートフォン側は，指を使って簡単に画面をスクロールできるので，スライドとしてではなく単なる縦長のホームページとして表示した方が望ましい．
JavaScriptを用いてUserAgentを自動判定し，適用スタイルシートを変更することで，デバイスに応じた表示形式にできる．また端末側で非同期に通信を行う必要が生じるが，これもJavaScript(Ajax)で実現可能である．
これらの技術を用いて，教員も学生も全く同一のホームページにアクセスするだけの非常に単純な仕組みのクリッカーシステムを実現できる． 教員側画面はHTML Slidyのスライド表示形式が基本となる．図１にスクリーンショットを示す．正面の教示用スクリーンの下部に学生群からのジェスチャー送信結果が実際の授業資料に融合された形式でリアルタイムに表示される．
図1 PC上での画面提示
次に受講者のジェスチャー送出手順を図２に示す．
図２ 受講者のジェスチャー送出手順
通常は資料を閲覧する資料閲覧モードであるが，左下にあるボタンを押すことで，ジェスチャー入力モードに遷移する．そこでタッチパネルに，文字を指で書くことで自分の意見を送出できる．現在送出可能な文字は 「A」，「B」，「C」，「D」，「○」，「×」，「？」，「！」の8種類である．文字の大きさ，書き順，書く方向が異なっても認識されるようになっている．
よって例えば，発表資料の中に4択の設問を記述して「A」から「D」で解答させたり，授業中アドリブで設問を口頭で投げかけることができる．簡単な呼びかけには「○」や「×」をタッチパネル上に書いて反応を返したりもできる．また学生は授業中に分からないことがあればいつでも「？」を，驚いたことには「！」を送信することで，教員は自分の説明が学生にどのように理解されているか知ることができる．またジェスチャー入力モードに遷移する前に範囲選択が可能なので，わからない部分や驚いた部分を指定することも可能である．
受講者群から送出されたジェスチャー情報は，XML形式でファイルに逐次書き込まれる． 一方PC上で提示したHTMLに埋め込まれたJavaScriptの非同期通信機能を使って，定期的にそのXMLデータを読み込み解析する．これにより送った反応は即座に発表者の画面上に反映される．ちなみに，同一IPからの連続送出は最新の一つのみをカウントするので，特定の端末からのジェスチャーが重複するのを防いでいる．あらかじめ特定のアンケート項目を設定しておくことも可能である．学生は，右下のアイコンをクリックすると個々のアンケート項目に手書きで解答できる．
あくまで作成すべき授業コンテンツはHTMLファイル一つに過ぎず，初心者でも簡単に作成できるのが最大の長所である． さらに学生は資料の任意部分や参考ホームページなどを閲覧しながらジェスチャーを送出可能なのも本システムならではの機能である． またiPhoneに限らずAndroid端末，iPad，PCなど多種多様なクライアントを想定する運用が可能である．
2)プログラミング教育を支援するための試み
通常システム開発の現場では，開発環境を表示するモニタ，同時にAPIを参照するモニタといった具合に複数モニタが利用される．一方大学のPC実習室では，学生に複数のモニタが提供されている環境は珍しい．限られた表示領域でPDFやPowerPointの講義資料と切り替えながら作業するのは簡単ではない．そこでScratch[6][7]の授業では，スマートフォンを教示デバイスとして利用することとした．図4に示す様々なコンテンツが学習者の進捗に応じて閲覧できる．同時に，PCは常に開発環境を全画面で占有できる．インプット作業はすべてスマートフォン，アウトプット作業はすべてPCに分離される（図3参照）．
図３ 演習の様子
PPT資料(図4の(1)),LMS上での問題提示(図4の(2))，画像表示(図4の(3))，課題実行例を動画で表示(図4の(4))などはスマートフォンの標準機能で問題なく表示できる．Scratchは，iPhone/iPad上でプログラムが動作するアプリケーションが開発されているので(図4の(5)(6))（2010年7月時点では公開中止中），学生は授業で作成したプログラムをそのままiPhone上で携帯できる．2010年度前期は，様々なキャリアのスマートフォンやタブレット上などで運用でき，またデバイスに最適表示されるWebコンテンツベースが今後運用形態の主流になることを見越して，HTML Slidy[5]を独自にカスタマイズした形式での教材作成も行なった (図4の(7)(8))．HTML5形式での授業コンテンツ作成は，クリッカーとの融合[8]や他のウェブサービスの組み込み，電子書籍などの応用を視野に入れている．
図４ 作成した授業コンテンツの例
結局，次の3種類の授業でScratchを利用した．第一に，一年生全員(220名)を対象にしたオムニバス授業での「プログラミング体験授業」(90分)である．大学入学者の多くは，プログラミングは専門的技能であり，自分には無理だという印象を持っているようである．入学後できるだけ早い段階でこの誤解だけは払拭しておきたかったからである．こういう啓蒙目的の場合，教員より外部の専門家にお願いするのが良い．そこで国内でScratch普及活動の第一人者である阿部和広氏に授業をお願いした．また他教員の利用や，普及活動の担い手となる人材を養成する意味で，その授業を収録し教授用資料とともに公開させていただくことにした．
第二に，一年生のゼミ生（12名）を対象にした「プレゼンテーション技法を学ぶ授業」である．授業の目的は，プレゼン資料の作成方法の習得と学生に対するプレゼン指導にある．発表テーマを「自作プログラムの紹介」とすることで，Scratchによるプログラミングを組み込んだ． Scratchはもともと児童や生徒のアイデアを具現化するための支援ツールとして開発されており，その主旨に則った実習を展開したかったからである．前章で記載したプログラミング技法を習得する授業は，本来の主旨とは異なる活用方法といえる．よってこの授業ではプログラミング技法やScratchの使い方については特段教えない．それでも学生は試行錯誤を繰り返しながら，最終的に自らのアイデアに基づいてなんらかのプログラムを実装してしまうのである．
各自の最終プレゼンでは背景，目的から，実装したプログラムの紹介，操作説明， Scratchプログラムの実行，プログラムソースの説明，考察を発表する．Scratchのプログラムと発表資料とを同時並行で作成させることにより，手段と目的を明確に区別させる．また単にプログラムを実装するだけでなく，それに関するドキュメント類作成やプレゼンテーションも必要であることを認識させる．
第三に「学生講師によるScratchワークショップ」を開催した．相模原・町田大学地域コンソーシアム主催で募集をかけた結果，小学生20人の参加があった．講師は， Scratch授業の受講生である．「プログラミング体験授業」で収録した教授用映像を提供しただけで，構成はすべて任せる形式とした．
3)普及活動
広く本成果を周知するために，以下のセミナーで講演を行った．
3. 結果（自己評価，反省点を含む）
インタラクティブ性を高めた授業を支援するためのシステムについては，ジェスチャーの実装や累計の結果表示は完成できた．模擬的な授業での利用と異なり，常時利用しているスマートフォンを利用する場合， 時系列にジェスチャーの結果を表示する部分については実装やその評価はできなかったので，次年度以降の課題となった．
Scratchでは，教材等の提示にいずれの方式が良いかという内容のアンケートを最終の授業中に実施した．結果スマートフォンが12人(52%)，PCが3人(13%)，紙媒体が8人(35%)となった．厳密な評価にはなお一層の検討を要するが，スマートフォンをセカンドモニタとして使う方式はおおむね評価が高いと考えている．講座自体は大成功で非常に高い評価を受けた．最後に，学生たちが授業で作成したプログラムを小学生達に紹介し遊んでもらいコメントをもらった．これは履修学生のモチベーション喚起になる．Scratchを用いることで，世代を超えた技能や知識の伝承や，社会貢献にも学生が主体的に関与できるのは素晴らしいと思う．今後も学生講師の育成や児童，生徒への普及活動を積極的に進めていく．
4. シラバス，授業計画，教材，資料，授業記録
すべてインターネット上に公開している．以下を参照されたい．
5. 授業の写真やビデオ
参考文献
