Ｗｅｂ上で利用できるインタラクティブな学習支援システムの開発とその活用ー考えを共有し、学びを深める算数科の授業ー
山陽小野田市立須恵小学校
１

教諭

藤本 満士

研究の意図
(1) ＩＣＴ活用の現状
メディア教育開発センター（現放送大学ＩＣＴ活用・遠隔教育センター）が実施した「ＩＣＴを活用した授業の効果等の調査報告」（平成20年３月）によると、全国400余のＩＣＴを活用した検証授業の結果から「明らかに学力向上が認められ、また児童･生徒の学習意欲、興味・関心の向上も証明された」と報告されている。また、学校のＩＣＴ環境の整備により、教師の校務での利用率は年々増加しているが、授業での活用率は伸び悩んでいる現状も指摘されている。
(2) 算数科授業におけるＩＣＴ活用
さらに文部科学省による平成21年度全国学力・学習状況調査では、算数科において「情報を整理選択し、筋道を立てて考え、示された判断が正しい理由を記述することに課題がある」＊１ことが指摘されている。これらを踏まえ、指導改善のポイントとして「必要な情報を整理したり、選択したりして、判断の正しさを説明する活動の充実」＊１や「他者の解決方法を基に、見方を変えて新しい解決方法を考え、説明する活動の充実」＊１に着目し、ＩＣＴを効果的に活用するための実践の場として、算数科の授業を設定した。
指導改善のポイントである「説明する活動の充実」のためには、児童相互のコミュニケーションを活性化させるための支援と、児童が実感を伴った理解をするための支援が必要であると考えた。そこで、コミュニケーションに関する支援は、Ｗｅｂ上でＩＣＴを活用することにより可能であると考えた。また、実感を伴った理解をするための支援は、児童が教材を自由に操作できるインタラクティブなシステムを開発することで、可能になると考えた。
(3) 研究の仮説
本研究では以下の仮説の基に、ＩＣＴ活用による、算数科の学びを深める授業を実現すること を ね ら い と し 、 Ｗ ｅ ｂ 上 で 利 用 で き る イ ン タ ラ ク テ ィ ブ な 学 習 支 援 シ ス テ ム ＷＩＳ３
（Web-based Interactive Study Support System）「以下、ＷＩＳ３と表記」の開発と授業実践による有効性の検証を行った。
研究仮説「Ｗｅｂ上で利用できるインタラクティブな学習支援システムを開発し、児童の学びを支援することにより、効果的に児童の思考力を高めることができる」

２

研究の内容
(1) ＷＩＳ３開発の方針
ア 学習場面に応じて利用できる汎用性
全国学力・学習状況調査における算数科の課題を解決するために、ＩＣＴを活用した以下の四つの場面で学習支援を行い、児童の思考力を高めることとした（図１）。
①教師の効果的な教材提示により、学習課題を把握する場面【課題をつかむ場面】

51

教師が効果的な教材提示を行うことで、児童の課題意識や学習意欲を喚起することができる。また、教材を児童に操作させることで、解決方法に気付きやすくする効果も期待できる。
②教材を自由に操作し、試行錯誤しながら問題を考える場面【考える場面】
児童の理解や思考は、具体物の操作等、体験的活動を行った方が深まると考えられる。
今までの教育用ソフトウエアは、あらかじめ用意された方法や解答に沿った型通りの学習を進めるものが多かった。児童が自由に教材を操作できるシステムを用いることで、児童の思考力を高めることができる。
③操作履歴を見て、考えを確かめる場面【確かめる場面】
児童は考えたことをノートなどに記録しておかないと忘れてしまいがちである。学習履
歴を簡単に保存することができれば、児童は自らの考えを振り返って評価し、発表のときにも役立てることができる。
④学習情報を提示し合うことで考えを共有し、課題の解決を図る場面【伝え合う場面】
ネットワークを利用した意見交換や発表を行い、互いの情報の共有化を図っていくことで、児童の思考力を高めることができる。
イ ネットワーク上で利用できることの利便性
振り返る
課題を把握する

考える確かめる共有

新たな気付き全体に広げる

教材の提示

自由な操作

図１

学習情報の学習情報の保存

再利用

思
考力が高
まる

ＩＣＴにより児童の思考力を高める手だて

現在、急速な技術革新に伴い、学校におけるネットワーク環境の整備が進んでいる。このため、教室内のネットワークでＩＣＴ機器を結び、授業で活用することが簡単にできるようになってきた。しかし、ネットワークを活用できる学習支援システムはまだ尐なく、ＩＣＴ機器を効果的に授業に生かすことが難しい。そこで、ネットワークを利用した教育的効果の高い学習支援システムの開発が急務となっている。
ネットワークを利用した学習支援システムの利点としては、まず、ネットワークを通じて文字情報や数値、画像、映像等の再利用が可能であることがあげられる。これにより、教師が教材提示したものを、そのまま児童が思考ツールとして使うことが可能となる。
次に、データを双方向にやり取りすることにより、情報を活用した共同学習が円滑に進むことがあげられる。たとえば、グループに分かれて同じ課題に取り組むときには、同一の学52

習情報を提示・操作・保存・再利用することで、学習情報の共有を図ることができるため、課題解決のための方法を身に付けることが容易になると考える。児童の意識を大切にし、思考力や表現力を高めるための支援を行うためには、このようにネットワークを利用した学習支援システムを活用することが、非常に効果的であるといえよう。
以上のことから、この一連の学習過程を効果的に支援することができる汎用性をもったネットワーク上で利用可能な学習支援システムであるＷＩＳ３を開発することとした。
(2) 開発の概要
ア 開発の流れＩＣＴを利用した算数科授業の可能性を分析し、授業でのＩＣＴ活用の在り方と効果的な学習教材ICTを利用した算数科での授業の選定を行った。次に、算数科の学びを深めるた
めのＷＩＳ３の開発を始めた（図２）。（詳細は、•システム構成•提示・操作の機能

ＷＩＳ３の開発①【資料】を参照）
まず最初に、Ｗｅｂ上で提示・操作できる機能

授業実践
１を開発した。そこで、教師による教材提示場面と児童の説明場面を支援するため、第５学年算数科

ＷＩＳ３の開発②において授業実践を行い、その機能を検証した。
次に、児童や教師からのアンケート等による評した。ここで、すべての機能を実装したＷＩＳ３•第４学年「角の利用」（提示）（操作）（保存）（再利用）•アンケート、研究協議会•評価による改善•ＷＩＳ３の完成•サーバの構築

ＷＩＳ３の開発③の教育的効果を検証するために、第４学年算数科•第５学年算数科「変わり方のきまり」（提示）（操作）•アンケート、研究協議会•評価による改善•保存、再利用の機能を追加

授業実践
２

価を基に、学習情報の保存・再利用の機能を追加•ＩＣＴ活用の在り方•学習教材の選定において授業実践を行った。授業後には、児童や教師の評価を分析し、機能の充実を図った。また、

図２

開発の流れサーバ等を構築し多くの教師が使える環境も整えた。
イ ＷＩＳ３の特長(ｱ) Ｗｅｂ上での利用
ＷＩＳ３は、インターネットを介して使用する。Ｗｅｂブラウザさえあれば、サーバにアクセスすることで、ＷＩＳ３を使うことができる。個々のコンピュータに特別なソフトウエアを必要としないクラウドコ
ンピューティングシステム（図３）である。
(ｲ) インタラクティブなシステム
従来のＷｅｂページでは、画面上の画像

図３

クラウドコンピューティングシステムや文章、図形等を閲覧者が自由に変更することはできなかった。しかし、最近のＷｅｂア
プリケーションの技術の向上により、Ｗｅｂブラウザ上で絵や文字、図形等を自由に動かしたり、編集したりすることができるようになった。
ＷＩＳ３は、この技術を生かし、Ｗｅｂブラウザ上での編集を可能とし、サーバとデータをやり取りできる双方向的な仕組みを備えたシステムである。授業においてはその仕組

53

みを利用して、教材を自由に操作することができるインタラクティブなシステムとして活用が可能である。
(ｳ) 学習履歴の保存
Ｗｅｂ上で作成した教材や操作した履歴をＷＩＳ３に保存できるようにすることで、利用者が作成した学習教材を再利用したり、操作を再現したりすることが可能となる。
(ｴ) 学習情報を保存するためのデータベース
図４は、学習情報の一覧画面である。使いたい情報を選択し、操作画面上にデータを呼び出すことができるとともに、表示されたデータの修正・加除を行うこともできる。
さらに、実際の授業で使った教材をこの一覧表に保存できるので、全国の教師が作った教図４

