Showing posts with label iBooks Author. Show all posts
Showing posts with label iBooks Author. Show all posts

Thursday, April 23, 2015

Footnotes and Endnotes in iBooks Author




wordcloud for endnotes
Introduction.
In a riff on the most famous foot-noter of all (Edward Gibbon, “The History of the Decline and Fall of the Roman Empire” | Wikipedia | Gutenberg), Stanford alum Bruce Anderson delightfully chronicles “The Decline and Fall of Footnotes” only to conclude:
More than anything, Gibbon should make us rethink our attitude toward footnotes and the attendant deathwatch. The emphasis in our schools has been to replicate the form rather than the content or style of a good footnote. We should remember that reading Gibbon without the footnotes is like listening to Mozart without the 16th notes; the music of each lacks its distinctive, ineffable magic when the little notes are taken away.

Ideally, footnotes are also a graceful acknowledgement that today's community of scholars is linked to and dependent on yesterday's community. As Sir Isaac Newton modestly noted in a letter to Robert Hooke, "If I have seen further [than you and Descartes] it is by standing upon the shoulders of Giants.” If Newton can be so generous, it should be easy for the modern scholar to acknowledge his or her intellectual debts.

The very word "scholar" has its root in the Latin "schola" or "school" and bespeaks a community or network of people striving together for understanding. "Footnotes are reminders that scholarship is an intrinsically communal enterprise--building on, revising or replacing the work of predecessors," noted Kenneth L. Woodward in Newsweek. Scholars are not "Lone Rangers, going it alone."

Still, footnotes and endnotes in paper documents are a source of pain and suffering to readers and authors alike. Perhaps the digital era will bring relief.
The problem with notation in paper documents?
Except for their location in a document, footnotes and endnotes are both used to achieve one or more of the following four objectives:
  • To acknowledge the words and work of other authors - without attribution, it’s plagiarism.
  • To provide authority for assertions of fact and law.
  • To provide support for arguments or points of discussion.
  • To provide additional information or references which may be of interest to the reader but which are not central to the main text.

These are important and necessary, especially in academic writing.

Because footnotes and endnotes in paper documents are physically separated from the text that they refer to, readers require help in correctly connecting them. This is usually done using matching pairs of superscripted numbers, asterisks or other symbols. One appears at the end of the word, phrase or block quote to which the note refers. The other appears to the immediate left of the note at the end of the page (footnote) or to the left of each item in a list of notes at the end of the book or chapter (endnotes). Given the 500 year history or print, this is apparently the best that can be done with paper and probably why Noel Coward quipped that, “Coming across a footnote is like going downstairs to answer the doorbell while making love.” (It is peculiar that footnotes should so often bring amorous intimacies to mind. The historian Philip Guedalla once remarked that Edward Gibbon lived out most of his sex life in his footnotes. [from Bruce Anderson, cited above])
The promise of notation in digital documents.
Because the modern eReader must contend with different orientations (portrait vs landscape) and a wide range of variously sized viewports, it would be quite difficult to develop a skeuomorphic rendition of traditional footnotes in documents that will only be read on digital devices. This calls for a change in our nomenclature. Hereinafter, we use the term “author note” to refer to the things that help digital authors pursue any of the four objectives enumerated above. The “author” qualifier is needed in order to distinguish their notes from the reader notes supported in many eReaders such as the iBooks app..
The advent of ePub 3.
Under the
EPUB 3 standard, author notation is handled via a pop-up that is invoked by the reader tapping on hyperlinked text. Thus, the context and association of such notation is much clearer to the reader without being as much of a distraction as a paper-based footnote would be. A popup note in an ePub 3 document may look like this in the iBooks app:

Pop-up Notes in EPUB 3

Although superscripted numbers are used in the image above (screenshot taken from Apple’s “”Flowing Example 3.1), there is no need to do so. Because any text string can be used as the hyperlink that will invoke a notational pop-up. Using something longer such as “NOTE” or “REFERENCE” would certainly make it easier for readers to accurately tap these links.

