DEIM Forum 2015 D7-3
紙媒体と電子媒体を行き来可能なコースウェアの実装
藤森 雅人
†廣田 雅春
††石川
博
†††横山
昌平
†††††
静岡大学情報学部
〒 432–8011 静岡県浜松市中区城北 3-5-1
††
首都大学東京システムデザイン研究科/日本学術振興会特別研究員 PD 〒 191–0065 東京都日野市旭が丘 6-6
†††
首都大学東京システムデザイン学部
〒 191–0065 東京都日野市旭が丘 6-6
††††
静岡大学大学院情報学研究科
〒 432–8011 静岡県浜松市中区城北 3-5-1
E-mail:
†
[email protected],
††
[email protected],
†††
[email protected],
††††
[email protected],
あらまし
メディア教育の再構築を目的とした項目独立型の教科書「メディアカード」の作成，および紙媒体の試作
を行っている．本研究はその電子化の取り組みとして位置付けられ，本論文では MediaWiki
（注1）を核としたコースウェ
アの実装について述べる．メディアカードは，教員らが項目を電子上で協働的に編集する教科書であり，授業に応じ
た項目のサブセットを印刷，学生らへの配布を行う．学生らは項目の引用情報と共にレポートを電子システム上に提
出し，年度ごとの提出記録が同一授業で蓄積されていく．したがって，紙媒体と電子媒体を併用した利用形態が想定
されるため，紙媒体の一覧性と電子媒体の更新の手軽さを併せ持つシステムであるのが望ましい．具体的には，コー
スウェア上の任意の項目から印刷媒体を動的に発行する PDF 生成機能を実装し，その PDF には電子媒体の項目への
リンクを示す QR コードを埋め込むことで，媒体間のスムーズな移行による高度な学習のインタラクティブ性を実現
する．
キーワード
電子教科書，インタフェース，学習システム，集合知
1.
は じ め に
我々メディア研究会（注2）は，メディア教育の再構築を目的と したカード型の教科書「メディアカード」を作成している．メ ディア教育上の身近な素材を研究対象とするメディア研究では， 幅広い専門分野の基礎的な知識が必要とされる．そのため，従 来のメディア教育では，縦割り型の講義によって，分野ごとの 専門性の向上が図られてきた．その一方で，講義を選択的に履 修する学生にとっては，講義の間で共通して登場する重要概念 の結びつきを把握することは容易ではない．教員の側でも，講 義を担当する教員同士で打ち合わせを行い原始的に整合性を図 ることは負担であり，カリキュラム全体で徹底することは困難 である．このような背景から，知識をシンプルなカードに収め て比較を容易にするための新たな教科書として「メディアカー ド」が提案された． これまでに，複数の専門分野の教員らによるカード項目の執 筆と紙媒体の試作，および前準備としていくつかの試験運用を 行ってきた．それらを通じて，新たな知識のネットワークを発 見するための手がかりが示唆されてきたが，紙媒体での運用と ファイルサーバによる電子媒体の管理方式をめぐって，運用上 の問題点を指摘し，再検討を図った．紙媒体と電子媒体の共存 を図り，それぞれのメリットを最大限に活かすため，状況に応 じて閲覧媒体の選択を切り替えられる事が望ましい．従来の研 究では，紙媒体から電子媒体を参照する有坂らや榎本らの研究 （注2）：静岡大学情報学部の教員によって組織された学内研究会であり，筆者は 技術担当の学生メンバーとして参加している． が存在するが，彼らの手法では電子媒体から紙媒体を参照する 場合が考慮されていない．そこで，本研究では，利用者が紙媒 体と電子媒体の間を行き来可能なインタフェースの提案を行い， これを組み込んだシステム「MediaKenja」を実装する．これ により，利用者は任意のタイミングで閲覧媒体を切り替えるこ とが容易となり，それぞれの媒体のメリットを受けやすくなる ことが期待される． 2章では，関連研究について述べる．3章では，本研究で扱 う教科書「メディアカード」について詳しく述べる．4章では， 提案システムの実装について詳しく述べる．5章では，本研究 の成果についてまとめる．2.
関 連 研 究
今日では，インターネット通信への接続インフラの普及に よって，日常生活におけるインターネット利用が当たり前に なっている．特に，Web技術の発展はめざましく，高速で快適 なブラウジングと多様な画面上での表現によって，人々のWeb コンテンツ体験を魅力的なものにしている．インターネットの 接続手段にも変化が見られ，従来のノートPCや携帯電話に加 えて，スマートフォンやタブレット型PCといったタッチパネ ルを備えたモバイル端末が普及している．このようなデバイス の多様化に対応する形でもWeb技術は発展を遂げている．こ のようなWeb技術を教育・学習の分野で活用する研究は盛ん であり，Web技術を用いた学習支援システムの研究開発の中 で，サーバに設置された教材コンテンツを，学習者がWebブ ラウザを通じて閲覧を行う，遠隔型・分散型の学習形態として過去のWBTシステムに関する研究では，資格検定の学習[6] や専門知識の演習[7]，リスニング教材を用いた英語学習[8]な どが盛んに行われている．また，提案システムでは，学習者の 教材に対するコメントや教材を引用したレポートの投稿などを 可能とし，学習者の教材に対する操作を学習者の集団全体に見 える形で学習過程の記録を蓄積していく．これまでに，学習者 が作問を行い評価する学習支援システム[9]や，教材について の学習者の対話を通じてWeb教材を成長させるシステム[1]な どの関連研究が行われてきている． WBTでは，電子媒体で教材コンテンツを扱うことため，紙 媒体のように自由な書き込みが電子媒体では困難である．その ような課題に対して，伊藤ら[2]は，電子媒体の教材に対して 紙媒体の教材と同じように書き込みを行えるシステムを開発し， 学生に対して電子媒体と紙媒体の間で学習の理解度を比較する 実験を行い，電子媒体の教材への書き込みの見直しによる学習 効果を明らかにしている． このように，電子媒体のみでの教材の運用の可能性が示され ているが，赤堀ら[3]は，教材の媒体ごとの有効性と特徴につ いて，学生に対して紙・iPad・PCの間で比較実験を行ってい る．その結果，単純な知識の記憶や理解については紙媒体が適 し，個人的な思考を問う問題や総合的な判断を問う問題などに ついてはiPadが適し，また，iPadは継続的な学習を促す特性 があることを明らかにしている．この結果から，紙とiPadを 教材の媒体として併用することで優れた学習効果が予想される と主張している． 紙媒体と電子媒体の間の参照インタフェースに関する研究で は，有坂[4]らが，QRコードを利用して紙から電子上の機能 を起動するインタフェースについて検討を行っている．例えば， アプリケーションの機能のショートカット・キーの入力や，アプ リケーションの起動命令，およびパラメーターなどといった情 報をQRコードに置き換えることで，紙からコンピュータ上の 機能を直感的に起動・利用する例を挙げている．また，榎本[5] らは，紙の教科書とマルチメディアコンテンツを連動させる手 法として，非接触型ICカードの利用を提案している．ICカー ドのリーダーに携帯情報端末PDAを利用し，インターネット 上の任意のコンテンツやデータベースを参照可能なほか，IC カードに書き込まれた教材の概要情報や，PDA内のデータに アクセスすることも可能であり，オフライン利用可能な長所が ある． 利用技術で見ると，英数文字（US-ASCII）が最大4,296文 字格納可能なQRコードと比べ，半導体メモリが組み込める非 接触型ICカードが圧倒的にデータ量の面で優れている．しか し，自作が困難であるIC（集積回路）を内蔵した非接触型IC カードと比較して，規格が公開されているQRコードは何らか の平面に印刷するだけで利用が可能であることから，紙から電 子媒体へのリンクを張る際はQRコードを採用することでシス テム開発のコストを低く抑えられる．コンテンツの参照と管理 については，榎本らの手法ではインターネット上のコンテンツ の参照やダウンロードが可能だが，ローカルに保管したコンテ ンツからインターネット上のコンテンツを参照する手段は無く， コンテンツ自体からコンテンツの更新を確認するのは困難であ る．そこで，本研究では，オンライン上の項目をローカルに保 管する際，コンテンツにオンライン上のリンク，およびリンク をを示すQRコードを埋め込む手法を提案し，紙媒体と電子媒 体の間で相互的な参照を可能にする．
3.
メディアカード
3. 1 メディアカードの作成背景 メディアカードの作成背景には，メディア教育上の要求が存 在している．幅広い専門分野の基礎的な知識が必要とされるメ ディア研究において，従来のメディア教育では，縦割り型の講 義による専門教育が行われてきたが，メディア教育に共通する 概念が複数の講義にまたがって登場することがある．しかも， 同じ概念がそれぞれの分野の立場から異なって解釈され，定義 や用語に違いが生じてくる．これは，分野同士が影響を及ぼし 合いながら発展してきた人文科学および社会科学の諸分野の性 格上，必然的であるとともに，学習上注意を払わなければなら ない事項でもある．むしろ，このような諸概念を異なる分野の 視点で把握し，比較を行うことは，分野の研究姿勢を理解する 事にも繋がる． しかし，このような人文科学・社会科学の諸分野の性格は， メディア研究の教育・学習に負担を生じさせている．選択的に 講義を履修する学生にとっては，講義内容の知識を整理しつつ， 別の講義と共通する知識と比較を行うことは容易ではない．そ れどころか，「この講義をAという概念をBBと説明している が，たしか別の講義ではAに似た概念A’をCCと説明してい た気がする。どちらが正しいのだろうか」などと概念の名称と 定義をめぐって混乱するケースも考えられる．したがって，講 義を担当する教員同士で打ち合わせを行い，共通して登場する 概念の指導内容の整合性を取る必要があるが，カリキュラム全 体に渡って徹底する事は教員にとって負担が大きい． 例えば，「身体」および「アイデンティティ」は，人文・社会 系の大きな主題の一つである．哲学・モラル思想における身体 と自己は，身体を改造しても自己同一性を維持することが可能 かといった問いに落とし込まれていく．認知言語学における身 体とは，言語を成立させるために必要な現実の経験に基づくメ タファーの源である．文学批評における身体の表現は，重要な 論点の一つでもある．メディア論における身体とは，記号化さ れた「身体」であり，同時に社会的・文化的な「身体」をも構 築していく．社会学における身体とは，社会集団に属する個人 が，メディアの規定する「望ましい身体」と帰属意識の間で揺 らいでいく．このように，様々な分野で議論の素材として「身 体」や「自己」の概念は使用されてきた． メディアカードは，このようなメディア教育の課題を背景に， 知識の共通化を図る試みとして作成された．予備的に選定した メディア研究の重要なキーワードを「カテゴリ」とした上で， 複数の異なる専門分野の教員が同じカテゴリについてカード項 目を執筆する．これにより，あるカード項目を，専門分野とい う「縦」の視点と，キーワードという「横」の視点から，立体 的に把握することが容易になると考えられる．さらに，一枚のカードに一つの項目という物理的にも情報量的にも扱いやすい 形式は，知識の比較を容易にし，「縦」と「横」に限らない知識 の繋がりの発見を促すことが期待される．このように，メディ アカードの活用によってメディア教育の再構築を期待する． 図 1 メディアカードのレイアウト 3. 2 メディアカードの内容と書式 メディアカードはカード項目の束で構成され，一枚のカード 項目は，タイトルとカテゴリ，著者，日付，本文，画像（任意）， 脚注（任意），参考文献（任意）を含む．図1は初期に試作し た紙媒体のレイアウトと実際のカードのサンプルである． タイトル:メディアカードのユニークなカード項目の名前であ り，20文字以内程度である．「Googleの民主主義と隠れたる 神」，「IT関連用語」といった体言止めのものや，「「とらぬ狸」 はどう訳す？」，「湾岸戦争は起こらなかった？」といった疑問形 によって問題提起を投げかけるもの，シンプルに「文化住宅」， 「コーヒーハウス」といった名詞で内容を代表するものなどが ある．こうした題名の工夫は著者の判断に任せている． カテゴリ：カード項目の内容の種類を表すキーワードであり， 20個近くを主要なカテゴリとしている．すべてのカード項目 はいずれかのカテゴリを持っている．予備的にカテゴリの選定 を行うため，メディア系科目で使用されている資料・スライド から，語句や文献，人物，作家，作品，メディア素材の重複を 検索した．その結果，完全に重複するわけではないが，隣接す るテーマや類似した系統・ジャンルの人物，作品が複数の講義 で取り上げられていることを明らかにした上で，選定の参考に した． 著者：カード項目を執筆した著者の名前である．著者は，一枚 単位でカード項目の執筆を行い，執筆枚数に制限は存在しない． 日付：カード項目を執筆した日付である． 本文:カード項目の内容本体にあたる．本文の文字数に規定はな く，印刷時に一枚のカードに収まるのであればよい．フォント のサイズにもよるが，最大文字数の目安は900文字前後である． 画像：カード項目の説明に用いられる画像である．広告や絵画， 美術作品，建造物などといった対象の説明・分析の補助のため に用いられる．大きさは自由であるが，本文と同じように一枚 のカードに収まるのであればよい．必須項目ではない． 脚注：カード項目の本文に対して補完的に補足や説明などを行 う注釈である．必須項目ではない． 参考文献：カード項目の参考文献の一覧である．必須項目では ない． 3. 3 メディアカードの活用方法をめぐる予備実験 メディアカードが利用者によってどのように結び付けられる のかを明らかにし，活用方法について検討するために行ってき た3つの予備的な実験について簡単に触れる．一つ目に，公開 イベントの参加者にメディアカードのカード項目を自由に繋げ てもらった．二つ目に，講義における学生への「問いかけ」に 対して自分の意見をまとめる際に，メディアカードを活用して もらった．三つ目に，試作した紙媒体を学生に配布し，学生に 講義での参照・引用を働きかけた． 公開イベントにおける予備実験は，2013年11月9日・10 日の静大祭に出展したメディア研究会のブース内で行われた． A5サイズの紙媒体に印刷した約70枚のカード項目2組をラミ ネート加工し，紐を通すことのできる穴を2箇所開けた．この メディアカード2組と綴紐，水性ペン，メモパッドサイズの付 箋をテーブルの上に用意した．参加者には，綴紐を用いて好き なようにカードを繋げることや，付箋に何かを書いてカードに 貼り付けたりすることなどを自由に行うように指示した．その 結果，１．同じカテゴリや似たキーワードを含むカードのつな がり，２．異なるカテゴリのカード同士で似たキーワードを含 むカードのつながり，３．カテゴリやキーワードによらず無関 係のように見えるカードのつながりという3種類のつながりが， カード項目同士のつながり方のパターンとして現れた．カード 同士を結びつけた紐や，意見や感想を書いて貼り付けた付箋な どが，後に来る参加者にも見える形で残ることが，カードの結 びつきを促進させた可能性も指摘できる． 講義における予備実験では，2014年1月27日，2月3日，2 月10日の「メディア・スタディーズ」の講義にて行われた．メ ディア言説における排除，現実の構築，そしてメディア情報の 受容と効果に関する3つの問いかけを行った．メディアカード を学内のファイルサーバに設置し，学生に自由な閲覧と参照を 指示した．その結果，学生は問いかけに直接結びつかないカー ド項目も参照した．これにより，一見無関係に見えるカード同 士が思考活動によって結びつく可能性が示唆された． 2014年度の「公共圏論」の講義では，試作した紙媒体のメ ディアカードを学生に配布して，講義内でカードの参照と小レ ポートへの引用，および最終課題レポートへの引用を指示した． また，既存のメディアカードに倣い，講義の内容を振り返りな がら新たなメディアカードを作成する課題も与えられた．約130 枚のA5サイズの紙に印刷したメディアカード1部を，リング 式のバインダーと透明なリフィルを共に配布し，カード項目の リフィルへの自由な組合せと配列を行う「袋とじ」形式を指示 した．講義中の小レポートへの引用は，講義時間の都合上十分 に行うことができなかったため，講義を進める上で，メディア カードをどのように学生への問題提起に利用していくかが課題 として指摘できる．特筆すべき事項として，例年のレポートに 見られない特徴が，メディアカードを用いたレポートでは観察 された．例年，この講義では，あるテーマについて課題レポー トを学生に課すと，そのテーマをキーワードに検索エンジンで
検索して，上位にヒットしたとみられるWebサイトを参考文献 に載せているレポートが散見されてきた．ところが，引用文献 をメディアカードに限定すると，引用されたカード項目に適度 な散らばりが確認されたのである．これにより，メディアカー ドの持つ思考活動の足場としての可能性が示唆された． 3. 4 メディアカードの管理方式の再検討 以上の節で触れた諸所の活動のなかでは，メディアカードの 持つ可能性を示唆する結果について触れてきたが，問題が生じ る事も考えられる．ある事柄に興味を持った学生が，紙媒体の メディアカードから似た事柄について言及しているカード項目 を探すとき，カテゴリがある程度の目安にはなるものの，それ 以外のカード項目にすべて目を通さなければならない．また， 一度印刷した紙媒体のコンテンツを更新することは困難であり， 基本的に更新される度に印刷をやり直すことになるが，同じ記 事の異なるバージョンを印刷した場合に，どれが最新版でどこ が差分であるか，といった事が分かりにくい．このように，メ ディアカードを運用する上での問題点となる，紙媒体に特有の デメリットを無視する事はできない．また，教員にとっては， ファイル管理している電子媒体のカード項目の中から，講義で 配布するためのカード項目を印刷するために，目的のカード項 目を探す手間が掛かる．以上のことから，現状のファイルシス テムによる管理方式を見直し，紙媒体と電子媒体が共存する環 境を構築する必要性が出てきた． メディアカード管理方式の再検討にあたっては，紙媒体と電 子媒体のメリットを最大限に活用できる状態にすることが重要 であると考える．紙媒体は，筆記用具を用いて自由に書き込み 可能であり，電子媒体は，柔軟な表現力によって情報を可視化 することが可能である．また，紙媒体の検索性の低さや更新の 困難さ，管理の煩雑さは，電子媒体によるメタデータの付与， 更新の手軽さ，ペーパーレスによってカバーすることができる． また，紙媒体と電子媒体を最大限に活用するにあたっては，状 況に応じて長所を活かせる閲覧媒体に切り替えが困難でないこ とが重要である．これを実現するためには，紙媒体と電子媒体 の媒体間での参照を容易にするインタフェースが必要である． 紙媒体から電子媒体への参照を容易にするインタフェースとし て，有坂らの研究や榎本らの研究があり，QRコード，非接触型 ICカードを利用している．しかし，彼らの手法では，電子媒体 から紙媒体への参照が考慮されていない．そこで，本研究では， 紙媒体と電子媒体の双方向での参照を容易にするインタフェー スの提案を行い，システム「MediaKenja」の実装を行う．
4.
提案システム「
Media Kenja
」
提案システムはMediaWikiを拡張して開発したWeb情報 システムである（注3）．教員・学生はシステム上にあるメディア カードの電子媒体の教材コンテンツを自由に閲覧し，自由にダ ウンロードして紙媒体に印刷することが可能であると共に，紙 媒体から電子媒体の教材コンテンツに再びアクセスすることを 容易にする．本システムの特徴として，教材コンテンツを複数 （注3）：Web 上で公開を行っている http://media.cs.inf.shizuoka.ac.jp の年度に渡って蓄積し，複数の講義にまたがって共有・再利用 可能である点が挙げられる．以下の節では，システムの構成， 関連技術，インタフェースと機能，利用の流れについて詳しく 述べる． 図 2 システムの構成 4. 1 システムの構成 本システムは，Webサーバ・クライアント構成をとってい る．図2に本システムの構成を示す．教員ユーザ・学生ユーザ は，Webブラウザを通じてシステムのクライアントにアクセ スして操作を行う．Webサーバは，クライアントのリクエスト に応じてユーザの入力データの格納や必要な教材コンテンツの 取り出しをDBサーバに要求し，MediaWikiのPHPファイル によって生成されたWebページをクライアントにレスポンス する．また，ユーザの要求に応じて，サーバ側でコンテンツの データを含むPDFファイルを生成し，クライアントにレスポ ンスする機能を組み込んでいる． Webサーバ・DBサーバ・使用言語には，MediaWikiの要 求環境に沿ってApache・MySQL・PHPを選択した．サーバ サイド処理はMediaWikiのコアファイルおよび拡張によって 追加したPHPファイル群である．クライアントサイド処理は MediaWikiのインタフェースを定義するコアファイルおよび 拡張によって追加したPHPおよびCSS・Javascriptファイル 群である．また，PHPライブラリのFPDF，外部WebAPIのGoogle Chart APIをシステムで利用する．
4. 2 システムの関連技術 MediaWiki は Web技 術 を 用 い て 文 書 を 管 理 す る ウィキ （Wiki）システムである．MediaWikiは，元々オンライン百 科事典のWikipedia（注4）向けに開発された為，大量のコンテン ツを構造化・管理する使い方に向いており，膨大な数のリクエ （注4）：http://ja.wikipedia.org
ストに耐えられるように設計されているため，大人数が利用し ても問題ない．また，開発者が独自に外観を変更したり，機能 の拡張を行ったりすることも可能である． メディアカードもまた，カード項目同士がキーワードやカテ ゴリ，著者などで結びついている，大量の断片的なコンテンツ である．また，教材を載せたシステムは，数十人規模で利用者 が同時に操作を行うことも想定される．さらに，複数の教員に よる協働的な記事の執筆は，Wikipediaにおける集合知のあり 方と軌を一にする．以上のことから，MediaWikiをシステム の基盤として採用し，スキン・拡張機能のインストール，プロ グラムの修整と追加によって機能の実装，および外観の変更を 行った． FPDF（注 5）は無償で利用可能なPHP用のPDF生成ライブラ リである．大きな特徴として，PDFのテンプレートを利用でき ること，追加のライブラリを適用して日本語が利用できること が挙げられる．提案システムでは，紙媒体から電子媒体を参照 する手段としてQRコードを採用したが，QRコードのような 画像も形式が合っていればFPDFで読み込み可能である．QR コードは2次元バーコードの一種であり，正方形の白黒のモ ザイクでデータを表現する．Google Chart API（注 6）では，QR
コードを取得するためのWebAPIを提供しており，QRコード で表現する文字列，および取得する画像のサイズに関するデー タをパラメータに指定してリクエストを行うと，PNG形式の画 像データのレスポンスを返す．単純利用する場合，APIキーは 不要で自由に使うことが可能であり，負荷分散のために10個の エンドポイントURLが用意されている．経験的に言えば，QR コードのモザイクのドットは文字列が長いほど小さくなり，生 成される画像は印刷すると粗くなりやすくなるため，カメラに よるQRコードの認識率は低下すると考えられる．MediaWiki では，日本語を含むURLが存在するため，URLエンコードし た際の文字列が指数関数的に長くなってしまい，URL全体の 文字列も長くなる．こうした日本語を含むURLの短縮方法は， 今後の課題としている．カテゴリを指定したPDFダウンロー ド機能は主にFPDFとGoogle Chart APIで成立している．
4. 3 クライアントのインタフェースと機能 本システムの機能を，クライアントのインタフェースと共に 説明する．図3，図4,図5にカードのページ，カテゴリのペー ジ，掲示板のページのインタフェースをそれぞれ示す．視覚的 なユーザインタフェースは各ページで統一している． 検索窓：タイトルおよび本文中の単語がキーワードと一致す るページの検索が可能である．キーワードを入力して「表示」 ボタンをクリックすると，検索結果ページに遷移する．入力 フォームにキーワードを入力した状態で下方向キーを押すと， 図6のように，文頭一致するカード項目のタイトルがサジェス トされる． カテゴリ欄：すべてのカードとカテゴリのページに対して，0か ら複数個のカテゴリを登録する事が可能である．カテゴリの命 （注5）：http://www.fpdf.org （注6）：http://developer.google.com/chart 図 3 カードのページ 図 4 カテゴリのページ 図 5 掲示板のページ 図 6 検索窓のサジェスト
図 7 編集状態のカテゴリ 名に規定はなく，自由に登録可能なため，いわゆるfolksonomy 的なタグ付けとなる．カテゴリの著者，メディアカードとして のカテゴリ，使用された講義名などをカテゴリとして与えるこ とで，ページのメタデータとして機能させる使い方が考えられ る．また，登録したカテゴリはカテゴリのページへのリンクに 変化するため，新しいカテゴリを作成した後にカテゴリのペー ジへ遷移して編集を開始することが容易であると考えられる． 図7は，編集状態のカテゴリ欄を表示したものである． 関連カード：現在見ているページ，またはカテゴリに関連のあ るカードを一覧で表示する．カテゴリのページの場合は，その カテゴリが登録されているカードの一覧と，カテゴリのページ に登録されたカテゴリに共通して登録されているカードの一覧 が表示される．カードのページの場合は，そのカードに登録さ れたカテゴリに共通して登録されているカードの一覧が表示さ れる． 図 8 ブラウザ上で閲覧中の PDF PDFダウンロード：カテゴリのページに設置されているボタ ンをクリックすると，閲覧中のカテゴリが登録されたカード項 目から一括してPDFファイルを生成して閲覧，保存すること が可能である．PDFファイルには，紙媒体への印刷を想定し て1枚につき1項目のカードを紙媒体用の形式で出力する．技 術的には，MediaWikiのAPIを通じてカテゴリ内のカードの データを取得し，URLからQRコードを生成し，PDFのペー ジ上に配置していくことで生成している．図8は，ブラウザ上 で生成したPDFを閲覧している様子である． 図 9 システムの利用の流れ 4. 4 システムの利用の流れ 講義における教材利用のシナリオを例に，本システムの利用 の流れについて説明する．シナリオでは，教員がシステム上に 作成したメディアカードのカード項目から一部を講義に使用し， 学生が配布された紙媒体のカード項目を元にレポートをシステ ム上に提出する流れを想定している．図5に提案システムの全 体的なイメージを示す．ユーザである教員・学生は，実際には Webブラウザの画面を見て操作を行うが，図8では具体的な データの流れを右側のサーバの欄で表現していることを断って おく． 教員は，初めにシステム上でカード項目の作成を行い，必要 に応じてカード項目の修正・更新を行う．作成したカード項目 には，カード記事の属性を表現する言葉をカテゴリとして登録 する．例えば，特定の講義で使用するカード項目には，「社会学 概論2015」のように特定の年度に開講された講義を表す単語 で，カテゴリを与えることも可能である．図中では，「カード作 成，カテゴリ作成・登録」として，「A」，「B」，「C」という仮 の名前がカードを指し，「公共空間」，「藤森雅人」，「社会学概論 2015」などの仮の名前が作成したカテゴリを指し，各カードと 各カテゴリの間を繋ぐ白の実線が各カードと各カテゴリの登録 関係を指す． 次に，目的の講義に使用するカードのダウンロードを行う． カテゴリのページからは，登録されたカード項目の一覧を確認 することができる．また，登録されたカードを一括してPDF ファイルとしてダウンロードすることができる．PDFを生成す る際，各カードにはカードのページのURLを表すQRコード が埋め込まれる．教員は，このダウンロードしたPDFファイ ルを紙媒体に印刷して，学生に配布する（図中では，「印刷・配 布」）．図中では，「カテゴリを選択してPDFをダウンロード」 として，「社会学概論2015」が選択され，「社会学概論2015」が 登録されたカード「A」，「B」を参照し，それぞれQRコード を埋め込みながらPDFファイルの生成をしたのち，クライア ントに送信する赤い点線の矢印である． 学生は，初めに配布されたカードの中から関心を持ったカー ドを選んで，Web上のカードにアクセスを行う．カードに埋 め込まれたQRコードをスマートフォンや携帯電話などのQR コード読み取り機能を用いるなどしてカードのURLを取得し， Webブラウザを立ち上げてWeb上のカードにアクセスするこ
とができる．図中では，「QRコードから一意の記事にアクセス」 として，配布された紙媒体のカードをスマートフォンで読み取 り，カード「A」参照している青い点線の矢印である． 次に，参照したカードから関連するカードの検索や，各カー ドに付随する掲示板の閲覧を行う．各カードのページでは，登 録されているカテゴリごとに，カテゴリが共通しているカード の一覧が表示される．これにより，隣接した内容のカードを探 すことを容易にしている．また，学生にもカテゴリ登録の権限 があるため，教員とは異なった視点に基づく教材のタギングが 期待できる．さらに，各カードには掲示板が設置され，カード の感想・意見・批判などを書き込むことができ，学生と教員の 間で意見交換するような使い方も可能である．これを利用して， 学生に講義資料に用いたカードの中から選択して小レポートを 掲示板に書き込ませ，教員が適宜コメントを行い議論を発展さ せていく，という発展的な使い方が考えられる．図中では，「関 連のあるカード，掲示板の参照」として，カード「A」から同 じカテゴリ「公共空間」に含まれる関連カード「C」にアクセ スし，カード「C」にカテゴリ「マスメディア」の作成と登録 を行い，さらに掲示板にアクセスする青い点線の矢印である．
