2016 Volume 14 Issue 6 Pages 196-198
We developed an AR molecular graphics application for chemical education at secondary level. Flash which can execute on all platforms is used as a programming language for software development for smartphone, which the possession rate of which in junior and senior high school students is high. By developing and mounting the AR function, students can examine molecular graphics in 3D or when they look at a marker printed in a text or a handout just to read. To develop the web interface for making molecular data, the teacher can use molecular graphics in 3D easily when necessary.
若年層の理科離れが問題化して久しいが，サイエンスアゴラ等の科学イベントでは，科学に関する実演や体験に多くの児童生徒が集まり，目を輝かせて興味をひかれている様子が見られる [1]．
しかし，このような演習を，通常の授業で日常的に行うのは困難である．中等教育における化学教育においては，実際にCPK模型を利用したり，パソコンを利用して3次元の分子グラフィックスを用いる試みも行われているが，通常の授業には取り入れることは困難である．教員にとっては， 個人のITリテラシーに依存する部分も多い上に，授業で利用する際にはコンピュータ実習室の確保や移動，ソフトウェアのインストール作業やコストが必要になる．学校間でのICT設備の違いも依然として大きい [2]．また，学生にとっては，見るためのパソコンと専用のソフトウェアが必要になるため，通常の授業および家庭での学習時間に利用することが難しい．また，高校生のパソコン利用率がかなり低いことも自学習の障壁となり得る [3]．
そこで我々は，これらの問題を解決すべく，中等教育向けの3次元分子グラフィックス・システムを中心とした，クラウド型化学教育コンテンツ提供システムの開発を行っている．今回はまず，現在Web上で最も普及しているマルチメディア・プラグインであるAdobe社のFlashを用いた，分子グラフィックス表示アプリケーションを開発した．そしてこれをベースとし，スマートフォン(タブレットPCも含む)向けのAR (Augmented Reality)分子グラフィックス表示アプリケーションを開発する．これにより，学生は最も身近にある自身のスマートフォン(高校生の所有率99.0％ [4])を用いて，必要な時に見たい分子グラフィックスを見ることが可能となる．また，教員は設備やITスキルに関係なく，最小限の操作・手順で見せたい分子グラフィックスを授業等で利用することが可能となる．
今回のアプリケーション開発においては，パソコン，スマートフォンとタブレットPCの主要OSでの動作を可能とすべく，Flashを用いた．これをプラットフォームとして利用する理由は，以下の3点である．(1)ラインタイムライブラリであるAdobe AIRを用いることにより，パソコンと主要なスマートフォン用OSであるAndroidとiOSで動作可能となるため，開発の時間とコストを軽減できる．(2)生成したFlashコンテンツは，画像や動画などの単独のインタラクティブなコンテンツとしてWebページやプレゼンテーションソフトへの埋め込みが可能である．(3)コミュニケーションサーバとの連携により，リアルタイムでのユーザ間のデータ連携が可能である．
本システムの開発にはFlashの統合開発環境であるFlashCS6を用いた．3次元グラフィックスライブラリとしてPapervision3D [5]を，ARライブラリとしてFLARToolKit [6]を用いた．データの生成と保存，同期を行うサーバは，一般的なWebサーバを用い，Web言語としてPHPを用いて構築した．
本アプリケーションは我々がこれまで開発してきたシステム [7,8,9]をベースとして開発した．今回開発に用いるFlashは，3次元グラフィックスへの対応はしているものの，元来2次元のベクタグラフィックスの取り扱いが主であった．そのため，描画するオブジェクト数が多くなる分子グラフィックスを扱うには，描画速度の問題がある．原子数が数十程度の低分子のBall– and − Stickモデルの表示，回転等は全く問題がなく実行できたが，原子数が数百程度のタンパク質のBall-and-Stickモデルを表示させたところ，表示はできるものの，回転させるとフリーズすることがわかった．この問題に対しては，分子の結合部は3次元のシリンダでなく，単純な線を用いることにより，描画品質を大きく落とすことなく，描画速度の向上を図ることができた(Figure 1)．また，回転時は，3次元の表示ではなく，ワイヤフレームでの表示を用いることにより，マウスや指の動きにリアルタイムに追従させるようにした．
Molecular bond drawn in 3D (a) and in 2D (b).
その他，スワイプによる回転や，ピッチイン，ピッチアウトによる拡大縮小など，スマートフォンの基本操作に準拠させた．
ARは印刷されたマーカと呼ばれる図形をWebカメラ等で写し，画像認識させることにより，実写画面上にCGを合成する技術である [10]．同様の仕組みとして，QRコードが普及しているが，これはコードの向き認識ができないことや，保持できるデータ量の制限などの問題がある．
今回はアプリケーションにAR機能を取り入れ，スマートフォンでテキストやプリントに印刷したマーカを読み取り，分子の3次元グラフィックスを表示する機能の開発と実装を行った(Figure 2)．アプリケーションの実行は，分子の立体構造データと対応するマーカのデータをアプリケーションに持たせるため，スマートフォン単体で行うことができる．
Molecular graphics displayed over the marker.
分子の表示はマーカの向きに対応させているため，端末もしくはマーカを動かすことにより，分子を回転させることが可能となっている．また，一度認識させた分子を，取り込み，マーカなしで表示や回転，表示形態の変更を行う機能を付加した．これにより一度表示した分子は，マーカなしで詳細に見ることができるようにした．その他，同時に複数のマーカの読み込みと分子グラフィックスの表示を行う，マルチマーカ対応機能も有する．
表示に用いる分子とマーカのデータは,分子のデータファイルをWebブラウザ上から読み込ませるだけで生成することができる．このサーバと学生側のアプリ―ションをインターネット経由で同期させることにより，常に最新の状態にしておくことを可能とした．現時点で対応している分子のデータファイルは， Molda形式とPDB形式となっている．
本研究では，中等教育における化学教育での利用を目的とした，Flashを用いたスマートフォン(タブレットPCも含む)向けの分子グラフィックス表示アプリケーションを開発した．これに，AR機能を付加することにより，印刷物から直接分子の3次元グラフィックスを見ることを可能とした．これにより，身近な機器と最低限の操作で，学生が必要な分子を容易に見る事を可能とした．また，教員向けには，Web上で分子やマーカのデータを容易に作成し，スマートフォンとのデータの自動同期機能を行うシステムを開発した．これにより，教員のITスキルや教室設備に依存することなく，教員が見せたい分子の3次元グラフィックスを，通常の授業に取り入れることを容易にできると考えられる．
現在の課題はスマートフォンでの動作速度が遅く，AR機能で分子量数百程度のタンパク質分子を読み込むと，非常に動作が遅くなってしまうことが挙げられる．これに関しては，3Dのライブラリの変更や，表示アルゴリズムの改善等で対応したい．また，マルチマーカ機能についても，複数の分子の比較観察等の学習機能実装が必要であると考えている．
今後は，今回開発したシステムをベースとし，分子グラフィックスシーンの共有機能等の開発と実装を行い，ユーザテストによる機能とインターフェース改善を行う．その後，中等教育の現場での運用実験を行い，システムの一般公開する予定である．
本研究の一部は，平成27年度科学研究費(課題番号26330402)の助成により成された．