On Tuesday, May 22, 2012, Apple sent out an email to its iTunes Connect mailing list that included the following paragraph:
EPUB 3 Support
iBooks and the iBookstore now support EPUB 3 for flowing books. EPUB 3 includes new features to enrich your book including the pop-up footnote functionality.


In this context, the term “footnote” is a bit of a misnomer. The ePub 3 popup note in the iBooks eReader has nothing to do with the foot of a page. These are author notes. Apple probably reasoned that this skeuomorphic example would be more easily grasped, at least initially.

Pop-up author notes are a good thing for readers in that they are now so much more easily and conveniently accessed. No longer must we correlate small superscripted numbers in the text with notes that appear at the bottom of the page (footnotes) or, worse, at the end of the book or chapter (endnotes). This is such an elegant alternative that I think we can conclude that footnotes and endnotes have been rendered obsolete by these new author notes and, thus, have no legitimate place in digital documents.
So how does one include author notes in an iBooks Author project?
The Books Author application currently has no explicit provision for any kind of notation, modern or otherwise. There is no clearly developed and labeled way for an author to pursue any of the four purposes of author notation enumerated above.

Consequently, users of the iBooks Author application have resorted to various workarounds that attempt to achieve some semblance of the author notation functionality readily available in ePub 3. Some of these methods are better than others but none are as good as a purpose-built author notation function by Apple could be. Some of the more popular of these workarounds include:
  • Using the Pop-Over widget to simulate ePub 3 style popup note.
  • Using the hyperlink function to create a round trip endnotes experience
  • Re-purposing the Glossary
  • Re-purposing Bookmarks

Taking these in reverse order, the two re-purposing tactics are bad ideas because doing so precludes their conventional use and conflicts with common reader expectations. As well, we have better options.

While endnotes are familiar, they are generally disliked by readers because using them is such a distraction. A digital implementation of endnotes can ease some of that pain with carefully constructed hyperlinks but the reader must still click through a unique round-trip path in order to maintain their “place.” Many readers simply ignore the endnotes. Here, too, we have better options.

The best available workarounds make use of the iBooks Author Pop-Over Widget. Here are two ways to use the Pop-Over widget to implement author notes in iBooks Author. As we’ll see, each has a unique set of pros and cons. The hope of this blog post is that one or the other or both will tide you over until Apple provides something better.
The visible graphic method:

visible graphic.002

Create a small graphic image that is wider than it is tall. It could be an icon (thought bubbles are popular) or an image of text as shown. I use “NOTE” but it could just as well be CITATION, EXAMPLE, REFERENCE, etc. as long as your convention is consistently applied throughout your book. Using all caps and sharply contrasting colors will also help the reader notice and understand what their options are. The example pictured is 54 x 28 pixels.

visible graphic.003
In landscape mode, go to the page where you want to place the “hot spot” that will invoke the author note and select the pop-over widget from the widgets menu.
visible graphic.004

Drag and drop the small text image onto the pop-over widget.
visible graphic.005


Insert the text and images that constitute your citation, reference, note etc. Note that the pop-over widget supports text, images and hyperlinks. Webpage hyperlinks enable external references. Internal hyperlinks can transport readers to a chapter, section, page number or any figure in the book but reader “place keeping” can become a thorny issue.
visible graphic.006

With the pop-over image selected, open the Wrap pane in the Inspector, uncheck "Object causes wrap" and use "Inline (moves with text)" for Object Placement.
visible graphic.007

Drag the pop-over image to where you want it to appear, adjust and resize it (smaller) so that surrounding text formatting is not disrupted. Presenting the reader with a more easily tapped target can only be done by making this image wider. Height will be very constrained. It may be necessary to add spaces to separate this graphic from surrounding text.
visible graphic.008


Close-up. The image is now 29 px wide by 15 px high.
visible graphic.009

Landscape orientation. This will work in all orientations and will be impervious to subsequent text editing because the image will follow the text.  Due to its small size, it may be difficult for some readers to tap accurately the first time.

visible graphic.010
Portrait orientation.

Pro: this works in either portrait or landscape orientation
Pro: this is not affected by subsequent editing
Con: the “hot spot” thus created may be difficult for some readers to tap accurately.
The invisible graphic method:

invisible graphic.002

Create a small, square graphic image. Use any solid color. I am using a black square *.png file that is 64 x 64 pixels.
invisible graphic.003

In landscape mode, go to the page where you want to place the “hot spot” that will invoke the author note and select the pop-over widget from the widgets menu.
invisible graphic.004

Drag and drop the small, solid color image onto the pop-over widget.
invisible graphic.005

Insert the text and images that constitute your citation, reference, note etc. Note that the pop-over widget supports text, images and hyperlinks. Webpage hyperlinks enable external references. Internal hyperlinks can transport readers to a chapter, section, page number or any figure in the book but reader “place keeping” can become a thorny issue.
invisible graphic.006


Add text that will serve as the “trigger” to this effect. In this example, I use [NOTE]. This could be anything: CITATION, EXAMPLE, REFERENCE, etc. as long as your convention is consistently applied throughout your book. Using all caps and a different text color will also help the reader notice and understand what their options are.

invisible graphic.007

With the pop-over image selected, open the Wrap pane in the Inspector, uncheck "Object causes wrap" and select “Floating (doesn’t move with text)” for Object Placement.

invisible graphic.008

Drag the pop-over image on top of the [NOTE] text just created so that it is completely obscured. This will be the “hot spot” that invokes the pop-over author note.
invisible graphic.009

With the pop-over image selected, use the Graphic pane of the Inspector to set the opacity of the pop-over graphic to zero. This will create the illusion that tapping on the target text invokes the author note.
invisible graphic.010

Now, clicking on the text string “[NOTE]” appears to invoke the author note pop-over. This is easily done because the invisible hot spot is large enough so that even the most “fat fingered” readers can still succeed in making the author note appear. That is, in landscape mode.

invisible graphic.011

This does not work in portrait mode. I’ve reset the opacity of the hot spot to 100% so that the movement of this otherwise invisible element away from the text “trigger” is apparent. This breaks the illusion. It is not currently possible to have a pop-over graphic this large and set to Inline (moves with text) …
invisible graphic.012

… that does not disrupt formatting.
invisible graphic.013


Thus, one should disable portrait mode in the inspector document pane.

Pro: the footprint of the “hot spot” thus created can be much larger than the “target” text making it easier for readers to invoke an author note.
Con: this only works in landscape mode (portrait mode needs to be disabled)
Con: subsequent editing can mis-align hot spot and target.
These are the best workarounds I’ve been able to come up with but they both suffer from the fact that the “trigger” is a graphic object that was not designed to work with text. Text, of course, is what author notes always refer to.
Identifying the best solution:

Authors should not have to choose between readability and thorough exposition. As well, the reader should not have to struggle to keep their place. The Noel Coward quip needn’t be uttered or even thought of in the digital era.

First, we consider what the reader’s experience should be like and then we can turn our attention to ways and means to achieve it. One thing is already clear. Authorial notes should be hyperlinked text, not graphic elements.
… what should the reader experience be:

The reader should …
… never loose their “place” when opting to find out what an author note has to say to them.
… be able to easily invoke an author note with a single operation regardless of screen size or orientation
… easily recognize an author note and be able to differentiate it from other kinds of hyperlinks
… be able to easily see what kind of authorial note it is in advance (this also speaks to accessibility requirements).
• citation or reference - reference to source (enables location and verification)
• discussion - supporting facts and reasoning (in greater depth than main text)
• supplement - information or references facilitating further, in-depth study
• example - case study, anecdotal information, etc.
• evidence - tables/charts corroborating assertions in main text
• aside - interesting or amusing corollary information
• etc.
… be able to select and copy all content in author notes to be used elsewhere (e.g. reader notes, further study, research, etc.).
… how can Apple help authors meet these needs?