学習情報一覧

材の保存・共有・情報交換が可能となり、ＷＩＳ ３の活用により汎用性のある教材を豊富に蓄積することが可能である。
(ｵ) 自由に図や文字が動かせる操作画面
操作画面（図５）では、以下に示すようにＷｅｂ画面上で学習教材を表示・移動・作成・加工・保存する等、様々な操作を行うことができる。
・戻るボタンには、記録された操作履歴を再現する機能がある。
・進むボタンには、履歴から最新の画面に戻る機能がある。
・開くボタンには、一覧表で選択された教材を呼び出す機能がある。呼び出されたデータは、画面上で自由に動かしたり、拡大縮小、コピー等をしたりすることができる。さらに、画面上で行った操作はすべて記録される。
・保存ボタンには、画面上で描いた情報をデータベースに保存し、一覧表に自動的に表示する機能がある。

図５

操作画面

以上の機能の他にも、この画面上に画像を張ったり、文字や絵をかいたりして、新しい教材を作成することもできる。
また、ＷＩＳ３の操作画面は、ホームページ作成ソフトを用いて、利用者のニーズに合うように簡単にデザインを変更することができる。画面上の素材と機能をリンクさせることにより、低学年用や高学年用といった様々な用途に沿った操作画面を作成できる。
54

(3) ＷＩＳ３を活用した授業実践による検証
ア 授業実践１（第５学年算数科「変わり方のきまり」）(ｱ) ＷＩＳ３を活用した場面
本時の学習では、ＷＩＳ３を利用することにより、児童の課題把握を容易にするとともに、気付きを伝え合うことによって、児童が実際にＷｅｂ上で図形を動かし、数量の変化に関する理解を深めることができると考えた。
そこで本時では、ＷＩＳ３を使った以下の活用場面を設定し、算数科の授業実践の中で効果を検証することとした。
・【課題をつかむ場面】…教師の効果的な教材提示により、学習課題を把握する。
・【伝え合う場面】…学習情報を提示し合うことで考えを共有し、課題の解決を図る。
(ｲ) 本時の展開
単元名

変わり方のきまり
棒を並べて正方形を作るときの、棒の数と正方形の数の変化の規則性を本時のねらい調べる活動を通して、数量関係を見付け、問題を解くことができる
ＷＩＳ３

準備物

コンピュータ

掲示する表

電子黒板

ワークシートプロジェクタ

数字カード

展
学習活動・内容

開教師の支援と留意点

・正方形の数の変化に伴い、棒の本数が変わっていく様子
ＷＩＳ３でをとらえられるようにＷＩＳ３を用いる。

【課題をつかむ場面】

１

問題場面について話し合う。

め、順次その数を増やして提示する。

棒の本数は全部でいくつ？

２・課題把握を容易にするために、正方形一つの場合から始正方形が五つつながったとき ・伴って変わる二つの数量の関係がとらえられるように、の棒の本数を考える。

ノートに図と表をかき、整理するように促す。

正方形の数

１２３４

棒の本数

４７101333５3

・正方形の数が１増えると、棒の・きまりを見付ける手掛かりに気付かせるために、表を用いて正方形の数が四つの場合までをたずねる。
・変化のきまりを見付け出せない児童には、棒の本数の増え方に着目するよう助言する。
評変化の様子を表に整理して、きまりを見付けることがで本数は３増えるきる。（思考・判断）
ＷＩＳ３で【伝え合う場面】

３

正方形の数が五つのとき、棒の ・考えを整理し、根拠を明確にするためにグループでの話本数が16本になる理由を図や表から考え、発表する。

・児童が自分の考えをみんなに分かりやすく説明するために、ＷＩＳ３を利用する。

（予想される考え）
４＋３×４=16合い活動を仕組む。

１＋３×５＝16

・多様な意見を引き出すために、図による具体的な操作と式を関係づけて児童の意見を取り上げる。

55

４×５－４＝16

４

５×２＋６＝16

正方形の数を954個に増やして ・正方形の数と棒の数の関係に着目させるため、ことばにも簡単に求めることができる方よる式を考えるように促す。

法ついて話し合う。
・１＋３×正方形の数＝本数

