iPhoneのiBooks用EPUBに動画を埋め込む

July 28, 2010
epub_movie_main.jpg

iPhoneのiBooks用に動画を埋め込んだEPUBを作ってみました。

基本的に、EPUBはXHTMLとCSSで出来ているので、HTML5からも作成できます。

HTML5のソース


<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
  <head>
    <title>Movie-Sample</title>
    <link type="text/css" rel="stylesheet" media="all" href="style.css" />
  </head>

  <body>
    <h1>Rabbit Movie</h1>
    <video src="Rabbit.3gp" controls="true" autoplay="false" /> 
    <p>After Effects で作成した動画をH.264形式に保存しています。</p>
  </body>

</html>

XML構文で書いてみました。<video>タグで囲んでいるところが動画ファイルです。

動画は、以前After Effectsの勉強で作ったムービー を、Safariにも対応しているH.264にエンコードしました。

EPUB作成

EPUB作成ソフトは、「Sigil」が有名ですが、自分の使い方が悪いのか、勝手にDTD宣言を書き換えたりして不便に感じたので、「eCub」というソフトを使用しました。

「eCub 1.10」 EPUBに対応した電子書籍オーサリングソフト - builder by ZDNet Japan

メタデータを入力

新規プロジェクトを作成し、本のタイトルなどのメタデータを入力。

ディレクトリ選択

HTMLや動画データの入ったディレクトリを選択。

表紙作成

表紙も作れたりします。テンプレートもいくつかありますな。

Compile

設定が完了したら、「Compile」でEPUB作成。

zipに書き換える

ただし、これだけでは、肝心の動画ファイルがEPUBの中に入っていないので、いったん拡張子を「.epub」から「.zip」に変更後、解凍。

動画ファイルを入れる

動画ファイルをzipを解凍した「OPS」フォルダに入れます。

zip圧縮

「META-INF」、「mimetype」、「OPS」の三つのファイルを選択し、zip圧縮。
※三つ選択するところがポイント。「mimetype」を無圧縮にする関係で、親フォルダでまとめて圧縮してもEPUBはできません。

ファイル名と拡張子変更

ファイル名と拡張子を「.epub」に変更。

あとは、iPhoneをiTunesに接続し、同期させたiBooksに、作成したEPUBをドラッグコピーすれば、完成。

iBooksの画面

4Gじゃないけど。

iBooksライブラリ

iBooksライブラリの画面。

動画が埋め込まれている

動画が埋め込まれている。

動画再生画面

再生ボタンをタップすると動画がはじまる。

おまけ

iPhoneのスクリーンショットって撮れるんですね。

「スリープボタン」と「ホームボタン」を同時に押すと「カシャッ」と音が鳴って撮影できます。

STAFF_01 [KYS-LAB]: ページが見つかりません。