The pop-up used in ePub 3 and the pop-over used in iBooks Author provide the ideal solution for assuring reader place holding while consulting author notes. As text-based hyperlinks, the author may employ a number of textual conventions to make it more easily recognized and invoked. With a pop-up, place holding and utility are assured because it appears in context and is easily dismissed. As text, the hyperlink will flow and respond to changes in font face, size and style. Color may be controlled in the template as is the case other types of hyperlinks.

There are already six different types of hyperlinks in iBooks Author as follows:

Web Page (URL)
Email Message (To: address, Subject)
Bookmark (Name)
Figure (In: Entire Book/Chapter, Style [9])
Chapter or Section (auto listed)
Page (type page number)

Proposed is a seventh type of hyperlink, the author note:

Author Note (no parameters, pop-up fully editable)

This pop-up should accept text, images and selected widgets (Gallery, Media, Keynote, 3D and HTML) and include full screen options where appropriate.

The reader will be able to select and copy text in an author note for use in verifying citations, re-purposing data, etc. Readers could incorporate some or all of this information in their Reader Notes and, because those can generate flash cards, incorporate that into their study routine. Hyperlinks to web-based references can be copied as well as followed. Returning from Safari to iBooks maintains the reader’s “place.”

For scholars of every stripe, from student to tenured full professor, this is a much more productive environment.
The problem of differentiating hyperlinks.

With seven different types of hyperlinks, how is the reader to know in advance what kind of hyperlink it is and, in the case of author notes, what the purpose of that author note might be. Presently, the reader has only the color of the hyperlink to go on and several hyperlinks use the same color in many templates. Clearly, the reader needs more than this.

Of course the author could implement conventions in a multi-touch book that provide readers with this needed information. For example, all hyperlinks could use square brackets to enclose explicitly titled hyperlinks such as the following examples:
[author note: citation for this block quote]
[author note: hyperlink to original source]
[author note: 3D model of xyz molecule]
[author note: HTML widget: opinion poll]

[web page: in-depth info on xyz molecule]
[chapter 2, section 1: examples of recursive routines]

Another, possibly better, approach would be to implement alternate text and title (tool-tip) text for hyperlinks in multi-touch books just as with images and hyperlinks in web pages. In this case, iBooks Author would present a user interface for author notes and other hyperlinks that would include fields for alternate and title text. Sighted readers would tap and hold the hyperlink to see tooltip-like title text whereas visually impaired readers would hear the alt text read to them and have the option of following the hyperlink or not.
The problem of one-way hyperlinks.
Although this isn’t an issue with the proposed author notes hyperlink because that hyperlink uses an in situ pop-up or with web page hyperlinks because the Safari handoff always returns to the point or origin, other kinds of hyperlinks (figure, bookmark, chapter or section, pages) cause place holding and user interface consistency issues by failing to provide for round-trip passage. Once transported to another part of the book, the reader has no way to return the reader to where they were.

Authors can engineer a round-trip experience with these problematic hyperlinks if and only if there is but one link to that other place in the book. In that case, the author can create a hyperlink back to the originating page. However, if there is more than one hyperlink to that specific other place in the book, the author cannot know which link brought the reader there and, so, cannot devise a return path.

A possible solution to this is to have yet another new kind of hyperlink, the Return hyperlink. Whenever a one-way hyperlink is used, the author is additionally prompted to create a Return link at the destination by entering the text of that Return hyperlink.

In the iBooks app, tapping a Return hyperlink will consult the history file identifying the last hyperlink used and return the reader there.
The problem of un-hidden resource pages.

For some books, the author wishes to provide resources that can only be accessed from a certain place in the book. The information presented might be confusing or difficult to understand if it is encountered out of context.

Hidden pages that can only be accessed via a hyperlink would help the author avoid this unwanted outcome. A Return link would be absolutely essential less the reader become stranded on a hidden page.

Such a feature could be an effective alternative to pop-up author notes where the author has a great deal of additional content to share with the reader.

Placing a suggested reading page on a hyperlinked hidden page might be useful as a way to postpone the readers interaction with it until after the content exposition has been largely or mostly completed.
Summary of Feature Requests:
Author Note. This primary feature request calls for a new kind of hyperlink called Author Note. This text-based hyperlink will invoke a pop-up that is similar in appearance to the pop-over. The pop-up author note can contain text, images and selected widgets (Gallery, Media, Keynote, 3D and HTML) and include full screen options where appropriate. Readers will be able to select and copy all or any part of the contents of an author note for use elsewhere in the book (reader notes) or outside the book.

Return Hyperlink. The return hyperlink option is invoked whenever the author opts to use a hyperlink that will transport the reader to another part of the book. The author will have the option of using this feature or not and specifying the text of the hyperlink.
Hidden Pages. Authors will have the ability to create hidden chapters, sections and pages that will only be accessible via hyperlink. The return hyperlink will be an essential companion feature to this.
Taking action:

If you agree that some or all of these enhancements requests would be good for you and other iBooks Author users, here’s what to do.

In iBooks Author, go to the iBooks Author menu (upper left corner of screen, just to the right of the Apple menu) and select Provide iBooks Author Feedback. Fill out the form and feel free to select, copy and paste from here if you like.

Tuesday, September 3, 2013

Using SVG images in iBooks Author

The primary advantage of Scalable Vector Graphics (SVG) files is that a very small file can be scaled up to yield large images without the aliasing (jaggies) that appears when a bitmapped graphic is scaled up. SVG files are resolution independent, usually non-photographic and commonly carry the suffix *.svg. There are lots of free SVG files available on the Internet and there are many applications for creating SVG files such as the free, open source Inkscape. SVG files can now be viewed via drag & drop onto web browsers such as Firefox, Chrome or Safari or via the free MacOS X app, Gappin. For an excellent primer on vector graphics, see this Wikipedia article.

So the advantage of vector graphics to iBooks Author is that these images can be scaled up without making those images fuzzy with jagged edges. A single U.S. state map vector image, for example, could be used to show full screen versions of each state without any visual loss. Complex diagrams such as those produced by OmniGraffle can be included at any level of detail.

However, it is not possible to use SVG images directly in iBooks Author.  If you attempt to drag and drop an SVG file onto an iBooks Author project, nothing will happen. You'll get no error messages or feedback of any kind. Similarly, apps in the
iWork suite (Pages, Keynote and Numbers) will also refuse to accept SVG files. This post is about how to work around that limitation.

The iBooks Author application has its own Text, Shapes and Graphs menus with which a number of vector graphics can be created. Another option is to use the vector graphics created by Keynote, Numbers and Pages. These can be copied and pasted directly into an iBooks Author project. Graphics created in iBooks Author or any of the iWorks suite applications are vector graphics in PDF file containers, not SVG file containers. PDF files can contain text, bit-mapped graphics and vector graphics. We are most interested in the latter type, vector PDFs. The
OmniGraffle application is a considerably more sophisticated graphics toolset and is capable of exporting both SVG vector drawings and PDF vector images. The latter are compatible with iWork suite and iBooks Author.

That's useful but there is an Internet full of already drawn
SVG images that are in the public domain or CC licensed.  It would be a shame not to have access to that vast library of free vector images.  The work around to this problem is to use this on-line conversion service to convert SVG to PDF and then drag and drop that PDF directly into an iBooks Author project or into one of the iWork apps or OmniGraffle for further manipulation.

Download an *.ibooks file
here that shows how vector graphics created in iBooks Author compare with vector graphics converted from SVG files. The following screencast uses that same multi-touch eBook.


Sunday, July 28, 2013

Using iAd Producer with iBooks Author (example: creating an external video player widget)

The iAd Producer application from Apple has grown considerably since its inception. Originally, it was a highly specialized application that created advertisements for mobile devices from Apple. Those iAds were composed of sophisticated HTML, CSS and Javascript.

Since that inception, it has been expanded to create iTunes LPs for music albums sold in the iTunes Store and iTunes Extras for video sold in the iTunes Store. These, too, rely upon HTML, CSS and Javascript web technologies. Most recently, iAd producer has added iBooks Author HTML widgets to its repertoire. Thus, the following screencast tutorial showing how easy it is to use iAd Producer to create a high quality HTML widget for iBooks Author without writing a single line of code.

This example focuses on creating an HTML widget that plays a video hosted on an external server. This keeps the size of your *.ibooks file down making for quicker downloads and avoiding becoming a burden to iPads already nearly filled to capacity with other books and media.



Try viewing this video in full screen to catch all of the details. Note that Firefox doesn't like MPEG-4 and will refuse to play this. Try any other modern web browser (Safari, Chrome, etc.).

Download the example book to an iPad to get an even better view of how this looks and feels in the hands of your audience.

Download iAd Producer (free developer registration required)

Tuesday, June 18, 2013

Danger: Do Not Duplicate an *.iba File - Use Templates Instead


The setting. I wrote four eTextbooks (of six planned) for a private iTunes U course that I am teaching. I used names such as Unit.01 Getting Started, Unit.03 Capture and so on.  These were uploaded to iTunes U via the iTunes U Course Manager. 

The bad move. Once I got the design of Unit.01 decide upon, I duplicated the *.iba file for Unit.01 and edited it to make the shell for Unit.02 and so on.  What I should have done was to create a template and work from that. Bad move.

The reason. After a bit of back and forth with some very diligent folks at Apple involving both the iTunes U and iBooks Author teams, we discovered that my bad move caused the *.iba files to have the same internal ID and that caused all of the resulting *.ibooks files exported from them to inherit that identical internal ID.  

The cure. So I opened each *.iba file and made a template from it, closing it and adding the prefix "old_" to its file name in the Finder, just to have a fallback in case something went wrong.  After that, I created a new IBA project file from the just created template and saved that under the old name (no prefix) and exporter a new *.ibooks file replacing the old , defective, identity-challenged *.ibooks file. Rinse, repeat with each of the other eTextbooks.

Testing has shown that all of these eTextbooks have regained their individual identities. Opening Unit.04 always results in opening Unit.04. Success.

The moral. Make templates, don't dupe an *.iba file.

Friday, February 8, 2013

HTML Widgets Made Easy: External Video Player Example

The iBookstore limits the size of of *.ibooks files created with iBook Author (henceforth, IBA) to 2 GB and recommends that you keep the size of your iBook file under one gigabyte if possible in order to avoid taking too much space on your readers' iPads as well as to avoid your readers having to endure long download times. Although including video that is internal to your IBA project is a simple drag and drop application using the Media Widget in IBA, that kind of video will very quickly increase the size of your iBook and may place an unwelcome burden on some of your readers.

The alternative is to include external video in your IBA project using a custom made HTML Widget. The big advantage is that a one megabyte HTML Widget can play a 70 megabyte video in your iBook. The downside, of course, is that the reader must have an active internet connection and the availability of the video must be maintained. If a video used in your iBook should become unavailable, you can provide your readers with a free upgrade correcting that issue via the iBookstore's versioning feature.

Unfortunately, many people are persuaded not to use this approach because it involves writing HTML code but this post will offer you a way around that obstacle. If you can use a text editor, you can modify an HTML widget template that plays an external video that you select for your iBook. Here's how:

As you'll learn from
this Apple support document, an HTML widget is nothing more than a collection of text files enclosed in a folder with the suffix ".wdgt" added to it. On the Mac, adding that suffix to the folder name changes the appearance of the folder into a widget icon. The minimum HTML widget contains three files: a Default.png file, an index.html file and an info.plist file. I have prepared an HTML widget that you can use as both an example and a template. It is a ZIP archive containing a complete working widget that you can add to a test IBA project. Once you have it in an IBA project you may use the Preview function to see how it works in the iBooks.app on an iPad. Download that HTML widget here and then double-click on it to extract it.

This example widget plays a video called "Open Access Explained" that is hosted on a server that I have access to. In this tutorial, I will show you how to open the widget and modify it so that it will play another video, one that is on a server that I do not have access to, a video that you choose. All I'll have to do to accomplish this feat is to open the widget, change the Default.png file and edit the text of the index.html and info.plist files so that they reference a different video. It's just that easy.

Of course that video must be playable on an iPad so no Flash. These
tech specs provide all the necessary details. The great thing about video on the iPad is that the HTML 5 video tag works without having to create multiple fallback versions of your video (*.mp4, *.ogg and *webm) as one would have to do on a web site. As long as it's using the MPEG-4 H.264 video and AAC audio CODECs, it can be in either a MOV, MP4 or M4V container. More simply, if the video plays on your iPad, it will play in this widget.

The video that I'll be modifying the widget to use in this tutorial is:
http://movies.apple.com/media/us/mac/ibooks-author/2012/tours/apple-ibooks-tour-ipad_ibooks_author-cc-us-20120314_r848-9cie.mov Because I'll be changing the widget to play another movie with different dimensions, I'll need to create a new Default.png file and change all of the references from the old video to the new video. I'll be using the BBEdit text editor but any plain text editor such as TextEdit will do just as well. Here's a screencast showing how this is done. Click HERE or click the image below.




Caveats: Some video services such as Vimeo and YouTube go to great lengths to tie their hosted video to their own web sites so that they can generate data about you and get paid for exposing advertising to you. Thus, it is just a little more difficult to use these videos in an iBook but it can be done. I may take that topic up in the next post.

NOTES:

• About the "auto play" attribute. You'll notice that I use the optional "auto play" attribute in the HTML 5 "video" tag. All HTML widgets take over the entire screen when invoked. Under iOS 6.x (tested), tapping this external video player widget will bring the poster (Default.png) image to full size atop a white background that also displays the widget's title and caption as well as a close button. A standard iOS "play" icon will be superimposed on the center. The video will begin to play automatically without the reader having to tap this play button. The time that auto play takes depends upon the size of the video and the speed of the network. The operating system tries to estimate when it can play the external video without interruption. The reader can always tap the play button prior to auto play. Simply delete the "auto play" attribute if you rather not have this feature operative.

• About the "controls" attribute. I also use the optional "controls" attribute. This provides the reader with a standard video controller with which they can control playback of the video such as audio volume and two "full screen" options as well as a scrubber for moving the play head to arbitrary points along the time line. Simply delete the "controls" attribute if you'd rather not have this feature be available to your readers. The following image shows these various controls and their effects.




Resources:

Safari HTML 5 Audio and Video Guide

iBooks Author: About HTML widget creation

Saturday, December 8, 2012

Providing iBooks Author Feedback to Apple

One of the most useful widgets for iBooks Author is the Keynote widget. It enables you to add a presentation to an interactive iBook using the features of the Keynote.app for MacOS X and iOS, including many of the transitions and builds. You can even convert a PowerPoint presentation to Keynote and bring that content into your iBook as well. The full details are in this technical note.
The one disappointment I had was that this widget does not support voiceover narration. This can seriously diminish the value of a slide presentation. The reader can flip through the slides forward and backward but they have to guess what the presenter might have said. Peter Norvig did a wonderful six slide Powerpoint presentation illustrating this very point. See the slides for President Lincoln's Gettysburg Address
here. View the slides on-line or download the presentation as a *.ppt file.




