2012年02月24日

iBooks AuthorのDashcodeウィジェットサンプルをダウンロードしよう

 iBooks Authorがいままでの電子書籍と全く異なっているのは、書籍内部にアプリを埋め込みできることにある。Dashcodeウィジェットである。ウィジェットメニューでは「HTML」と書かれているので、一般的にはHTML5のことと紹介されているが、正確にはHTML5とJavaScriptで作成したアプリを取り込みできるのである。

  もともとDashcodeはiPhoneやiPadのWebアプリ開発環境である。iPhoneやiPadではFlashは使えないので、その代わりのものがDashcodeだと考えてもそそれほど間違ってはいないだろう。DashcodeではHTML5とJavaScriptを使う。ブロジェクトの作成時にSafariを選択するとWebアプリになり、Dashboardを選択してウィジェットを作成するとアプリになる。DashcodeはDeveloperフォルダ内に置かれている。

 iBooks Authorをリリースされて、Web上にDashcodeウィジェットのサンプルも多くみられるようになった。実際、iBooks AuthorのDashcodeウィジェットでどのようなことができるのかは、これらのサイトからサンプルをダウンロードしてiPadにインストールしてみることだ。

 もっともシンプルなサンプルは「HTML5 for Dashcode」で、移動可能な部品や線で結ばれたサンプルがダウンロードできる。Dashcodeのプロジェクトファイルも用意されているので、Dashcodeの中味も覗くことができる。ダウンロードできるのはウィジェットファイルなので、iBooks Authorに貼り込んでiPadにダウンロードが必要だ。

120224-01.gif
*「HTML5 for Dashcode」の説明とダウンロードページ。

 Dashcodeではマップをアプリ化できる。その機能でGoogleの地図を取り込んだウィジェットが「iBook Authorに地図を取り込めるか?」というサイトにあるサンプルだ。ただし地図は取り込まれるが、記事にあるように完全には動作しない。

120224-02.gif
*Dashcodeで「マップ」を選択する。

 地図については古籏一浩さんがASCII.jpに連載しているJavaScriptラボ(第81回 iBooks AuthorでHTML5の電子書籍作ってみた)にサンプルデータがあり、ウィジェットでGoogleマップをそのまま表示させている(iBooksのサンプルデータ23ページ)。JavaScriptラボのサンプルには、地図だけでなく、HTML5の音声の再生やJavaScriptで動作する時計のウィジェットも収録されている。

 iBooks Authorではクイズは練習問題ウィジェットで可能だが、Dashcodeウィジェットでも作成可能だ。練習問題ではカスタマイズしにくい部分もDashcodeで作成すれば解答の表示などもカスタマイズ可能だろう。「iBooks2(iBook Author)向けクイズ」というサイトに見本がある。QuizGeneratorというソフトで、次期バージョンではウィジェット形式での書き出しも可能になるようだ(ダウンロードしたサンプルはうまく動作しなかった)。

 ゲームのサンプルもあった。「iBooks Authorでウィジェットメインの本(?)を作ってみた」という櫻吉清さんのサイトにある。記事の最後に「archive」というリンクがあるので、各種のファイルをダウンロードできる。

 「iBooks AuthorのHTMLウィジェットの作り方」というサイトではiPadZineから「iBooks 2でメモアプリというウィジェットがダウンロードできる。残念ながらiPadからダウンロードするしかないうようだ。iBooksを終了してもメモは保存できるとのこと。別ウィンドウではなく、ウィジェットウィンドウをフロートさせてメモができれば面白いが、現在のiBooks Authorの機能では無理かも。

120224-03.gif
*メモ書きウィジェットの解説ページ。

 最後は、ウィジェットで再現するパノラマVRコンテンツを紹介しよう。「チュートリアル:iBook Authorで、iBooksの中にパノラマVRコンテンツを埋め込む方法」というページの最初にある「iBooks」のアイコンをクリックすると「ibooks」のサンプルをダウンロードできる。PanotourProというパノラマ専用ソフトを使うらしい(有料のソフトでリンク先の価格は税込44,800円)。Dashcodeを使うのではなく、PanotourProからiBooks用のウィジェットファイルを直接書き出す。

120224-04.gif

120224-05.gif

120224-06.gif
*iPadにダウンロードしてサクラの木とその左右をVRしてみた。

 というわけで、ググっていくつかのウィジェットサンプルをダウンロードしてみた。まだまだ漏れているサンプルも多々あると思うが、ウィジェットではかなりいろいろなことができそうである。iPadをお持ちの場合は、一度ダウンロードして動作を確認して欲しい


◆HTML5 for Dashcode
http://sazameki.jp/html5dash/


◆iBook Authorに地図を取り込めるか?
http://d.hatena.ne.jp/iRSS/20120120/1327060664


◆iBooks Authorで作成したJavaScriptラボ第81回のiBooksデータ
http://www.openspc2.org/HTML5/iBooks/081/


◆iBooks2(iBook Author)向けクイズ
http://quizgenerator.net/2012/02/ibook2_supported/


◆iBooks AuthorのHTMLウィジェットの作り方
http://wakufactory.jp/densho/iBooks/


◆iBooks2 ウィジェットアプリテスト1[iPadZine]
http://www.ipad-zine.com/b/1411/


◆チュートリアル:iBook Authorで、iBooksの中にパノラマVRコンテンツを埋め込む方法[QTVR Diary]
http://bit.ly/x3lBkt


◆ヒラギノに差し換えた「基本」テンプレートのお申込はこちらから
http://www.incunabula.co.jp/ebook/apply/


◆これだけでできるiBooks Author作成ガイドブック入門編
http://bit.ly/AeTPX6


 


posted by @jink0222 at 19:55 | Comment(0) | TrackBack(0) | iBooks Author | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック