ネットワークを利用したインタラクティブなソフトウェア

田 酬 Ｈ Ｈ Ｈ Ｈ Ｈ Ｈ ＝ ︱︱ ︱

ネ ッ トワークを利用 したイ ンタラクティプな ソフ トウェア

榊原

正明 。高見

和邦・堀内

敏史・増原

良子

物質工学科

An httmctive Computtr Somare Progmm u前

_増

_Network

Masaaki ,胞

漱 TAKAMI ttshifumiI‐

_{IORIUCtt Ryoko MASUHARA}

Dcparmcnt OfMtteri』 s S cnce,Faculty ofEn8inecring

Tottori U vcぉitちTottOri,68Cl-8552 Japan

E‐

mlと

sakaki@lclnOn.biooto的

―

u.acjp

AbsttctiThcuscOfIIHP C∞ KIES makesitpottbに Ю distinguish different∞mputcruscぉ .Usinghis systett an hteradive computtrpЮ gtana for qualitativc訂濾lysis expcnlncnts mvolving chcmical rcagcnts was convcrted tom stand alone usc by _{dividual∞mputcrs to Ncmork∽ mputcr}

usc.勁ds∞mputcrproBrm pDvidcs clien偽 h guidancc and a rcoord ofthc quesliOns,phob8raphs and vidcos ofthc cxperimcnts

KeywordsI Edumional∞mputerproglam,Intcradivc,C「ookic,Qualitaliveanalysis expcrimen偽 _,web

1.は

じめ に 全 世界 にイ ンター ネ ッ ト網 が張 り巡 らされ

,あ

らゆ る分野 で の利用 が推進 されて いる。イ ンター ネ ッ トにはスーパ ー コ ン ピュー タ

,ワ

ー クステー シ ョンか らパ ソ コ ンに至 るまで接続 されてお り, 共通 の通信規則 (プロ トコル

)で

ある TCP/1Pで情 報 をや り取 りして いる。現在

,イ

ンター ネ ッ ト上 で通信可能な主な ものに 「FTP」

,「

電子 メール」, 「_Web」

_,な

_{どが ある[1].}

Webの

シスタム は

,1989年

に

,研

_{究者 間で の効} 率的な情報共有 を 目指 して開発 された ものである。

そ の後

,1998年

にGraphicalな User lnterfaceを

持つ ブ ラウザ Mosaicが開発 され る と

,一

気 に普及 して いった[1].

Webに

_{は,次 のような利点がある.① ハイパー}

テキストによってユーザ制御を可能にする.② 視

聴覚

,ア

ニ メー ション等のマルチメデ ィアによる 提示が行なえる。③CGIス クリプ ト等 による双方向 性が可能である

.④

クロスプラッ トフォームであ る

.⑤

_{ファイルの更新 と拡張が容易である}. これ らの利点を生か して Webは ,化 学計算や様々 な実験 のデータベース として

,化

学分野での利用 の試みが進んでいる[2].例 えば

,Web上

で分子の 振動モエ ドや反応の様子 を動画で表示 した り

,ゲ

ノムやタ ンパ ク質の巨大なデー タベースを作成す るといったものである. また

,教

育分野 において も

,い

ろいろな活用が 試み られている

.矢

野 らは学内

LANを

利用 した講 義 システムを試作 した [3].こ れは

,Webシ

ステム を中核 とし

,電

子掲示板および電子 メール システ ムを組み合わせたクライアン ト・サーバ システムで ある

.こ

_{の講義 システムは自然科学学習のための} 補習教育用 に開発 され

,教

育 内容 をテキス トや画 像な どのマルチ メデ ィア教材 として有機的 に組み

86

榊 原正 明・高見和邦・堀 内敏史 ・増原 良子 :ネ ッ トヮークを利用 したイ ンタラクテ イブなソ フ ト ウェア 合わせ て構 成 され て い る。 しか し

_,答

えた 内容 に 対応 して ヒ ン トを表 示 す る, とい ったイ ンタ ラ ク テ ィブな機 能 は持 って いな い. また

_,吉

村 らは

,物

理化 学 実験 の事 前学習 のた め に ビデ オ画像 を導入 し

,CAL教

材 を開発 して個 々 の コ ンピュー タで活用 している[4].特に

,開

