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


http://goo.gl/7RKq2I

http://goo.gl/GI17rG

http://goo.gl/aPlPzJ

パッケージ化と組み込み

• Widgetコンテナ– Widget一つを管理・配布するためだけのEPUB出版物

– エンドユーザに利用されることはない。

• 組み込み先EPUB出版物– コンテナから抜き出されたWidgetを組み込んだEPUB出版物

– エンドユーザに利用される。

• Widgetベース文書– WidgetのルートであるXHTML5文書。一つのコンテナにただ一つ。


Widgetコンテナのファイル構造

• /Gallery ディレクトリ: コア資源

• /sharedディレクトリ: 共有部品

• 仕様書のA.1にある例 http://goo.gl/rV4q6v


https://docs.google.com/document/d/183O0uUMmILXUrv6NeUQssUT5tn9haY65lKyTdiZ9gDg/edit

Widgetコンテナのメタデータ

• パッケージ文書にWidgetの性質を表すメタデータを置く

• 仕様書のA.2にある例 http://goo.gl/utYDNE



組み込み先EPUB出版物のファイル構造

• Widgetコンテナから取り込まれたリソースは、すべて/components/WidgetIncディレクトリにおかれる（WidgetIncは単なる例）。

• 仕様書のA.3にある例 http://goo.gl/BhsSwS



https://docs.google.com/document/d/183O0uUMmILXUrv6NeUQssUT5tn9haY65lKyTdiZ9gDg/edit?pli=1

組み込み先EPUB出版物のパッケージ文書

• パッケージ文書中のcollection要素を用いて、Widgetコンテナから取り込まれたリソースを明示する。

• 仕様書のA.4にある例 http://goo.gl/GE7a7C


https://docs.google.com/document/d/183O0uUMmILXUrv6NeUQssUT5tn9haY65lKyTdiZ9gDg/edit?pli=1

通信

• 通信機構

• 状態管理

• イベント処理

• 組み立て

• Domain local storage

• ドメインごとのローカル記憶

• アクセシビリティ

• 表示とレイアウト制御


通信機構

• HTML5 Web MessagingのpostMessageを使う

• IDPF ePub Widget Framework（オープンソース実装）https://github.com/IDPF/widgets/tree/master/CommunicationAPI


https://github.com/IDPF/widgets/tree/master/CommunicationAPI

Annotations(注釈)

• 教科書に生徒・先生が注釈をつける

• 虎の巻を、教科書への注釈として出版する

• 手書き注釈も可能

• よく聞く話、以前からある話ではある

–日本の固定レイアウトデジタル教科書でも実装されている

– ソーシャルリーディングはいまの電子書籍リーダでも実装されている。


メリットとデメリット

↑特定の電子書籍リーダに依存しない

↑標準化された形式で注釈が保存されるので、安心して使える

↓W3Cにおける標準化はまだCommunity Specificationであり、正式WGは今年発足するものと思われる。


仕様書

• 仕様書 Open Annotation in EPUBhttp://www.idpf.org/epub/oa/

• 要求仕様 EPUB annotations - use caseshttp://goo.gl/dEvSLg

• W3CのOpen Annotation Data Model(Community Draft)http://www.openannotation.org/spec/core/20130208/


http://www.idpf.org/epub/oa/

http://goo.gl/dEvSLg

http://www.openannotation.org/spec/core/20130208/

独立した注釈と埋め込まれた注釈

• 独立した注釈

–本文となる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/


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


http://goo.gl/g78hkb

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


http://www.idpf.org/epub/profiles/edu/spec/

http://goo.gl/XP56G8

固定レイアウト

• 日本から出した提案 Proposal: Fixed Layout in EDUPUB (ACCESS, ATDO, Benesse, EAST, and JEPA) http://goo.gl/5YXyxF

• IDPF仕様

– XHTMLベースのアクセシブルな固定レイアウト

–アクセシブルでない固定レイアウトにするなら、アクセシブルなリフローも一緒に格納する(Multiple Renditions)


http://goo.gl/5YXyxF

http://goo.gl/5YXyxF

リフロー: 構造と意味

• 要するにepub:type属性の値を、教育用に増やしている。

• 何の役に立つの？

1. EDUPUB用のCSSスタイルシートを共有するため

2. 編集側の部品化のため

3. EDUPUB用の閲覧システムで、epub:type属性の値をみて振る舞いを変えるため


アセスメント（テスト）

• 対話的テスト、自動採点、集計、分析など

• 基本的なプロトコルさえあればよく、あとはプログラムで書けばいいという考え方– プログラミングは大変

• プログラムではなくすべてマークアップ言語で書くという考え方– 複雑怪奇な巨大マークアップ言語

• Wilbert Kraanのセミナーで説明します。乞うご期待！


Internet

2014.07.02 EDUPUB技術の日本への適用