About this project
Hi, my name is Justin Putney. I'm a designer and a developer, and partner at Ajar Productions. My wife, AJ, and I started Ajar Productions as a husband-and-wife animation studio. Over the last several years, we've been focusing more on software for animators and designers.
If you're like many designers we know, you're able to produce some fantastic designs using InDesign. More and more, clients are asking for digital projects like HTML5 websites and mobile apps. Unfortunately, there hasn't been an easy way to translate your designs into web and mobile experiences.
Your contribution to this project will help us change that. Below are some reasons why we think you might be interested in contributing.
Note: We've reached out funding goal early, but we're still looking for backers. Additional capital means additional resources, so we've added some stretch goals. For additional project updates, you can also follow us on Twitter @justinputney and @ajarproductions.
How InDesign to HTML5 will work
Using InDesign->HTML5 will be as easy as selecting File > Export. The output of our tool will be very similar to that of the fantastic Interactive SWF exporter currently in InDesign. However, InDesign->HTML5 output will not rely on the Flash Player and will thus work on mobile devices, including iPads and iPhones.
Note: We will include Flash Player fallbacks for older browsers that do not support HTML5 audio and video.
The exporter will present you with a dialog with basic options: page animation type, navigation style, font embedding, background color, etc. There will also be several advanced options tucked away: allow offline storage, keywords for Search Engine Optimization (SEO), etc.
Then the exporter will do the rest!
What about the existing HTML export?
As one InDesign guru put it, "ID's HTML export is designed to extract content, not geometry." In the graphic below, the original layout (the same one used in the video demo above) is at the top. The thumbnail at the bottom left shows the HTML created by exporting my sample file. As you can see, it bears no resemblance to the original layout. No only that, but because the text was white, and the images in the master page were not exported, I had to select the text for it to be visible at all.
As a second test, I copied the elements from the master page and pasted them directly on a single page. The results of that export are shown in the thumbnail at the bottom right. A single image (the HTML5 logo) made it into the HTML page, but the output is still a far cry from the original layout.
- Layout. Element positioning will be maintained.
- Format. Up-to-date HTML will be used (rather than an older version).
- Font embedding.
- WYSIWYG. No programming knowledge will be required to adjust the final layout.
- Built-in page navigation (if desired).
- Master page content will be included.
Why not just use the Adobe Digital Publishing Suite (DPS)?
DPS is the industry-standard technology, introduced by Adobe in InDesign CS5.5 (and retroactively in CS5), to export interactive designs to tablet devices. The layout fidelity is fantastic, but there are several disadvantages:
- Cost (ranges from $395 to > $100,000, + usage fees).
- Pricing is optimized for wide distribution (10,000+ users). This is good for the NY Times, but untenable for the single designer, small shop, or someone who needs to distribute work within their company.
- Limited output. Only outputs to tablet devices and the iPhone (no other phones or desktop machines).
- Distribution for review requires that all users who want to see your project 1) sign up for an Adobe.com account, then 2) send you their email address associated with the account. You then 3) add their email to a distribution list. Once they've 4) downloaded the Adobe Content Viewer to their tablet, your project should appear with that app.
- Distribution as a app involves other costs. For example, in order to distribute your project as an iPhone or iPad, you must sign up to be an iOS developer with Apple, which costs $99 to $299 per year.
- Number of projects that you can distribute is limited.
- You must have a newer version of InDesign to use DPS.
Other products like PressRun come with similar costs, usage fees, and limited output formats.
What about Interactive PDFs?
Interactive PDFs are an awesome format. Unfortunately, mobile device PDF readers only have a subset of the features available in the desktop versions. That's why interactive features and animation do not appear within PDFs on mobile devices. Additionally, mobile browsers do not support plugins, so PDFs have to be downloaded and launched in a separate app (rather than being viewed directly in the browser).
Advantages of our InDesign to HTML5 product
- Affordable (< $100 when released).
- Open, editable output (viewable on all devices).
- Easy to use (export right from InDesign).
- Easy to distribute your final product.
- Backward-compatible with previous versions of InDesign (back to CS4, possibly CS3).
- No usage fees.
- Distribute an unlimited number of projects.
Why Kickstarter for this product?
We know that there's an immediate need for this product. We think that Kickstarter is a good way to provide us with funding during development, so that we can get this project into your hands. Additionally, if you contribute $100 or more, you'll have access to a working prototype once the Kickstarter project closes.
After the product is released, we plan to continue adding features and supporting the product indefinitely.
Praise for Ajar Productions' products
As designer and a developer with significant experience building creative extensions, I know our studio can help you share your designs across digital platforms and help you wow your customers. Here are some comments from satisfied users of our products:
OMG! Thanks a lot, this is awesome!
This script has just made my day, month and year. Fantastic!
WOW! [><] WOW!!! Awesome Justin! Saved me a ton of time! Thank You…
Saved me some sleepless nights! Thank you so much.
You can also out the comments section to see what backers of this project are saying.
Other products we've built
The full list of products can be found through our products page. Here are a few examples:
Support this project
- (30 days)