発 し た化 学 ビデオ教材 を

HTMLフ

ァイル に変換 して Web 上 の化 学

CAL教

材 に して いる

.教

材 の内容 は 「中 和熱 の測 定」

,「

電池 の起電 力」

,「

電位差滴定」, 「分配率」 の

4つ

で あ る。そ して

,そ

れぞ れ の実 験 の内容(理論 と目的

,実

験装置

,実

験方法

,実

験 結果

,考

察)が 書かかれて いる

.HTMLフ

ァイル の化 学 ビデ オ教 材 を クライ ア ン トと して利用 した場合 は

_,サ

_{ーバ コ ン ピュー タか らの ビデオデー タの取} り込 み に時 間が か か って いるため

,ビ

デ オ の第 一 画 面 のカ ッ ト・ ペー ス トによ る画像 イ メー ジで学 習 を進 めて いる。 教育 へ のマル チ メデ ィア の利用 は

,ま

だ静 的 な ホームペー ジが多 く,イ ンタラクティブ(双方 向性) な ソフ トは十分 に開発 されて いない。今 回は

,Web

上で イ ンタ ラクテ ィブな操作 を実現す るため に, ス タ ン ドア ロンのイ ンタ ラクテ ィブな定性実験 の ソフ ト[5]を用 いて

,様

々な方法 を検討 した。 ここ でイ ンタ ラクテ ィブ とは

,解

答 時 の

,ユ

ーザ の 問 題 に対 す る進 み具合 を判 断 して

,ユ

ーザ を識別 し て ヒ ン トを表示 す る ことを意味 して いる

.間

違 え た場合 に

,す

_{ぐに正解 を表 示す るので はな く}

_,ヒ

ン トを示 す ことによ り

,考

え る機 会 を与 え る こ と が出来 る。 ユ ーザ を識別 す るた め に

,イ

ンター ネ ッ トのオ ン ラ イ ン シ ョ ッ ピ ン グ に利 用 さ れ て い る HTTP C00KIESの使用 を試みた

.ま

た

,ソ

フ トの操作性 を 考 えて

,同

_{一画面 に ヒン トを表示す るため の方法} の検 討 を行 な った。 さ らに動画 を含 む画像 を取 り 入れ て マ ル チ メデ ィア利 用 の試 み を行 な った。 こ の際

,動

画 の表 示 な どによ って学習 を中断す る こ とが な いよ うに

,画

像 再 生 の時 間短 縮 につ いて も 検討 も行 った。

2.ネ

ッ トワー クシステムの構築 CGI等を使用す る とサ ーバ に対す る負荷が大 き く な り

,ま

た

_,共

_{通 に使用 す るサ ーバ で は障 害 が あ} った場合 にそ のサ ーバ を使用 して い る他 のユーザ に迷惑 を及 ぼす ことが あるので。研 究室 内でサー バ を立ち上げ

,ネ

ッ トワー クシステム の構築 を行 なった。 今 回構築 した

,シ

ステムのサーバ は次のよ うな 仕様 となっている. サーバマ シンには NEC PC9821V20を 使用 し

,OS

にはUNIX系 OSで

,パ

ソコン用であるFreeBSD(98)

を使 用 し

,Webの

サ ー バ プ ロ グ ラム に Apache h Hpdを 使用 した。

3.ユ

ーザの識別 図 3-1の よ うに IPア ドレスが固定 されている場 合

,サ

ーバ

0は

クライアン ト

Aと

クライアン トB を IPア ドレスで識別することができる

.し

か し, 同じパ ソコンを使っている

,ユ

ーザ Alと ユーザA2 は

,IPア

ドレスでは識別できない。 そ こで

,HTTP coOKIES(CGIを

利用 してcookie と呼ばれるデータを

Webサ

ーバか らブラウザ に送 り保存するシステム)を利用 した。 これ によって, ユーザの情報 を複数 回の接続 に対 して保持するこ とが可能 とな り

,ユ

ーザの識別が可能 となった. なお

,異

なるヒン トを出すだけな ら HTMLフ ァイ ル を使用 しても可能である

.し

_{か し, これではユ} ーザが選択 した答えが分か らないので成績 を表示 することが不可能である。

cookieは

