Participant

Answered

interactive book with animate cc + Indesign ?

Forum|Forum|7 years ago
December 30, 2018
3 replies
4016 views

i want to make E-book for children and insert Animated Element (html canvas) as pages for the animated stuff and InDesign for the fixed layout

but the problem is that i don't know what platform should i use to Combine them both to be as a single flip eBook.

and i want it,to be offline app for android tablets

any help with this problem ?

This topic has been closed for replies.

Correct answer rayek.elfin

With the free html export plugin that I mentioned earlier you export all the pages from InDesign. Then export all individual Animate CC pages as html. Add missing links, and you may have to fix InDesign's generated link function.

When everything is working, and all pages link up properly, use Cordova to convert to a working app for mobile, desktop, etc.

Although I have a feeling you might not have the technical skills (yet) to accomplish these steps (not meant in a bad way, of course). Which means you will have to read up on Cordova. Or perhaps as an alternative use Adobe PhoneGap to convert to an app for mobile.

The only way to combine html from InDesign and Animate CC in one app is to use a webview wrapper (Cordova, PhoneGap, etc.). That, or publish the pages as a live website. But you will still have to fix things, and use some basic HTML, CSS and Javascript to get it all working properly. No way around this.

JoãoCésar17023019

Community Expert

My suggestion is that you bring your InDesign assets in and design and code everything in Animate CC.

Animate has all the tools you need to create an interactive book.

Regards,

JC

rayek.elfin

Legend

InDesign can be used for interactive somewhat animated children's books. The animation tools are pretty terrible, however, and outdated. Interactivity is limited to simple static stuff, such as hiding and showing content. Don't expect to create highly interactive content with only InDesign.

One way to work around these limitations, is to use Animate CC and animate more involved animations in it, and export to OAM files, which are then placed in InDesign. This is probably what you are asking: to include Animate CC animations in InDesign, you must export these as OAM files (and be sure to work with html canvas in Animate CC).

The trouble with this approach is that it is very indirect, and requires planning how everything works together.

It is doable, however. And the epub format as well as InDesign export have limitations. Some things just don't work as expected, or at all.

Exporting your InDesign project to an app is not directly possible without external tools. InDesign does support fixed layout epubs, but those currently only work without issues on iPads and MacOs in the iBook viewer.

To export/convert and InDesign project to an app, you have a couple of options:

- use the free InDesign HTML export plugin to export to HTML pages. https://indesignsecrets.com/exporting-from-indesign-to-html5-amazing-free-script.php Then use Cordova and some simple coding to convert your html project to a working mobile and/or desktop app. This is completely free, and you will have the option to add external html/css/js elements as well. This gives you the most control, but is technically more involved.

- use a commercial plugin like In5 to deploy your app directly. Expensive, but easier. Ajar Productions: Design and Animation Software

A third option is to completely abandon InDesign and Animate CC, and instead switch to a (visual) game engine, and create your interactive children's book app in one of those. The advantages are that you will have FAR more control over the interactive aspects, and many game engines now have advanced built-in animation support, and allow for direct export to various platforms, including mobile apps and web.

Examples of these would be Godot Engine (open source and free) or Unity (free). In my opinion a better option, but again at the expense of having to learn new software, and possibly more technical as well. Almost no limits in regards to creativity and interactive elements, however. And the least expensive option.

So it depends on your requirements, and technical confidence.

JoãoCésar17023019

Community Expert

Hi.

One thing that I would like to point out is that Godot and Unit are indeed very powerful engines. I myself created an app and some other stuff with Godot.

But both Godot and Unity are not really tools for assets creation, UI design, vector drawing and animation like Animate.

Animate has all that is needed to create a product like an interactive book from ground up in one single package. And is far easier to learn and to use.

Also you can output to web using HTML5 Canvas/WebGL documents and to mobile using AS3 documents and even HTML5 documents if you wrap the output in a webview like you described.

rayek.elfin

Legend

JoãoCésar wrote
But both Godot and Unity are not really tools for assets creation, UI design, vector drawing and animation like Animate.
Animate has all that is needed to create a product like an interactive book from ground up in one single package. And is far easier to learn and to use.
Also you can output to web using HTML5 Canvas/WebGL documents and to mobile using AS3 documents and even HTML5 documents if you wrap the output in a webview like you described.

Yes, of course assets must be created outside of Godot or Unity. The same holds true for InDesign, and, to an extent, for Animate CC.

I disagree with you in regards to animation, though: Godot and Unity have quite powerful animation timelines and other animation features which even Animate CC cannot match. The new timeline in Godot 3.1 (currently almost in beta) offers a very powerful graph editor which just works much better than the one in Animate, for example. There's even animation blending and a working cut-out character bones-based animation editor.

Animations play in real time in the editor itself, even nested animations unlike Animate where movieclips refuse to play and the entire animation must be previewed (or has this changed in the latest version?)

For UI design Godot has a full theme editor for GUI components. Animate CC and InDesign lack this as well.

Sound can be far better controlled in Godot and Unity too.

And Animate CC doesn't really support 3d. With Godot, for example, it is simple to combine 2d and 3d on the same canvas.

But yes, with power comes greater complexity. Although with Animate CC, as you state, converting to an app is more complex than in these other tools (and which have native support, rather than require the need for webview wrapper).

Myself, I would just prepare image assets in an image editor and vector package, and then import those in Godot. Animate in Godot, build the GUI in Godot, some simple actions, and done. But it requires technical skills the OP probably doesn't possess.

Based on the OP's question I presume InDesign + animated OAM elements plus the In5 commercial plugin would be the simplest approach.

In the end it all depends on the job's requirements and the designer/developer's technical skills and willingness to learn new things.

kdmemory

Inspiring

Hi Ali

this seems to be an issue for which you should focus your search for solutions towards the InDesign Forum. eBook format for Android in general is the EPUB format. And InDesign from CC2014 upwards can export to EPUB 3 format which apparantly is the most recent spec. Animations from Animate, I'm sure, there are ways to get that into InDesign (mp4, html/js, animated gif - I guess - I'm not the expert here).

Maybe this is a start ...

Klaus

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded