2014.07.02 EDUPUB技術の日本への適用

EDUPUB解剖
JEPA 村田真
2014/7/2 1EDUPUB報告会3

EDUPUBを構成する領域
• Widget
• Annotation（注釈）
• Distributable Objects
• メタデータ
• 固定レイアウト
• リフロー
• アセスメント

Widget
• HTML5とJavascriptからなる対話部品
– チャート
– グラフ
• EPUB3では、Javascriptの使用を推奨はしてい
なかった。
• EDUPUBでは、教育用コンテンツでは、
Javascriptを使うしかないので、積極的に標準
化している。

特徴的な狙い
• Widgetを組み込んで、容易に対話的教科書
を作れるようにする
• 複数のWidgetをかんたん組み合わせられる
ようにする
• Widgetの管理のためのメタデータの充実

仕様書および検討中の案
• Widgets
– 全体像
– http://goo.gl/7RKq2I
• EPUB Widget Packaging and Integration
– ほとんど完成している
– http://goo.gl/GI17rG
• EPUB Widget Communication
– まだこれから
– http://goo.gl/aPlPzJ

パッケージ化と組み込み
• Widgetコンテナ
– Widget一つを管理・配布するためだけのEPUB出版物
– エンドユーザに利用されることはない。
• 組み込み先EPUB出版物
– コンテナから抜き出されたWidgetを組み込んだEPUB
出版物
– エンドユーザに利用される。
• Widgetベース文書
– WidgetのルートであるXHTML5文書。一つのコンテナ
にただ一つ。

Widgetコンテナのファイル構造
• /Gallery ディレクトリ: コア資源
• /sharedディレクトリ: 共有部品
• 仕様書のA.1にある例 http://goo.gl/rV4q6v

Widgetコンテナのメタデータ
• パッケージ文書にWidgetの性質を表すメタ
データを置く
• 仕様書のA.2にある例 http://goo.gl/utYDNE

組み込み先EPUB出版物のファイル構
造
• Widgetコンテナから取り込まれたリソースは、
すべて/components/WidgetIncディレクトリに
おかれる（WidgetIncは単なる例）。
• 仕様書のA.3にある例 http://goo.gl/BhsSwS

組み込み先EPUB出版物のパッケージ
文書
• パッケージ文書中のcollection要素を用いて、
Widgetコンテナから取り込まれたリソースを
明示する。
• 仕様書のA.4にある例 http://goo.gl/GE7a7C

通信
• 通信機構
• 状態管理
• イベント処理
• 組み立て
• Domain local storage
• ドメインごとのローカル記憶
• アクセシビリティ
• 表示とレイアウト制御

通信機構
• HTML5 Web MessagingのpostMessageを使う
• IDPF ePub Widget Framework（オープンソース
実装）
https://github.com/IDPF/widgets/tree/master
/CommunicationAPI

Annotations(注釈)
• 教科書に生徒・先生が注釈をつける
• 虎の巻を、教科書への注釈として出版する
• 手書き注釈も可能
• よく聞く話、以前からある話ではある
– 日本の固定レイアウトデジタル教科書でも実装さ
れている
– ソーシャルリーディングはいまの電子書籍リーダ
でも実装されている。

メリットとデメリット
↑特定の電子書籍リーダに依存しない
↑標準化された形式で注釈が保存されるので、
安心して使える
↓W3Cにおける標準化はまだCommunity
Specificationであり、正式WGは今年発足する
ものと思われる。

仕様書
• 仕様書 Open Annotation in EPUB
http://www.idpf.org/epub/oa/
• 要求仕様 EPUB annotations - use cases
http://goo.gl/dEvSLg
• W3CのOpen Annotation Data
Model(Community Draft)
http://www.openannotation.org/spec/core/2
0130208/

独立した注釈と埋め込まれた注釈
• 独立した注釈
– 本文となるEPUB出版物は別にある
• 埋め込まれた注釈
– 本文と同じEPUB出版物に含まれる

JSON LDによる表現
{
"@context": "http://www.idpf.org/epub/oa/1.0/context.json",
"@id": "http://example.org/epub/annotations.json",
"@type": "epub:AnnotationCollection",
"annotations": [
{
"@id": "urn:uuid:B81AF8C4-B04A-4D3D-B1D3-23F7C02E56BB",
"@type": "oa:Annotation",
"motivatedBy": "oa:replying",
"hasTarget": "urn:uuid:E7E3799F-3CD5-4F69-87C6-5478B22873D6",
"hasBody": {
"@type": "dctypes:Text",
"format": "application/xhtml+xml",
"chars": "<span xmlns='http://www.w3.org/1999/xhtml'>I agree!</span>"
}
}
]
}

仕様書にある15の例
• Commentary Annotation on Publication with URI
• Commentary Annotation on Publication without Identifying URI
• Collection Metadata
• Annotation Provenance
• Annotation with Ancillary Resources in the Zip
• Reading Location Bookmarking
• Text Selection Highlighting
• Commentary on Text Selection
• Specifying a Rendition
• Annotating Multiple Targets
• Styling of Selection
• Styling of Comment
• Tagging
• Specifying Intended Audience(s)
• Replying to an Annotation

参考資料（日本語）
• 日本よっ！これがOpen Annotationだっ！！
http://code.kzakza.com/2013/08/open-
annotation_data_model/

EPUB Distributable Objects
• 教材の一部を再利用するため
– 例: 教科書の図を、問題集にも入れる
– 例: 本Aの一章と本Bの二章だけを、あるコースの
教科書とする。

仕様書
• 要求仕様 Discrete Entities in Educational
Content http://goo.gl/g78hkb
• 仕様書 EPUB Distributable Objects
http://goo.gl/Z3A3gs

技術内容
• 元のEPUB出版物中でのdistributable object
の表現
• 組み込み先出版物中でのdistributable object
の表現
• メタデータ
– Dublin Core
– アクセシビリティ

MathML数式とイメージとからなる
distributable object
<collection role="distributable-object">
<metadata>
<dc:title>Learning Object 1</dc:title>
<dc:identifier>urn:uuid:5856b480-e1be-11e3-8b68-0800200c9a66</dc:identifier>
<dc:creator>Object Author</dc:creator>
<dc:language>en</dc:language>
<meta property="schema:typicalAgeRange">9-11</meta>
<meta property="schema:accessibilityFeature">mathml</meta>
…
</metadata>
<collection role="manifest">
<link href="images/mathml01.gif" media-type="image/gif"/>
<link href="css/epub.css" media-type="text/stylesheet"/>
<link href="css/mathml.css" media-type="text/stylesheet"/>
</collection>
<link href="xhtml/chapter01.xhtml#learningobject01"/>
</collection>

メタデータ
• 見つけやすくすることが目的
– 生徒用？先生用？
– 学習に要する時間？
– 対象年齢？

Schema.orgの利用
• Schema.orgとは
– Google、Yahoo!、Microsoft3社が共同で始めた、
検索結果に詳細情報を反映するためのメタデー
タ標準化イニシアティブ
• EPUB publication documentでSchema.orgのメ
タデータを指定する
– 教育用メタデータ
– アクセシビリティメタデータ

仕様書
• EPUB 3 EDUPUB Profileの9章
http://www.idpf.org/epub/profiles/edu/spec/
#h.nsjfhxwfp3rp
• Schema.org Metadata Integration Guide for
EPUB 3 http://goo.gl/XP56G8

固定レイアウト
• 日本から出した提案 Proposal: Fixed Layout in
EDUPUB (ACCESS, ATDO, Benesse, EAST, and
JEPA) http://goo.gl/5YXyxF
• IDPF仕様
– XHTMLベースのアクセシブルな固定レイアウト
– アクセシブルでない固定レイアウトにするなら、ア
クセシブルなリフローも一緒に格納する(Multiple
Renditions)

リフロー: 構造と意味
• 要するにepub:type属性の値を、教育用に増や
している。
• 何の役に立つの？
1. EDUPUB用のCSSスタイルシートを共有するため
2. 編集側の部品化のため
3. EDUPUB用の閲覧システムで、epub:type属性
の値をみて振る舞いを変えるため

アセスメント（テスト）
• 対話的テスト、自動採点、集計、分析など
• 基本的なプロトコルさえあればよく、あとはプログラム
で書けばいいという考え方
– プログラミングは大変
• プログラムではなくすべてマークアップ言語で書くとい
う考え方
– 複雑怪奇な巨大マークアップ言語
• Wilbert Kraanのセミナーで説明します。乞うご期待！

2014.07.02 EDUPUB技術の日本への適用

More Related Content

More from Japan Electronic Publishing Association

2014.07.02 EDUPUB技術の日本への適用