_{環境変 数 HTTP_cooKIEに 格納 されて} HTTPヘ ッダーに含めて送信 される。cookieは 「(

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻 クライアントA (IPア ドレス

0

クライアント] (IPア ドレス B) 図

3-1

パ ソコ ンの識別 とユーザ の識別 キー ワー ド)=(値)」 の形式で受け渡 しされる。 cookieの 一つの大きさは 4Kbyte以 下に制限され てお り,そ の大きさを超えた分は切 り捨て られる。 他の制限 としては

,1つ

のブラウザに 300個 までし か登録出来ず

,1つ

の ドメイ ンあた り

20個

となつ ている。 この制限を越えると古 い c00kieか ら順に 削除 され る。HTTP C00KIESは Netscape 2.0以降, Internet Exproler 2.0以降 の ブ ラ ウザ に対 応 し ている

.CGIプ

ログラム としては

,今

回

Perl言

語 を使用 した.

4.定

性実験 ソフ トヘの適用 このシステムの適用例 として

,イ

ンタラクテ イ ブな定性実験 のソフ ト[5]をスタン ドアロンのもの か ら

Web上

のものに作 り替 えた。

4.1

定性実験 のソフ トの説明 定性 実 験 で は

1, 2, 3族

のみ を取 り扱 つて い る。

1族

で は鉛

,銀

, 2族

で は鉛

,ビ

スマス

,銅

,

3族

で は鉄

,ア

ル ミニ ウム

,ク

ロム の各陽 イ オ ン を扱 つて い る

.問

題 は化 学実験 書 を基 に作 成 し, 使 用 す る試薬 を選択す る もので ある

.問

題 数 は1 族が10問

,2族

は14問

_,3族

は 19間で ある. 選択 す る試薬 は

,同

じ族 の問題 で は試薬 の種類

(13種

)お よび表示 の順序 は 同 じで あ るが

,試

薬 の種類 は各族 ごとに異な って いる. 試薬 を選 択 し

,正

解 す る と得 点 が一 つ 増 えて次 の問題 へ移 り

,誤

答 の場合 は ヒン トが表示 され, パソコンの識別 :IPアドレス ユーザの識別:HTTP C00KIES サーバ0 (IPア ドレス 0)

88

_{榊原 正 明 ・高見和 邦 ・堀 内敏史 ・増原良子 :ネ ッ トヮークを利用 したイ ンタラクテ イブなソフ ト} ウェア 減 点 され る。

3回

_{間違 え る と正解 を表 示 して次 の} 問題 に移 る。 同 じ設 間で も

,間

違 えた回数 によ って異な る ヒ ン トが表示 され る

.結

果 は

,個

_{人別 の フ ァイ ル を} 作成 して

,保

存す る

.設

問 フ ァイル は

HTMLフ

ァイ ルで ある.

4.2

実行画面 最初 の画面 (図

4-1)で

学生番号 を入 力 し

,送

信 ボタ ンを押す。 図

4-2

ヒ ン トの表 示 画 面 図

4-1

_{学 生番号 の入 力画面} 設 問の画面で は

,試

薬 の表示 には

Tableタ

グを 使 用 して いる

.画

面 上 の選 択肢 か ら答 え を選 び, ラジオボ ックスで試薬 を選択す る

.答

えは Submit ボタ ンで送信す る。画像 は

IMGタ

グで表 示 し

,画

像 をク リックす る ことによ って

,ビ

デ ォ の画 面 に な る

.ビ

デ オの画面では

EMBEDタ

グを使用 して い る。 ヒ ン トの表 示 され た実行 画面 を図4-2に示 す. 全 て の設 問 が 終 了す る と

,画

面 に成 績 を表 示 す る (図 4-3). 図

4-3

成績表 示 の画面

5,CGIプ

ログ ラム の説明 今回作成 したCGIプログラムは

,3つ

の部分 「初 期化 の部 分」 「設 間 に答 え る部分」 「成績 を表 示 す る部分」か らな って いる。

5,1

初期化

CGIプ

ログラム 初めのCGIは

,入

力 された番号 をcookieに_保存 操作:第3族イオ ンの分離 操 作1両面4 t・畠長】fど韻祷卓なFhだュ￨,こい試重 工盛とをJをき、ミ懸 趨 成績発表 あなたの成績は優です。 大変良く出来ikした。 」

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻 ■ ■ ■ 旧 昭 Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ し

,そ

の番号 をファイル名 として使用 したユーザ ファイルをサーバに作成する。これは cookieに 入 って いる他 の変数 を初期化す るためのプログラム である. クライア ン トのブラウザ とサーバ内の

Webサ

ー バ と 3つ のファイル (CGIプ ログラム

,HTMLフ

ァイ ル

,デ

ータファイル)とのデータの流れは図 5■ の

ようになる.① ユーザがブラウザからユーザ番号

を入力する.② ブラウザは

Webサ

ーバに

URLを

指

① ユーザがユーザ番号を 入力する 定 して 初 期 化

CGIプ

ログ ラム を要求 し

,デ

ー タ を 送 る

.③

Webサー バ はURLで指 定 され たCGIプログ

ラムにデータを渡す

.④

初期化

CGIプ

ログラムが

実行されると

,デ

ータをファイル名に利用 したユ

ーザ ファイルを作成する。⑤

CGIプ

ログラムは

cookieを

初期化し

,初

めの設問ファイルを読み出

す。⑥

CGIプ

ログラムは

cookieと

実行結果を

Web

サーバに渡す

.⑦

Webサ

ーバは

cookieを

含む受け

取った結果をブラウザに送信する。③ブラウザは

③cookieを 保存 ③結果表示 _{l c。。kie} クライアン ト ② 初期化 CGIプ ログラム を要求 し、入力された 値 を送 る ⑦実行 結果 と cookie を 送 る サ ーバ

プログラムにおけるデータの流れ

Tebサー′ヽ ⑥実行結果 と初期化 さ れ た cookie を取得 ③CCIプログラムヘ データを渡す ⑤設問ファイルの 読み出 し 初期化 ④ユーザファイルの作成 ユーザファイル ユ

図

5-1

初期化

CGI

榊原正明・高見和邦 ・堀内敏史・増原良子 :ネ ッ ウェア トヮー ク を利用 した イ ンタラクテ イプな ソフ ト 受け取つた CoOkieを 保存する。③ブラウザは実行 結果を表示する, 初期化 CGIプ ログラムの流れ図は図 5-2に 示す。 初期化 CGIプ ログラムは以下の通 りである。 11/usr/bin/perl

require'/us1/1ocl1/wYv/Cg■ bin/cg卜 lib,plj, &ReadPaFSe;

￨クッキーに付ける名前 (他と重な らないようにす る)

$ooo【iC_nane = '■ un'I

‖記録す るクッキーを設定

$cook=$int"iid"};

1時刻取得 を国際標準時 とする

$ENV('lZ'}二 "GMT";

1ク ッキーを消化する時刻を設定 (30*24*60*60: 30日 後)

