Adobe Edge (currently in 6th preview release) is a new product by Adobe to create HTML5-animations and interactive content natively in HTML5/JavaScript. Here is a tutorial how to use it for the Adobe Digital Publishing-Suite.
Since preview 6 of Adobe Edge you are able to directly export your Adobe Edge animations for Adobe DPS. Since it is only HTML it was possible to easily use it ever since but with the new export and InDesign CS6 you have all settings already set. Your overlay is set automatically and you only have to import the .oam-file into InDesign.
-
Build your animation in Adobe Edge
-
Go to "File → Publish Settings…" and select the tab for "InDesign/DPS". There you choose the destination for the export and the name as well as you can set a Poster Image (if none set, it will create one automatically). Press okay.
-
After that you now go to "File → Publish" and Adobe Edge exports the chosen export-options.
-
Navigate in your Finder to the publishing folder. You will find an .oam-file. This is your zipped HTML container which now will be imported in InDesign.
-
Open up Adobe InDesign (CS6+) and create your new file (or choose an existing one). Then import your .oam-file using the Place-option. Then just place your frame on the InDesign page as you would do normally. InDesign automatically creates an HTML-overlay in your Overlay Creator panel.
-
View it on your iPad or on Desktop Preview (which has some bugs if you have very special animation, so it is safer to use a real device). Done.
Here are all the files to download and test. Please note this is under full copyright and only for testing purposes.