双方向型のインタラクティブな電子教材の開発

－本ページは、電子教材開発者向けのものです。－

　教材開発センターは、双方向型のインタラクティブな電子教材の開発を強力にサポートいたします。
電子教材開発のための素材（説明文章データ、静止・動画像データ、音声データ、３次元ＣＧ形状データ）は、基本的に、講義や演習を実際に行っておられる教員の皆様にご用意いただく必要があります。それらを素に、以下に示すデモ教材のような電子教材を開発する場合のノウハウや技術面についてサポートさせていただきます。例えば、学生がWebブラウザ上で教材コンテンツを見れるようにしたい、iPadやiPhoneを利用して教材コンテンツの閲覧を学生にさせながら講義を行いたい、教材を電子書籍として開発し学外に公開したい、など。このような場合がございましたら、教材開発センターにご相談ください。

  1. ３次元ＣＧを利用したインタラクティブ教材の開発

    2. 　３次元ＣＧの利用は、学習者の理解度を高める手段として有効であると考えられます。例えば、医学分野においては、３次元ＣＧ表現された詳細な人体モデルの表示と対話操作による視点の移動や拡大・縮小によって、学習者自らが理解したい情報にアクセスして学習することが可能になります。このように、従来の静止画像データからでは理解しずらい内容も３次元ＣＧ表現によって理解することが可能になると考えられます。

    ３次元ＣＧを利用した電子教材を開発する手段として、以下の方法があります。

    1. iBooks Authorの利用

      2. 　電子書籍の規格の一つとしてEPUB(Electronic PUBlication)があります。米国の電子書籍の標準団体の一つである国際電子出版フォーラムIDPF(International Digital Publishing Forum)が推進している電子書籍用ファイルフォーマットの規格です。最新バージョンはEPUB 3.0で、2011年10月10日に制定されました。日本語の縦組の仕様が追加されています。EPUB形式のファイルを閲覧するソフトウェアをEPUBリーダとよびます。EPUBファイルを編集生成するソフトウェアをEPUBエディターなどとよびます。iPadやiPodのEPUBリーダアプリであるiBooksは、EPUB 2.0に対応しています。実は、iPadのEPUBリーダアプリであるiBooksは、EPUB 2.0のほかiBooks形式の電子書籍を閲覧することができます。iBooksの規格は、EPUBをベースにしてApple社が独自拡張を行ったものです。標準的なEPUBリーダでは、３次元形状データの閲覧や対話操作ができませんが、iPadのiBooksリーダではそれらが可能です。３次元形状データを表示して、視点を移動して見たりすることができます。iBooks形式のファイルを編集生成するための専用のソフトウェアがiBooks Authorです。Mac PC(LION OSのみ)上でのみ動作します。Apple Storeから無料でダウンロードして利用することができます。

      以下は、iBooks Authorで開発中のiBooks教材の画面イメージです。当該のiBooksコンテンツのURLを画像にリンクしていますので、画像をクリックしてダウンロードできます。iPadにiBooksアプリをインストール（無料）してあれば、Webブラウザで当該のiBooksコンテンツをダウンロードしてiBooksで閲覧できます。


      iBooks教材イメージ　iBooks教材イメージiBooks教材イメージ　iBooks教材イメージ

    2. 画像転送による３次元コンテンツ表示（開発中）

      3. 　３次元ＣＧ表示を行うアプリケーションの開発には、３次元ＣＧ表示専用の関数群を利用する必要があります。関数群のことを関数ライブラリィとよびますが、広く一般に用いられているものがOpenGLとよばれるものです。これまでのWebブラウザでは、OpenGLの関数ライブラリィのネイティブサポートはありませんでした。これまでは、Webブラウザ上で３次元ＣＧコンテンツ表示を行うためには、PaperVision3dライブラリィによるFlashコンテンツとして開発する、あるいは、Java3DライブラリィによるJavaコンテンツとして開発し、FlashプレイヤープラグインやJava VirtualMachineを介して３次元ＣＧ表示する必要がありました。この場合、FlashやJava3Dに対応していないという理由からiPadやiPodでは、３次元ＣＧコンテンツが閲覧できないという問題が発生します。これらの問題を解決する方法として、Webサーバ上で３次元ＣＧ画像を生成し、その画像データをWebブラウザに転送して表示する方法が考えられます。教材開発センターでは、そのようなWebサービスのシステムと専用のWebコンテンツを開発中です。この仕組みでは、Webサーバに３次元形状データを登録しておき、対応するWebコンテンツをWebブラウザに読み込むことで、Webブラウザ上で３次元ＣＧ画像表示が可能です。WebコンテンツのJavaScriptプログラミングによって、視点の移動や拡大・縮小などの操作を実現できます。この場合も、FlashプレイヤープラグインやJava VirtualMachine等の付加機能が必要ないため、Webブラウザが稼働すれば、どのようなプラットフォーム（iOSの端末、 Android OSの端末、 Windows PC、 Mac PC)でも３次元ＣＧ表示が可能となります。ただし、ネットワークにつながっている必要があります。また、ネットワークを介してWebサーバとWebブラウザ間で画像転送を行いますので、画像転送に必要な帯域が問題となります。ネットワーク転送の負荷を軽減するようなシステムを現在、開発中です。

      以下は、男性骨格形状データを３次元ＣＧ表示するページと脳の形状データを３次元ＣＧ表示するページです。

      Aist Skeleton Model　Anatomy Brain Model産業技術総合研究所が提供しているスケルトンデータ(中村仁彦・山根克・諏訪元・近藤修・河内まき子・川地克明・持丸正明、2008：成人男性骨格形状データ（産総研H20PRO-905))を使用しています。

      各種Webブラウザで閲覧することができますが、IEではエラーになる場合があります。

    3. WebGLの利用

      4. 　HTMLの新しい規格であるHTML5では、OpenGLの関数ライブラリィがネイティブにサポートされるようになります。これがWebGLとよばれるものです。３次元ＣＧコンテンツのための形状データをWebサーバに置いておくことで、Webブラウザでそのデータを読み込み３次元ＣＧ表示させることが可能となります。Webコンテンツ用のスクリプト言語（プログラミング言語の一種）であるJavaScriptを用いたプログラミングにより、視点の移動や拡大・縮小などの操作を実現できます。このようなコンテンツの表示において、FlashプレイヤープラグインやJava VirtualMachine等の付加機能が必要ないため、HTML5をサポートしたWebブラウザが稼働すれば、どのようなプラットフォーム（iOSの端末、 Android OSの端末、 Windows PC、 Mac PC)でも３次元ＣＧ表示が可能となります。専用のアプリケーションソフトウェアは必要ありません。ただし、ネットワークにつながっている必要があります。

      以下は、WebGLを利用して３次元ＣＧ表示を行う人体アトラス"BioDigital Human"のページです。

      BioDigital Human

      HTML5のWebGLをサポートしたGoogle ChromeなどのWebブラウザで閲覧することができます。

  2. VR、 AR、 MR技術を利用したインタラクティブ教材の開発

    3. 　仮想現実感(VR: Virtual Reality)システム用の高度に没入感の得られる入出力デバイスの登場により、仮想現実感技術を利用した応用システムが実用レベルの時代に入りました。また、iPhoneなどのカメラやGPS、加速度センターなどを装備した小型で携帯に便利なスマート端末の登場により、仮想現実感技術の一種である拡張現実感(AR: Augmented Reality)技術や複合現実感(MR: Mixed Reality)技術を利用した応用システムが実用化の時代に入りました。このような応用システムを教育に利用することは、教育の質の向上と学生の学習意欲を高める手段として有効であると考えられます。

    研究開発段階ですが、以下のような教材の開発を実施しています。

    1. 仮想現実感(VR)技術を利用した教材の例

      2. 　以下は、力覚フィードバックの得られる３次元ポインティングデバイスであるPhantomを利用した手術トレーニングシステムの画面イメージです。手術の対象部位は多岐に渡るため、手術シミュレーションシステムは非常に複雑なものとなり実現が難しいです。しかし、VR技術を利用したトレーニングシステムは有用であると思われます。手術部位を３次元ＣＧ表示し、Phantomを用いて対象部位の切開や縫合のオペレーションを計算機の画面上で仮想的に行うことができます。手術の過程を学生に教えるような講義や演習において、このようなシステムを利用することにより、学生の理解度を高めることができるのではないかと考えられます。Phantomを利用することにより、メスが患部に当たったときの感覚を得ることもできます。また、予め情報を入力しておくことにより、間違った部位を切開しようとした際に警告を発するなどのアクションも可能です。

      手術トレーニングシステム

      デモムービ

      　以下は、Phantomを利用した歯科治療トレーニングシステムの画面イメージです。Phantomを利用することにより、ドリルが歯に当たったときの感覚を得ることができます。また、予め情報を入力しておくことにより、間違った歯を削ろうとした際に警告を発するなどのアクションも可能です。歯科治療の過程を学生に教えるような講義や演習において、このようなシステムを利用することにより、学生の理解度を高めることができるのではないかと考えられます。

      歯科治療トレーニングシステム

      デモムービ

    2. 拡張現実感(AR)技術や複合現実感(MR)技術を利用した教材の例

      3. 　以下は、複合現実感(MR)技術を利用した教材の画面イメージです。iPhoneやiPad等のカメラで現実の人の体の部位を撮影して、その部位に対応した人の内臓や骨の３次元ＣＧ画像を重畳表示する例です。これは、医学分野においてAR、MR技術を活用する例ですが、景色をカメラで撮影して、その場所に昔あった建物などの３次元ＣＧ画像を重畳表示するような例も考えられます。これは、歴史学や人文学などの教育に有用ではないかと考えられます。

      MR Appli No1　MR Appli No2