評図や表やことばの式等を用いて、問題を解くことができる。(表現・処理)

５

活動を振り返る。

・次時の学習につなげるために表に整理して調べると、きまりが見付かり、変化の様子が分かりやすいことを押さえる。

(ｳ) 本時におけるＷＩＳ３の効果
課題をつかむ場面では、棒の本数が変化する様子をＷＩＳ３の画面の上で教材を動かしながら提示した。そのため、児童は短時間で課題を把握し、問題に取り組むことができた。
このことより、きまりについて考える時間を十分確保することができ、児童の思考を深めることにつながった。
さらに、伝え合う場面（図６）では、児童は見付けたきまりをＷＩＳ３を操作しながら順序立てて説明をすることができた。きまり

図６

順序立てて説明する様子の根拠を表や式だけでなく、棒の数が増えていく様子をＷＩＳ３で示しながら説明したので、他の児童も理解を深めることができた。
授業後の研究協議会では、「図形の特徴や変わり方が一目瞭然でわかってよい」、「操作することが楽しく、今の子どものニーズに合っている」といった意見が出た一方、「使い方に慣れるまでに時間が掛かりそう」、「だれでも簡単に操作できるとよい」といった感想を得た。ＷＩＳ３のもつ学習効果について一定の評価を受けると同時に、その後のシステムの改善の方向を確認することができた。
イ 授業実践２（第４学年算数科「角の利用」）(ｱ) ＷＩＳ３を活用した場面
本単元では、一組の三角定規を組み合わせてできる様々な大きさの角を作る活動を容易に行わせることをねらってＷＩＳ３を使用した。
そこで本時では、ＷＩＳ３を使った以下の活用場面を設定し、算数科の授業実践の中で効果を検証することとした。
・【課題をつかむ場面】…児童の課題把握を容易にするために動的な課題提示を行う。
・【考える場面】…課題解決のために、図形を試行錯誤しながら自由に操作する。
・【確かめる場面】…学習履歴を再現し、比較することで自分の考えを確かめる。
・【伝え合う場面】…学習情報を提示し、互いの考えを伝え合う。
56

(ｲ) 本時の展開
単元名

角の利用

―三角定規でできる角―

一組の三角定規を組み合わせていろいろな大きさの角を作り、その角の大きさを加法や減法で求めることができる。
ＷＩＳ３システム（サーバ１台） プロジェクタ 電子黒板 掲示資料
（三角定規の図、魚の図、画用紙） ノート型コンピュータ（10 台）

本時のねらい準備物

展
学習活動・内容

開教師の支援と評価

・いろいろな大きさの角を作ることができることに気付かせるために、一組の三角定規の角１ 黒板に提示した魚の口の大きさ（角）を足し合わせて、魚の口の角度（75°）を求を三角定規の角を使って調べることがめる方法を尋ねる。
できないか考える。
・一組の三角定規の角を重ね合わせても、角を・三角定規の角の確認作ることができることに気付かせるために、口の角度（15°）が魚の絵がかいてある一組足し合わせるの色板を児童一人ひとりに持たせる。
・三角定規の当て方がよく分かるように、児童が行う当て方に名前を付けるように促す。
（くっつけ方式、かさね方式等）
重ね合わせる・操作の方法を理解させるために、ＷＩＳ ３ を使って色板の動きを示す。
評三角定規を組み合わせて、いろいろな角を作ろうとしている。（関心・意欲）
３

ＷＩＳ で

【課題をつかむ場面】？

？

三角定規を組み合わせていろいろな大きさの角をつくろう
ＷＩＳ３で【考える場面】

２

一組の三角定規を組み合わせていろいろな角を作り、ノートに記録する。
合わせてできた角

60＋45＝105°

90＋90＝180°

30＋90＝120°

60＋90＝150°

30＋45＝75° 90＋45＝135°・角を足し合わせたり重ね合わせたりする様子が分かりやすいように、２種類の三角形（三角定規一組）を異なった色で提示する。
・グループで協力してなるべくたくさんの種類の角を作るように促す。
・三角定規で作った角の図とともに考え方（式と答え）がノートに書かれているか確認する。
評一組の三角定規を使って、いろいろな角を作ることができる。（表現・処理）

重ねてできた角90―45＝45°

90―30＝60° 45―30＝15° 90―60＝30° 60―45＝15°

