in5 v1.4 Released

Version 1.4 of in5, our InDesign to HTML5 conversion tool, introduces several highly requested new features.

Slideshow Overlay

The Slideshow option in the Folio Overlays panel of InDesign makes it possible to create an interactive slideshow from a Multi-State Object and export it to a Digital Publishing Suite (DPS) app. With in5 v1.4, you can now export that same slideshow directly to HTML.

slideshowOverlay

HTML Embedding for CS4, CS5, and CS5.5

InDesign CS6 introduced a fantastic new feature that made it possible to insert HTML into an InDesign document. You could even copy embed code (from YouTube, Vimeo, Google Maps, etc) and paste it into InDesign. InDesign would recognize that the incoming text was HTML and automatically generate a box with the right dimensions. in5 has supported the use of the embedded HTML feature since version 1.0. In version 1.4, we duplicated this ability to insert/paste/edit HTML code for anyone using InDesign versions prior to CS6 (CS4, CS5, and CS5.5).

My throat is still recovering from a cold and the visuals were enough to show the features, so don’t adjust your speakers, there’s no narration is this video.

Animated GIFs

Animated GIFs used to be all the rage on the web. As Flash introduced more sophisticated animation, animated GIFs fell out of fashion. Since Steve Jobs’ Thoughts on Flash, and the increasing popularity of mobile devices that do not support the Flash Player, animated GIFs have made a comeback. And now they’re supported by in5!

Any .gif file that is imported into InDesign and not cropped will be preserved by in5 by duplicating the original .gif file (rather than rendering a new image).

Hyphenation

Hyphenation is an important element in design, as it allows the lines of a paragraph to be broken up in a less ragged fashion, creating a smoother visual flow of text. Hyphenation is just now beginning to be supported on the web. Even though it will only appear in a few browsers at the moment, we’ve added support for those browsers because hyphenation is such an important design feature.

Additional Support for WAV and MP3 Audio

in5 has supported .wav and .mp3 files as a primary audio format since version 1.0. Since different HTML5 browsers support different audio formats, in5 also has a fallback mechanism that checks for audio files with the same name but a different extension to include as alternate sources. Previously, in5 would only search for an OGG file as a fallback. In v1.4, in5 also does an additional search for MP3 and WAV files as fallbacks. So, for example, if you place intro.mp3 into an InDesign document, in5 will search for intro.ogg and intro.wav (in the same folder) to use as alternate sources for browsers that support those formats.

Dialog Loading Time

Before displaying the export dialog, in5 collects information about document swatches to use as options in the dialog. A user discovered that having hundreds of swatches in their document could cause a significant delay before the in5 dialog appeared. We’ve added a time limit to swatch collection in v1.4 to help remove this delay.

Want to try it out? Download the latest version of in5.

Copy InDesign Fonts to Folder

InDesign guru, AnneMarie Concepcion ‏ (@amarie), put out a request for a script to copy fonts from an InDesign document to a folder. So I put together this script.

Usage

Double-click on the script in the Scripts panel to run:

copyFonts_script

It will prompt you for any conflicts:

copyFonts_conflict

…And display results at the end:

copyFonts_results

Installation

  1. Unzip the download package.
  2. Double-click the CC installer that matches your system (Mac/Win). For CS4-CS6, double click the MXP file (inside the CS4-CS6 folder) to install using Adobe Extension Manager.

Download

Copy Fonts to Folder.zip (CS4 and newer)

in5 v1.3 Adds Tons of Interactive Features

We like to have a theme with each major update of in5. Version 1.3 is all about interactivity. Just like the previous updates, this one is heavily driven by user requests. The interactivity listed below is already built into InDesign, so there are no new panels or vocabularies to learn, just added support for some awesome InDesign features.

Multi-State Objects

Multi-State Objects (MSOs) in InDesign allow you to create something akin to frames within a single object. That object can then be controlled by other elements on screen. The possible uses for MSOs extend far and wide, from slideshows to popups and user feedback.

It’s possible for a designer to create a highly interactive experience without coding by using multi-state objects, buttons, and forms (like this page created for the demo video below).

Shlomo Goltz, one of the original Kickstarter backers for in5, recently wrote an excellent article in Smashing Magazine, arguing in favor of InDesign as a prototyping tool because of its feature set. We couldn’t agree more. The video below shows how to create an interactive prototype entirely in InDesign (and exported with in5, of course).