As you'll see, there is something missing, something very important.

Of course there is a way around this. In Keynote, you can add a voiceover and export the presentation as a video to include in your iBooks Author project using the media widget. You can also use screen casting software such as ScreenFlow to capture slides, narration and even a secondary video source such as a PIP (picture-in-picture) of the speaker. The problem with these audio-annotated slideshows done as video is that their file sizes are unnecessarily large. This is a problem for iBooks both because of the 2 GB limit and the time it takes for readers to download very large iBooks. This might well reduce ones audience.
My use of the word "unnecessarily" should signal that there might be an even better workaround and there is – sort of. What I'm about to describe would be a great workaround
if it were supported by iBooks Author. It is not currently supported in iBooks Author but users of that application can change that. Request an enhancement right from within iBooks Author like this:




The workaround that's better than a video is called an "enhanced audio" file. It is created in GarageBand and carries the *.m4a file name suffix.. You may also see it referred to as an "enhanced podcast" file. What makes the enhanced audio file such a great alternative to video is that it uses one static image of a slide over its entire time on screen instead of 30 frames per second as in a video. If a 50k slide is on-screen for 100 seconds in an enhanced audio file, that image contributes only 50k to the total file size. If a 50k slide is on screen for 100 seconds in a video file, that image contributes 150,000k ([50*30]*100) to the total file size. That's 50k vs 150 Mb, a 3000:1 ratio in this example! In real life, the difference is somewhat less than this because good video encoding uses a number of neuroscience-based tricks to present incomplete data in between the key frames that are full representations of what the camera captured. That fools the eye and takes less space. Still, the difference is quite significant. We'll look at a real world comparison below.

Since this is not a how-to post, I'll leave that task to others. There are many fine tutorials teaching you how to use GarageBand to create enhanced audio files on the web. Here's a good
one in the form of a PDF.

I created an example using some ancient media describing the beginnings of the Space Shuttle program. Intended for school use, the package contained a cassette audio tape and a set of photo slides. The audio tape has sharp "beeps" to tell the projector operator when to advance to the next slide image. I've left those beeps in for their nostalgia value. Here's the enhanced audio file slide show:



You may download a copy of this file
here and it will play (larger) in QuickTime X Player, in the iTunes.app and may other venues that support QuickTime but just not iBooks Author and the iBooks it creates. This 18 minute presentation is only 21.4 MB in size! Space-efficiency isn't the only advantage of enhanced audio files. The assembly of the static images creates a chapter track that enables the viewer to quickly and easily move to any part of the presentation. This is great for studying a topic where revisiting a difficult section is helpful. Here's a screenshot to illustrate what a chapter track looks like:



Here's a view of the GarageBand project that created this enhanced audio file:



So, what would this presentation cost us in terms of file size if it were a video? I created an *.mp4 version with ScreenFlow using the same assets. That version weighed in at 198.2 MB. You may download a copy of that file here. The *.m4a file tipped the scales at 21.4 MB. The video version is approximately 9.3 times larger than the enhanced audio file yet playing them side by side reveals no important differences. Here's a screencast of that analysis:



If you'd like to download and view a larger version of this video, you may do that
here.

The one on the left is the c. 200 Mb video and the one on the right is the c. 20 Mb enhanced audio file. So, if you are at all impressed by the potential advantages of being able to use an enhanced audio file in an iBooks Author project, send in that enhancement request to Apple as described above and do that ASAP.

By the way, you can add an enhanced audio file to an iBooks Author project and it will play the audio part. No slides though and that's where the biggest advantage is. Here's what that looks like in iBooks Author.



Note that there is an option for "Show Audio As:" that includes an "Image" option. That doesn't make the slides appear though. That's for drag/dropping a single image onto it that will appear throughout the duration of the audio. Yes, I got real excited when I first saw that.