ＷＩＳ３で【確かめる場面】

互いの考えを確かめながら考えを整理 ・児童が考えをまとめることができるようにするために、コンピュータの画面の上でＷＩＳ３するために、グループごとに話し合う。
を動かしながら説明させる。
・同じ角度の組合せをまとめる。
・児童が作った様々な角を後で検討できるようにＷＩＳ３の保存機能を使って残しておく。

３57

ＷＩＳ３で【伝え合う場面】

４

組み合わせてできた大きさの角を操作で確かめながら発表する。
・組合せ方の分類

５・グループで考えたことを学級全体で検討するために各グループの話合いの結果を電子黒板上に提示する。
・角の作り方が理解しやすいようにＷＩＳ ３ を使って図形を動かしながら説明させる。
・組合せ方の違いを理解しやすくするために、和の考え方、差の考え方に分けて取り上げる。
評三角定規で組み合わせて、角の大きさを和や差として考えることができる。（思考・判断）・学習内容の定着を図るために、角の大きさを加法や減法で求めることができる ことを確認する。

学習のまとめをし、振り返る。

(ｳ) 本時におけるＷＩＳ３の効果
課題をつかむ場面では、教師が電子黒板上でＷＩＳ３を使い三角形を動かしながら説明したことで、「次に行う活動がよく分かった」という児童の感想を得た。
また、図７のように透明な部品等を利用し、重なって見えない部分を可視化することにより、児童の意識を三角形を重ね合わせてできる角度に向けさせることができた。
グループでの話合いの場面では、互いの考えを出し

図７

課題提示画面図８

話合いの場面合い、考えをまとめるための道具としてＷＩＳ ３ を使っていた（図８）。見付けた角度や三角形の組合わせ方をＷＩＳ３に保存することで、話合いの内容を呼び出し、学習の振返りを行うことができた。
確かめる場面では、ＷＩＳ３により考えた内容を一覧表示して確認させることで、自分たちと他のグループの気付きを比べて発表することができた。
一覧表（図９）を見て、今まで見付けることができなかった方法に気付き、引き続き課題に取り組む児童もいた。
このように自分たちが考えをＷＩＳ３により振り返ることで、新たな気付きが導き出されていった。
グループの考えを全体の前で発表する場面では、ＷＩＳ３上に表示された色板を動かしながら説明する

図９

一覧表による確認の場面ことができた。発表する児童は、特に見てほしい部分に書き込みを入れたり、色を付けたりして自分たちの考え方を分かりやすく伝えることができた（図10）。
また、電子黒板だけでなく、式をカードに書いて掲示することも同時に行った。このように、ＷＩＳ３の便利なところと黒板等のよさを組み合わせて使うことにより、児童の思考を深めることが可能となった。
58

図 10

全体に発表する場面(4) ＷＩＳ３を活用した授業実践による考察
授業後に、児童と参観した教師にアン児童（174名）

ケートを実施するとともに、ＷＩＳ３を使っ３WIS により授業に積極的に取り組めたた授業について、研究協議会を行った。

興味・関心

ＷＩＳ３を利用することによって、それぞ

WIS３ を使って説明されると分かりやすい知識・理解れの観点でどの程度成果があったかを、「大WIS３ は考えを説明するのに便利だ

変よくできた」、「よくできた」、「いつ表現もと同じ」、「できなかった」の４段階でWIS３ を使うと自分なりの考えが浮かんだ

回答を得た。また、各観点に評価の理由を思考・判断新たにやってみたいことや疑問が出た記述する欄を設けた。
発展

大多数の児童がＷＩＳ３ を使うことにより、よくできたと回答している（図11）。

0%

また、理由の記述欄には「簡単に使えた」、

20%

40%

大変よくできたいつもと同じ「説明するときに便利だった」（表現に関60%

80%100%

よくできたできなかったする評価）や、「もっとＷＩＳ３を使って、図 11考えてみたい」（興味・関心に関する評価）

児童へのアンケート結果という記述が多く見られた。さらに、「他教師（30名）のグループの考えと自分の考えを比べたり、課題に対する興味・関心が高まった興味・関心修正したりすることができた」という思教材提示は効果があった

考・判断や表現に関する記述も見られた。

知識・理解

教師に対するアンケート結果（図12）や自分の考えを表現する手助けになった