Along with supporting MSOs, in5 v1.3 also supports the behaviors that can be associated with MSOs: Go to Next State, Go to Previous State, and Go to State.

Where does your project fall in the ebook Spectrum?

It’s a brave new world in digital publishing. How does one decide where to commit precious resources at the start of the project?

Enter: the ebook Spectrum (or Digital Publishing Continuum, if you prefer).

ebook_spectrum

If you can determine where your project falls within this spectrum, you’ve overcome a large, practical hurdle.

On the left side of the spectrum are formats like EPUB (non-fixed-layout), which focus on text content and readability. These formats are generally best served on an e-reader like the Amazon Kindle. This kind of device includes reader-friendly features like a display that emits no light (easy on the eyes), and the ability to adjust the size and flow of the text. In this format, where a page breaks is arbitrary. The layout—relative positioning of text and images, colors, specific typefaces, page alignment—is forsaken for the experience of the reader. This end of the spectrum serves a format like the novel quite well, because the page layout is of little consequence in most novels.

On the right end of the spectrum are formats that permit greater layout fidelity (apps, HTML5, HPUB). These formats are best served by light-emitting, highly interactive devices like an iPad or Android Tablet. This end of the spectrum is much better at serving a format like a digital magazine that includes complex graphics, colors, and typefaces, as well as interactivity.

If you know ahead of time what device(s) you’re targeting, it may help you place your project within the spectrum. Once you’ve determined where you project falls on the spectrum, as well as which device(s) you will target, you have a solid foundation for choosing a tool or technology that can help you complete your project successfully.

Let’s looks at a few examples. Let’s start with InDesign as the source of our layout and content because of InDesign’s advanced tooling and flexibility.

  • If your project is solidly on the left end of the spectrum, your InDesign project simply has to be laid out as connected textframes, and you can export directly to EPUB.
  • If your project falls on the right end of the spectrum and you’re producing regular periodicals for paid subscribers (e.g., The New York Times or Martha Stewart Living), then DPS offers you a direct route out of InDesign.
  • If your project falls on the right end of the spectrum, but you want/need to distribute your content to a wider array of devices, or you don’t have paid subscribers, or you don’t want go through an app store (or can’t), etc…well, this is the reason we created in5 (InDesign to HTML5).
  • Going the other direction, perhaps your project needs are extremely specific. Perhaps you’re only targeting Apple devices. Apple (used to) provide a free design tool called iBooks Author.
  • Or perhaps you need interactivity that exceeds what the current authoring tools offer. In this case, developing a custom app may be your best option.

Because digital publishing is still in a form of infancy, the road to a successful project can be a long and winding one. If you can determine where a project falls in the spectrum, you can start addressing some of your technical needs early and save yourself some trouble and unnecessary effort.

So, where does your project fall in the ebook spectrum?

in5 v1.2 now supports Liquid Layout and Baker Framework

We’ve got some big new additions to in5 (InDesign to HTML5). These updates, like all version 1.x updates, are available at no charge to existing in5 users.

Take a gander.

Liquid Layout

InDesign CS6 added the Liquid Layout functionality that allows you to controls how and when your page items scale and re-position themselves. Now you can export that capability to HTML with in5!

in5 even allows older versions of InDesign to use Liquid Layout (it simply defaults to scale mode).

For more on using Liquid Layout in InDesign, check out:

The Baker Framework

The Baker Framework is a really fantastic open-source ebook framework to publish interactive books and magazines. Baker-built ebooks allow you to maintain complex and precise layouts—unlike EPUB, where the focus is on reflow—which fits in quite nicely with our mission of layout preservation with in5. A Baker Framework export has been a popular feature request since our initial Kickstarter project, so we’re thrilled to announce that it’s now available! The Baker-ready output from in5 can then be easily converted to a standalone app or published to Apple Newsstand using the tutorials available on the Baker Framework website.

Apple Newsstand is a built-in application the iPad, iPhone and iPod touch. It is dedicated to downloading and displaying digital versions of newspapers and magazines. The Newsstand option is great, because it’s much easier to publish (and monetize) your content than would be with an app (no code-signing required, as far as I can tell).

Combine the Baker export with the Liquid Page Format and your ebook will automatically re-orient and scale itself in both portrait and landscape modes.

in5_1_2_features