ibooksとmoodleの連携による本当にインタラクティブなデジタル教科書
DESCRIPTION
Moodle Moot ID 359 Presenter(s): Toshioki Soga (Faculty of Foreign Language Hokkaido Bunkyo University), Takahiro Nakahara (Sangensha LLC),Yasuyuki Nakamura (Graduate School of Information Science Nagoya University), Masanobu Mitani (Faculty of Photonics Science Chitose Institute of Science and Technology), Norihito Kawana (Department of Humanities Sapporo International University) Title: iBooksとMoodleの連携による本当にインタラクティブなデジタル教科書 Presentation type: ライトニング・トーク 5〜10分 Lightening Talk 5 to 10 mins (Academic) Topics: Moodleの統合 - Integrating Moodle, Moodleの開発 - Moodle development Keywords: デジタル教科書,iBooks,iPad,反転授業 Abstract 近年ではデジタル教科書の普及に伴い、デジタル教科書を簡単に作ることが出来る環境も整いつつある。Apple社から無償配布されているiBooks Authorは従来の文書作成ソフト感覚でマルチタッチブックを作ることが出来るアプリケーションである。本研究ではそのiBooks AuthorのHTMLウィジェットという機能を利用し、デジタル教科書とLMS、特にMoodleとの連携を実現することにより、双方向性を持ったコンテンツの開発環境の整備を行った。HTMLウィジェットはインターネット通信が可能なウィジェットで、これにMoodleサイトを埋め込むことによってMoodleの利用を可能にした。Moodleサイト側ではiBooksでの利用を考慮し、レイアウトやページ遷移のカスタマイズを行った。また、ウィジェットを作成するためのエクスポート機能を開発した。Moodleの小テストやアンケート等を適切に組み込み、成績やログの管理を行うことでデジタル教科書を使った自学自習の進捗を把握することが可能となる。また、Moodleの各種機能との組み合わせによりデジタル教科書の多様化の可能性も含んでいる。TRANSCRIPT
moodle moot japan 2014, 21 Feb, 沖縄国際大学
iBooksとMoodleの連携による本当にインタラクティブなデジタル教科書
※Toshioki Soga (Hokkaido Bunkyo University)
Takahiro Nakahara (Sangensha LLC)
Yasuyuki Nakamura (Nagoya University)
Masanobu Mitani (Chitose Institute of Science and Technology)
Norihito Kawana (Sapporo International University)
Post PC時代の教育
反転授業
スマート学習
LMS
e-Learning Game
隙間学習
MOOCs
SNS
Post PC時代の教育
❖ 教育とインタラクティブ
デールの「経験の円錐形（三角錐）」
❖ Edgar Dale, 1969
デールの「経験の円錐形（三角錐）」経験
言語的シンボル 視覚的シンボル
レコード・ラジオ・写真 映画 テレビ 展示 見学 遠示
劇化された経験 ひながた経験
直接的、目的的経験
抽象度
抽象的
現実・具体的
デール（E.Dale）による「経験の円錐」, 視聴覚メディアと教育, 山口榮一, p.29（曽我 改）
デールの「経験の円錐形（三角錐）」
言語的シンボル 視覚的シンボル
レコード・ラジオ・写真 映画 テレビ 展示 見学 遠示
劇化された経験 ひながた経験
直接的、目的的経験
抽象度
抽象的
現実・具体的
プリント
実習（demonstration）
映像
デール（E.Dale）による「経験の円錐」, 視聴覚メディアと教育, 山口榮一, p.29（曽我 改）
デールの「経験の円錐形（三角錐）」
言語的シンボル 視覚的シンボル
レコード・ラジオ・写真 映画 テレビ 展示 見学 遠示
劇化された経験 ひながた経験
直接的、目的的経験
抽象度
抽象的
現実・具体的
マルチメディア型コンピュータで映像や音楽を
受け身に聴く
デール（E.Dale）による「経験の円錐」, 視聴覚メディアと教育, 山口榮一, p.29（曽我 改）
デールの「経験の円錐形（三角錐）」
言語的シンボル 視覚的シンボル
レコード・ラジオ・写真 映画 テレビ 展示 見学 遠示
劇化された経験 ひながた経験
直接的、目的的経験
抽象度
抽象的
現実・具体的
マルチメディア型コンピュータで映像や音楽を
受け身に聴く
デール（E.Dale）による「経験の円錐」, 視聴覚メディアと教育, 山口榮一, p.29（曽我 改）
「学習者が各変数を操作したり，自ら選択肢を選んで，能動的にかかわ」る
デールの「経験の円錐形（三角錐）」
言語的シンボル 視覚的シンボル
レコード・ラジオ・写真 映画 テレビ 展示 見学 遠示
劇化された経験 ひながた経験
直接的、目的的経験
抽象度
抽象的
現実・具体的
携帯情報端末でインタラクティブに体感する
デール（E.Dale）による「経験の円錐」, 視聴覚メディアと教育, 山口榮一, p.29（曽我 改）
Demo
❖ “CSS Transforms: An Interactive Guide” ❖ Vicki Murley ❖ (“Made for iBooks”)
デジタル教科書
❖ テキストを読む：内容の理解
デジタル教科書
❖ テキストを読む：内容の理解❖ 必要に応じて映像による確認：具体的な経験（UsrEx）
デジタル教科書
❖ テキストを読む：内容の理解❖ 必要に応じて映像による確認：具体的な経験（UsrEx）❖ LMSによる確認テスト：きめ細かな授業
デジタル教科書
❖ テキストを読む：内容の理解❖ 必要に応じて映像による確認：具体的な経験（UsrEx）❖ LMSによる確認テスト：きめ細かな授業
我々のこだわり!リーダーアプリ（iBooks）内で操作が完結できる（アプリを切替えない）
反転授業などで有効
デジタル教科書
❖ テキストを読む：内容の理解❖ 必要に応じて映像による確認：具体的な経験（UsrEx）❖ LMSによる確認テスト：きめ細かな授業
担当教諭「ちゃんと予習してきたね」生徒「はーい」↓担当教諭：LMSの学習履歴で確認
iBooks Authorとインタラクティブ
“iBooks Author”, Mac App(Free) to create “Multi-Touch textbooks” for iPad.
リーダーアプリ “iBooks”（iPad, Mac）のための マルチタッチブック制作アプリケーション
and for Mac. （2013~）
誰もが簡単にデジタル書籍の制作が可能
iBooks Author
共有!（書き出し）
“.iba”ファイル “.ibooks”ファイル
iBooksへ
iBooks Author
共有!（書き出し）
“.iba”ファイル “.ibooks”ファイル
iBooksへ
XHTML
CSS
zip圧縮!拡張子”.ibooks”
EPUB
EPUB
XHTML
CSS
EPUB
zip圧縮!拡張子”.epub”
ウィジェット 様々なインタラクティブ要素を簡単に付加できる機能
ウィジェット
ウィジェット
iBooks (browser)
!!!!!!
closed
ウィジェット
HTML Widget
iBooks (browser)
internet
open
iBooks AuthorのHTML ウィジェット
周辺のリソースに影響を与えない埋込み型の機能拡張
Dashboard Widget!( “.wdgt”)
HTML ウィジェット
Dashboard Widget!( “.wdgt”)
HTML, CSS,
JavaScriptjQuery
jQuery mobile…≒
(Web App)
手軽に(プログラムレス)HTML ウィジェットを生成するサービス/アプリケーション
❖ Book Widgets: クイズなど教育関連ウィジェットを出力（App） ❖ http://www.ibook-widgets.com
❖ Bookry: クイズなど教育関連ウィジェットを出力（Web） ❖ https://bookry.com
❖ Hype: HTML5アニメーションを出力（App） ❖ http://tumult.com
❖ MotionComposer: HTML5, FLASHアニメーションを出力（App） ❖ http://www.aquafadas.com
手軽に(プログラムレス)HTML ウィジェットを生成するサービス/アプリケーション
❖ Book Widgets: クイズなど教育関連ウィジェットを出力（App） ❖ http://www.ibook-widgets.com
❖ Bookry: クイズなど教育関連ウィジェットを出力（Web） ❖ https://bookry.com
❖ Hype: HTML5アニメーションを出力（App） ❖ http://tumult.com
❖ MotionComposer: HTML5, FLASHアニメーションを出力（App） ❖ http://www.aquafadas.com
formやquiz，YouTubeへのアクセスなどインタラクティブなwidgetを生成できる。!“BookWidgets”の例
手軽にHTML ウィジェットを生成するサービス/アプリケーション
❖ Book Widgets: クイズなど教育関連ウィジェットを出力（App） ❖ http://www.ibook-widgets.com
❖ Bookry: クイズなど教育関連ウィジェットを出力（Web） ❖ https://bookry.com
❖ Hype: HTML5アニメーションを出力（App） ❖ http://tumult.com
❖ MotionComposer: HTML5, FLASHアニメーションを出力（App） ❖ http://www.aquafadas.com
本当にインタラクティブなデジタル教科書
Moodleとデジタル教科書を繋ぐ
本当にインタラクティブなデジタル教科書
Moodleとデジタル教科書を繋ぐ
+