授業後の研究協議会では、ＷＩＳ３の有効表現多様な思考を引き出すのに役立った性が確認できた。「インターネットのホー思考・判断ムページを見るように使えるので使いやす新たな課題を見つける手助けになったい」、「教材を動的に動かすことで、児童発展が学習課題をもてた」、「論理的な発表に0%役立った」という意見も出され、ＷＩＳ３

20%40%

大変効果がある
いつもと同じの利便性に関する高い評価も得た。
このようにアンケートを通して、児童や教師がＷＩＳ３の利便性と表現力を実感し

図 12

60%80%

100%

効果がある
悪くなった

教師へのアンケート結果ていることが分かった。
３

まとめと今後の課題(1) 研究のまとめ
教師のＩＣＴ活用を推進し、児童の学びを深める授業づくりを具現化するためにＷＩＳ３を開発してきた。
授業実践１及び授業実践２では、単元やねらいが異なっているが、ＷＩＳ３はいずれの実践でも有効に働いた。児童からは、「図形を思い通りに動かすことができ、うれしかった」、参観した教師からは、「電子黒板やノート型パソコンと併用することで、児童が意欲をもって課題に取り組んでいた」等の感想を得ることができ有用性を検証できた。
59

児童の思考力を高めるためは、ＷＩＳ３による学習支援を効果的に行うことが重要である。
今回の研究では、活用場面を明確にした上で授業実践を行うことにより、ＷＩＳ３の特長を生かした活用を図ることができた。課題提示の場面では、拡大して見せたり言葉で説明しにくいものを図に表して見せたりする等、児童に分かりやすい提示を行うことができた。これにより正しい手順を確実に理解させるだけでなく、課題把握に要する時間も短縮され、考える時間を十分に確保することができた。そして、児童は何度もやり直すことができるというＷＩＳ３の特長を生かし、存分に体験的な学習をすることができた。
ＷＩＳ３を使ったグループ学習の場では、話合いが活性化し、児童の思考の高まりが見られた。児童は、話合いの過程をＷＩＳ３の保存機能を使って振返り、自分たちの意見を集約していた。全体の発表の場においてもＷＩＳ３を用いることで、自分たちの考えを画面に表示させながら論理的に発表することができた。また、聞き手も互いの情報を比べることができたため理解も深まり、新たな気付きも生まれていったようである。これらのことから、児童のコミュニケーション能力の育成にもＷＩＳ３が役立つことが検証された。
ＷＩＳ３を使った授業の公開は、ＩＣＴを活用した授業の教育的効果の大きさを多くの教師に実感してもらう場となっただけでなく、同時にＩＣＴ機器を身近に感じてもらう機会ともなった。さらに、ＩＣＴ教材への関心が高まったことは大きな成果であった。
以上のことからＷＩＳ３を使った授業は、今後のＩＣＴを活用した授業を一層促進するために大きく役立つと考える。
(2) 今後の課題
今回のＷＩＳ３を使った授業実践においては、コンピュータでの操作が難しかったという課題を得た。しかし、児童が電子黒板を使い説明するときは扱いやすかったという評価だった。
これはＷＩＳ３が直感的な操作で機能していることに起因し、直接手で触れて操作できる環境があれば課題は解決すると思われる。そのためには、タッチパネル等を備えた新しいＩＣＴ機器の利用を促進し、より児童が身近で扱いやすいものにしていく必要性を感じた。
また、教師から授業でどのようにＷＩＳ３を使ってよいか分からないという意見もあった。
ＷＩＳ３は、授業で多く使うことにより、学習情報が蓄積され、それが新たな学習教材となる機能をもっている。ＷＩＳ３を様々な教科で使える汎用性の高いものにすれば、より多くの教師に使ってもらい、学習コンテンツも増え、利用の幅も広がるであろう。そのためには、技術革新に対応した機能の追加が必要であると考えている。
今後、ＷＩＳ３をさらに使いやすいシステムにするとともに、合わせて効果的なコンテンツを開発・追加するためにも鋭意努力し研究を継続していきたい。
【備考】
ＷＩＳ３の利用について
ＷＩＳ３は、「やまぐち総合教育支援サイト」内に掲載しており、「先生のページ」からアクセスでき、ＷＩＳ３のもつ機能（自由な操作、教材提供、共有、学習情報の保存）を体験することができる。
さらに、データの保存、修正、加除は、やまぐち総合教育支援センターから配付された学校ＩＤとパスワードにより可能である。（URL:http://shien.ysn21.jp/contents/teacher/shidou/syoukyoutuu.html）

60

【資料 ＷＩＳ３開発についての詳細】
ＷＩＳ３の構成１(1) ＷＩＳ３の基本設計
図13にAjaxを利用したＷＩＳ３の基本設計を示す。

図 13

ＷＩＳ３の基本設計

ＷＩＳ３はアプリケーションとして開発されているので、コンピュータのＯＳや情報機器の違いによって起こる不具合が無く、Ｗｅｂブラウザ上から同様の操作で使用することが可能である簡便さを有している。さらに、Ajaxを利用することにより、一度ホームページを開けば、必要な操作が行われたときだけ非同期で通信することができる。この仕組みを利用することによってネットワークのトラフィックを軽減でき、ネットワーク回線が不安定になりやすい学校現場であっても、安定して動作するシステムが構築できる。

(2) ＷＩＳ３のネットワーク
ＷＩＳ ３はＷｅｂ上で動作し、多くの児童や教師が利用することを想定している（図14）。
また、デスクトップやノート型のコンピュータだけでなく、タブレット型コンピュータや電子黒板等ネットワークにつながっている様々な情報機器で動くことをめざしている。利用者
は、コンピュータのブラウザ上からＷｅｂサーバにアクセスすることによってシステムを利用することができる。
ＷＩＳ ３は、児童の学習情報保護のために、ＦＷ（ファイヤーウォール）の内にサーバを設置している。また、データの送受信については、

図 14

ＷＩＳ３によるネットワーク構成

外部とは接続できないローカルネットワークにデータベースサーバ（ＤＢサーバ）を設置している。さらに、

61

ファイル制御とデータベースに対しては、Ｗｅｂサーバのシステムからしかアクセスできないようにすることで、利用者の安全性を確保するとともにデータの保護を図っている。
ＷＩＳ３の構造２(1) ＷｅｂアプリケーションとしてのＷＩＳ３
ＷＩＳ３は、図15に示されているようにクライアント、アプリケーション、リソースのそれぞれが別のプラットフォーム上で動作する安全性の高いＷｅｂアプリケーションである。
クライアントは、Ｗｅｂブラウザ（Firefox、Google Chrome等）さえあれば、いつでも利用することができる。
注2012年３月以降のリリースが予定されているHTML5準拠の機能を使っているため、Microsoft InternetExplorerでは、ウィジェットがうまく動作しない状況になっている（2011年３月現在）。

データの流れ
図 15

ＷＩＳ３の構造とデータの流れ(2) Closure Drawウィジェットの構成
Ｗｅｂアプリケーションは、基盤にClosure Drawウィジェットを配し、その上に３層モデル（プレゼンテーション層、データストア層、トランザクション層）として構成されている。
Closure Draw は 、 Closure Library を 使 っ た 作 画 ウ ィジェットで、Ｗｅｂアプリケーションに手軽に図形描画機能を組込むことができる。このCloser Drawウィジェット
は、コントロール領域、作図領域、ツールバー領域の三つに分離されており、互いのやり取りは完全に抽象化されて

図 16

Closure Draw の三つの領域いるので、各種機能をHTMLのリンクボタンで実装することが可能である（図16）。この仕組によって、操作性の向上が簡単に図られている。

62

また、作図領域に描かれた文字や図形はすべてＳＶＧデータであり、ＸＭＬやJSON形式で保存できるので、コンピュータのメモリを圧迫することが尐ない。さらに、データベースにデータを書き込む際、ＸＨＲ(XML HttpRequest)というＡＰＩを使って通信することによって、ネットワークに負荷をかけずに行うことができる。
(3) システムの論理構成
上記で述べたClosure Drawを学習支援に適したシステムに拡張するため、３層モデルによるＷｅｂアプリケーションの構築を行った。
プレゼンテーション層では、HTMLとＰＨＰを利用して画面表示を行っている。ここでは、データベースから得たデータを一覧表にして提示したり、利用者が選択したデータをClosure Drawウィジェットに渡したりしている。さらに、ＰＨＰを利用した認証システムにより、教育関係者以外の人が無断でデータベースにアクセスすることができない仕組みになっている。
データストア層では、Closure Drawの作図領域にある文字や図をＳＶＧデータとして保存する。ここでは、ＰＨＰを利用してデータベースに保存したり、呼び出したデータをプレゼンテーション層のプログラムを介して作図領域にデータを渡したりしている。
トランザクション層では、Closure Drawウィジェットに無い操作履歴の保存・再現といったデータ処理を中心に行っている。また、例外処理やエラー処理等も行っている。
リソースは、Ｗｅｂアプリケーションにより保存されたデータをファイヤーウォール内の別のデータベースサーバに保存している。
このようなシステムの論理構成をとることによって、本文で述べた学習支援に必要とされる機能を実現している。

【用語集】
Ajax
サーバと常時通信を行わなくてもホームページだけで動くための仕組み
API
ここではWebAPIを示し、ネットワーク上で動くアプリケーションを開発するにあたって、プログラムの手間を省くために設定された部品集のこと
Closure Library
グーグル（検索）が提供するインターネット上で動作するソフトウエアを作るための部品集
Closure Draw
Closure Libraryを使って作成された描画ウィジェットのためのアプリケーション（伊藤千光氏により2010年１月に作成された）
HTML５
ホームページの書式を決めた言葉で、最新の機能を持ち、2012年３月に本格実施される予定（５は、5番目の改訂という意味）
ICT
情報(information)や通信(communication)に関する技術(technology)の総称
Javascript
ホームページを自由に動かすことができるプログラム言語。ホームページに埋め込むことでページに様々な機能を付加できる
JSON
インターネット上で扱うデータを記述するための形式で、特にJavascriptを利用するときに使い勝手がよい

63

SVG
Scalable Vector Graphics(スケーラブルベクターグラフィックス）の頭文字を取ったもので、文字、図、絵等の情報を図形として拡大縮小できるデータ形式
Webサーバ
ホームページをインターネット上に提供するコンピュータのこと
XHR(XML Http Request)
Webページ上で、サーバとデータ通信を行うための小さなプログラム
XML
インターネット上で扱うデータを記述するための形式
インタラクティブ
人と人、人やコンピュータが互いに情報をやりとりすること
ウィジェットＷｅｂ連携機能があるが、ブラウザとは独立している小アプリケーションのこと
クラウドコンピューティングシステム
個々のコンピュータにソフトウエアをインストールせずに、提供元のソフトウエアをインターネットを通していつでもだれでも自由に利用することができる仕組み
情報セキュリティ
自分の持つ情報を、不当に改変されることなく、見せる必要のある人にはちゃんと見られるようにし、見せた
くない人には見せない、そのための人的・組織的・技術的な対策を講じること
データベースサーバ
様々な情報を集めて管理するコンピュータ
トラフィックネットワーク上を流れる情報量【引用文献】*1：文部科学省、『平成21年度全国学力・学習状況調査報告』、http://www.mext.go.jp/a_menu/shotou/
gakuryoku-chousa/zenkoku/1283378.htm、2009、p12-13【参考文献】
・文部科学省、『ＩＣＴを活用した指導の効果の調査結果について』、http://www.mext.go.jp/b_menu/houdou/19/05/07060706.htm、2007
・文部科学省、『小学校学習指導要領解説算数編』、東洋館出版社、2008

・算数授業IT研究会、『スクールプレゼンターで変わる算数の授業―IT時代の黒板革命』、東洋館出版社、2006
・坪田耕三、『教科書プラス坪田算数4年生』、東洋館出版社、2007
・坪田耕三、『教科書プラス坪田算数5年生』、東洋館出版社、2007
・正木 孝昌、『算数の授業で教えてはいけないこと、教えなくてはいけないこと』、黎明書房、2009
・田中博史、『算数的表現力を育てる授業』、東洋館出版社、2008
・伊藤千光、『Closure Library プログラミングガイド』、インプレスジャパン、2010
・掌田津那乃、『Ajaxライブラリ徹底活用JavaScript Webプログラミング』、秀和システム、2009
・葛西秋雄、『jQuery+JavaScript実践リファレンス』、ソシム、2009
・大津真、『JavaScript&Ajax Lesson Book』、ソシム、2009
・ハーシー、『PHP+MySQL』、毎日コミュニケーションズ、2005

64