(tsecgJ$ml■g,Shou―rs Sndavs Snlongr Syear 3 swdayg,$vdays,i

sdstOこ 10Caltine(tine+1*60160); if(3vearg(1.0) (lyeaFg='0$yeargl;} if(3seogく 10) if ($ming( 10) if(Sholfgく 10) if ($ndavg ( 10) $vO二 "Sundav''i

Sy3itt Ved■esdav";

$ySギSaturd4v":

1帝Iと

'ia三

"!Vi“￨」

だ

と

1$塩

必

亀

紺

:S瑠3」

招

:争￨』fm4」 Mav"

$■5="Jun'':

$n6="Jul",Sm7="Auゴ'I Sm8="Scゴ'￨ $n9="Oct";$■ 10」 'Nov'

$■11="DeC":

$nOnth

($れ0,4■1,$m2,$n3,S■4,患■5,$m613■ 713■8,S■9,$n1l oJ$nll) [JnO■ga i

$datettmt = "Syoubil

S10urgiSnl■g:isccg cMT"i

十ファイルの初期化

$f_result="./datafile/res$c00k球 i

00en(IN,"〉$firesult'); pFint IN "":

close(In i

$ndavgY― $month¥―Sycarg

S secg="03secゴ ; $■ing = "0$lning": $lourg i "0$lourg": tlndavg i "0$ndayg" i SyI="MO■dav"￨ $y4=Ⅲthursdav"; $v2="Tuesday" $,5二帝FridavT 入力された値 を取得 クッキー を消化す る時刻を設定 入力された値 を利用 したファイル名 を作成 ユーザ ファイルを作成 ユーザファイルの初期化 codkicのキーワー ド(iunlに入力された値 を入れて送信する

oookteの キーワー ドlmarui batu,count,hint)を初期化 して送信する

一問目の設間のURLを とocatio■ ヘッダで指定してブラウザに表示させる

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻 ■ ■ ■ ■ 用 ＝ 旧 Ｉ ＝ ＝ ＝ ＝ ＩＩ Ｉ ｌｌ ｌ Ⅲ Ｔ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ Ｉ ‖ヘッダとして送信

print "Se _{$cookie_■ ame=$cooに}

,

expires=$date_gmt¥n";

print "Set―Cookie: maru=Oi explFeS=$date_gnt¥五 ∵;

print"Set― Cobkiei batu=oi expires=$date_gntrll"i

print 'Set― Cookie: countこ-li expires=$date_gmtrn";

print WSet―Cookie: hint=i expires=$dat eignt¥■ ":

print"Location, 1問 目の設問 CCIプ ログラムのURL ¥ュTn";

5.2

設間の

CGIプ

ログラム このプログラムは

,ユ

ーザが選択 した答えをユ ーザ ファイルに保存 し

,そ

の正誤を判断して設間 を進めていくプログラムである。 図

5-3に

ブラウザとサーバとのデータの流れを 示す。データの流れは次のようになる。①ブラウ

ザで答える。②ブラウザは

,URLを

指定して

CGIプ

ログラムを要求し

,選

択した答えを送る

.③

Webサ

ーバは

URLで

指定された

CGIプ

ログラムに受け取

ったデータを渡す。④設間

CGIプ

ログラムはユー

ザファイルに選択した答えを書き込む

.⑤

設問

CGI

プログラムは設聞ファイルを読み出す。⑥設問

CGI

プログラムは実行結果と

cookiCを

Webサ ーバヘ渡

す

.⑦Webサ

ーバはブラウザに実行結果と

cookie

を送信する。③ブラウザは受け取った

cookieを

保

存する

.⑨

ブラウザは実行結果を表示する。

ここでの

cookieに

はヒント

,ユ

ーザ番号

,同

じ

設間での誤答数

(count),そ

して

,全

体の正答数

プラウザ ①答える ③じookieを 保存 ⑨結果表示 クライアン ト ②URLを指 定 して 設 問 CCI プログラムを要求 し選択した答えを送る ⑦ 実 行 結 果 と cookicを 送 る サ ーバ

設問

cGIプ

ログラムにおけるデータの流れ

Webサーブヽ ⑥実行結果 とcookle を返す ③CGIプログラムヘ データを渡す ⑤設問ファイルの 設聞CCIプログラム 読み出し → 一 設 関 フ ァイル ④ユーザファイルヘ 選択した答えを書き込む ―ザファイル

図

5‐

3

」

榊原正 明 ・高見和邦 ・堀 内敏史 ・増原良子 :ネ ッ トヮークを利用 したインタラクテ ィブなソフ ト ウェア (maru)と誤答数 (batu)が 含 まれている。 CGIプ_{ログラムの流れ図を図5-4に示す}

_.プ

_ログ ラム の流 れ は以下 のよ うである。初 め にデー タが 送 られ る。次 にユ ーザ フ ァィル ヘ の書 き込 み を行 な う

.そ

の後

,正

誤 の判 断 をす る

.間

_{違 えた場 合} は 「ヒン ト」 を

,正

解 の場合 は 「正 解 です」 を,

3回

_{間違 えた場合 は 「答 え」 をそれぞれ cookieに} 入 れ る。次 に

,読

み込 む フ ァィル を指定す る。 間 違 えた場 合 は同 じ設 間の ファイル を

,正

解 あ る い は

3回

_{間違 えた場 合 には次 の設 間の フ ァイル を指} 定す る

.そ

して cookieを_{送信 し}

_,指

_{定 した フ ァィ} ル を読 み込 んで送信す る。 ヒン トを表示す る場所 にはダ ミー の文字 ($hint)が 書 いて あるので

,そ

の

文字を置換して送信することによってヒントを表

示する

,countが

-1の

_場合

_,ヒ

_{ン トの表示 される} 部分 を空白にして表示する.

CGIプ

_{ログラムのソースを以下 に示す。なお下} 線部の部分に具体的な番号

,あ

るいは urlが 入る. 十!/usr/bin/perl

require "/usr/10ca1/wvw/cgi― _{bin/cgi― lib pl";} &RcadParse; #cookieを 環境変数か ら取 り出す loreach(split(/; /,$ENV('HTTP_C00KIE'}))( ($key,$nunber)=split(/=/); $cookieJar($key)=$■umberl } if(ScookieJar(count) == -1) ( $url='同じ設問ファイル': ScookieJar(cOunt)十十; $cookicJar thint) = ""; &dispheadi lelsct #結果のファイル

$f_result=" /dataFile/resScookieJar tュ _um}";

Open(IN,"〉〉$f_result"); flock(IN,2);

性能

∞

虞器

(∬u耐

,ポ

,粘

挽

k出 : print IN "¥n"; flock(IN,8); closc(IN); if13

ド

飩

(;1li爵ll母

評

壽

子

f書

基

墾

聖

登

り

{ $cookieJar(cOunt} = o: $cookieJarthint}="正 解です "; lelse( $url='次の設問ファィル'; $cookie,ar(batul+十i のヒン ト"; 目のヒン ト": の試薬を表示"i $cookicJar(count}+十; if ($cookieJar tcount}== 1)( $cookie」aHhint)="1回 目 }Ыttf Oc肌

ず

ai '手

$cookieJar(hint}="2回 lclsc t $url='同 じ設問ファイル ': $cookie,arthint)="正 解 $url='次の設問ファイル'; $count=0, } ) &disphead; ) sub disphead ( print expires=$date_gmtF "Set―

Cooにic: maru=$cookieJar{maru}:

ユ:

print

expires=$date_gnt¥ "Set COokiei batu=$c00kieJar(batul;ni

print

expircs=$date_gntr"Set COokie: hint=$c00kieJarthint);■,

print

expires=$date_gnt予

"Set―_{CoOkiei cOunt=$,ookieJartcount};}

wm"d;

,ontent―typei tex t/htnl¥nΥュ":

open(fp, vhile (く "Surl"); (Fp〉) ( chop($_); if($_ eq 'Shinド

₎₍

print''$cookie」 ar thint)";

lelset print ) ' } close(fp), ) 「設間の解答」ウでは設 問毎 に別 の

CGIプ

ログラム を使用 して いる。 設 問 フ ァイル と

CGIプ

_{ログラム の関係 を図 5-5} に示す。 ブラウザ か ら設 間1を答 える と

CGIプ

ログ ラム が実行 され る(破線矢 印

).CGIプ

ログラム1は

,間

違 えた場合 には設問1の_{フ ァイル を読み込 んで(点} 線矢 印)表 示 し, 正解 あるいは

3回

間違 えた場合 に は設 問

2の

_{フ ァイル を読 み込 んで(実線矢 印)表 示} す る.次に設問 2 に進 む.ブ_{ラウザか ら答 える とCGI} プ ログ ラム

2が

実行 され る(破線矢 印

).1と

同様 に

_,間

_{違 えた場合 は 同 じ設 問(点線矢 印}

_),そ

_れ以 外 は次 の設 問 フ ァイル を読み込 んで(実線 矢 印)表

﹁

︱

︱

︱

︱

︱

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻

図

5‐

4

設 問

CGIプ

ログラムの

NSチ

ャー ト

←

_{HTTP COOKIES}

+1

hint← ファイルヘの書き込み

siyaku=

正 解 ru←

maru+1

unt<学

o

hint←"正_解です"

$url←

次の設 問

count←

―_count十

batu←

batu引

-1

hint

← 一 回 目の ヒン ト

$url←

同 じ設 問

count = 2

Yes hint<‐ 二回 目の ヒン ト

$url←

同 じ設問

hint←

正 解 の試薬

$url←

次 の設 問

count←

0 設問ファイルか ら一行読み込む ($_に入れ る) `$hint' $_を

hintで

置換 して を表示 J

榊原正 明・高見和邦 ウェア 堀内敏史・増原良子 :ネ ットワータを利用 したインタラクテイブなソフ ト 画面 (プラウザ) 設問1

‖―

▲

‖

: ・¨¨""・・¨ n・・…_:・ ""中中“") プログラム ファイル 設問CGI―プログラム 3 設間フ ァイル1 示する。以後の設問も同様 に進んでい く.

5.8

成績 を表示す る

CGIプ

ログラム 最後 に 「成績 の表示」では

,CGIプ

ログラムは cookicに 保存 してある全体の正答数( aru)と誤答 数(batu)によ り成績 を画面に表示 し

,ユ

ーザ ファ イル に保存する。 成績 を表示する

CGIプ

ログラムの流れ図は図 5-6の ようになる, CGIプ ログラムのソースは以下に示す。 キ!/uSF/bin/peFl

require '/usF/100と 1/WWw/Cgi一bin/cgi―li b,。1';

:oreach(split 71/す $ENV{'ITT吐 C00KIEj l))( (Sheyl$valuc)=split 7=か :

SCoOkiCJar($kev}=$valuc;

}

Sf_total = " /dataFile/10t$CookieJartn dm)Ⅲ :

St,tal =

ScookieJartmaru}/(`CookielaFtⅢ arul十$cookieJaF tbatЦ!)*100

open(IN,"鴻f_totall)￨ print IN Stotal;

図

5-5

設問ファイル と設問

CGIプ

ログラムの関係

設問ファイル2 設聞ファイ 'レ 3 close(IN); 1結果のファイル

$f_FeSult=― ./dataFile/res$90okieJar tnum)・ :

open(IN,"〉〉Sfircsultl);

flock(IN1 2);

priit IN 'naFu",''Υ:",,COokieJartnar」 };

pFint IN "¥■',

pri■t IN "batu","V:",ScookieJar(batu〕 ,

print IN "ヤ n",

olrint iN "total","平 :","Stotal";

print IN ttΥ■Wi flook(INI働￨ lc10Se(IN); if($to141 〉= 90)( $hvoこii="壱き"; $cdment="大変良く出来ました,"; }elsif(StOial〉=80)( Shyo■ji="優"; $coment="良 く出来ました."; l elsif ($tOtal 〉= 70)( thvoui lゴ 良Ⅲi $coment=・ もう少し注意深く実験しましょう."; } elsi f (Stotal 〉= 50)( $hyouj i="可″; Scomentt'も う一息がんばりましょう.": l elsif($total〉 =40)( 袖vol,I="不 可〕￨ $tonentゴかなりの努力が必要です.T: l elSet 訥youi iゴ'不可": $conentゴ '初めから勉強 し直す必要がありますと': l

pri■ t 'Co■ tent―type: telt/html¥■子■";

十文字化けする場合は,該当文字の直後に¥を書 ぐ (例

設問 CCIプ ログラム 2

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻 コメント A:大変よくできました。 B:良くできました。 C:もう少し注意深く実験をしましょう。D:もう一息がんばりましょう。 EIかな りの努力が必要です。F:初 めから勉強をしなおす必要があ りま 変数 ← HTTP_C00KIES

total ← maru/(■arulbatu)× 100

tdtal 評価=不可 コメ ン ト

=F

評価=優 コメ ン ト

=A

評価=不可 コメ ン ト =E 評価=優 コメ ン ト

=B

評価=良 コメ ン ト

=C

評価=可 コメ ン ト

=D

結果 の画面を表示

図

5-6

成績

CGIプ

ログラムの

NSチ

ャー ト

ザ⊆チ明 ・高見和 邦 ・堀 内敏史 ・増原 良子 :ネ 機能¥) :j:〈;￨1懲

;1麟

憩

麟

1摂

∬

年

昇

I蠍

島

謙

報予

1掌 ;績

発

表

馨

ダ汎溺】

毬

ド

♯

{酬

けあ

な

たの

雄は

$消

町 マ砂

I♯

撞透挫 せ

≧

サ

与

学

_,セ

Ч

ttr称

_￨ print "〈_/30DY〉℃/HTML〉 ";

6.画

像 につ いて 画像 には静止画 と動画の両方 を利用 して いる. 静止 画 はデ ジタルカ メラ(FUJIFILM DS-7)を 使用 して

,JPEG形

_{式でパ ソコ ンに取 り込 んだ}

_.こ

_{れ を} 画像 フ ァイル のサイズ を小 さ くす るた めに

,ィ

メ ー ジフ アイル のコンバー タによって

GIF形

式 に変 換 して使用 した。 実験 中の溶 液 な どの変化 の様子 を示 すため に, 動画 の使用 も試みた。動画 を作成す るために

8ミ

リビデォ(soNY HandycOmPRO CCD―_{V90)で 映像 を撮}

り

,I,O DATAの

_{キャプチャーッールを用 いて AVI}

形式でパ ソコンに取 り込んだ。 ビデオの形式は 24bitRGBを 使用

,ビ

デォのサイ ズは320×_{240を 使用 した}

_.最

_{大キ ャプチャ時間は} 10秒 に設定 した。 しか し

,AVI形

式は

,サ

ィズが大き く

,フ

ァィ ル全てを受信 し終わるまで再生を行なわないダウ ンロー ドタィプのため

_,ブ

_{ラウザでの再生 まで に} 時間がかか りすぎる

.そ

こで

,圧

縮 率が高 く

,ビ

デオな どの ファイル を

_,ュ

_{ーザが受 け取 りなが ら} 再生するス トリーミングビデォを用いた。今回は, ソフ トの操作性 を考 えて

,ブ

ラウザのみで使用す るため

,外

_{部 ビュアーが立ち上が らず}

_,専

_用サー バが必要 としな い

,Vivo SOftware社

_{が 開発 した}

V oAct

eを

_{使用 した。 これに伴 い}

_,AVI形

_式か

ら VivoActiveの 形式である

VIV形

_{式 に変換 して使} 用 した。 この結果

,動

_{画再生までの時間を短縮す} る ことがで きた。 しか し

,静

_{止画 に比 べてサィズが大 きいので設} 間の画面 には表示せず,別の ウィン ドウを開いて, そ こで表示す るよ うに した.

7,実

施結果 この ソフ トを農学部 の化学実験受講生 27名に実施 した。結果 として

,実

験 のイ メー ジが しゃす か っ た等おお むね 良好であった。 8. 終わ りに

Webサ

_{ーバ を中心 と した ネ ッ トヮー クシステム} を構 築 す る ことによ り

,イ

_{ンタ ラクテ ィブな機 能} を持 ち

,ュ

_{ーザ を識別 した ソフ トの開発が可能 と} な った。化 学領域へ の試み と しては

_,実

_{験 操 作 の} 画 面 を簡 単 に示す ことができ

_,動

_{画 を用 い る こ と} によ って実験 の操作 をイ メー ジ しゃす くな った. なお

_,動

_{画 にス トリー ミ ング ビデォ を使用 す る こ} とによ って再生 まで の時 間 を短縮す る ことがで き た。 今後 の プ ログ ラム の改 良 につ いて は

,選

択 す る 試薬 を操作 ごとに変更す る

,試

薬 だ けでな く沈殿 の種類 (化学式

),色

,反

応等 も問 うよ うにす る, 学 生が使 用 しや す く

_,わ

_{か りやす い画面構成 に} す る とい った点 が挙 げ られ る。 また

,実

際 の画 面 をさ らにきれ いな映像 と して取 り入れ るよ うにす る ことも考 え られる。 参考文献

[1]Kris Jamsa Ph.D, Suleiman Lalani, steve

□

糀鞣督

撃

_{総 亀離畦}

_本

/化

学 同人.

[3]鈴_{木久雄す 伊澤俊二}

_,尾

_崎成子

_,矢

_{野敬幸 :ネ}

鳥 取 大 学 工 学 部 研 究 報 告 第 29巻 ■ 門 ＩＩ Ｉ １ｌ Ｈ Ｈ 日 日 脚 ︱ ︱ ︱ ︱ ッ トワーク新時代 に対応 した新 しい講義 システ の試み〕J.Chem.Software,3,165,(1997). [4]吉村忠与志

,岩

崎利史

,青

山義弘 :イ ンターネ ッ ト・ プラウザ による化学 ビデオ教材の開発 と 試用,化学教育ジャーナル (CEJ),第

1巻

11号

. [5]榊原正明す高見和邦

,立

花良一 :定 性分析実 験 における学習プログラムの利用,コ ンピュー タ

&エ

ヂュケー ション

, 2巻

,pp.85-89,1997. (受理 平成

10年

8月 21日)