Skip navigation
Currently Being Moderated

InDesign CS4 Flip Book Exported to SWF

May 9, 2009 5:30 AM

I've never used InDesign or Flash before, so please don't assume that I know something just because it is so simple that I should. 

I've created a first draft of a flip-book as a 'test of concept' .  I've posted this first draft at the following URL (2MB) so that you can better understand my questions in the context of the book I'm building:

I want to build this entire flip-book from inside InDesign and use InDesign CS4's Export to SWF capability to produce the web-ready SWF and HTML files.  The link given above was produced in this manner.  I know that a more experienced person would probably do the layout in InDesign and then export to an XFL file so that the navigation details could be built in Flash.  I prefer not to do this because I find it hard enough to learn InDesign for the first-time let alone trying to learn Flash simultaneously.

Here's the items that I want to add / modify in my existing 'test of concept' book posted above.  Help on how to do these things would be greatly appreciated.

1.   I want to get rid of the excess gray area around the flip book.  I can't seem to figure out how to do it.

2.  I'd like to add a Button Action to the 'Fast Forward' and 'Fast Rewind' buttons that would cause the pages to flip continuously in the corresponding direction until the first r last page is reached.

3.  I'd like to add a Button Action to the 'Stop' buttons that would cause the automatic flipping (as requested in my request #2) to stop at whatever page is displayed when the stop button is pressed.

If I MUSTexport to xfl and use flash in oder to accomplish my goals, then comments on how to do this in Flash are also welcome.

Thanks for any help you can offer.  Mardon

  • Currently Being Moderated
    May 9, 2009 6:12 AM   in reply to merbland

    I have made a product called eDocBrowser. It´s done for making SWF files exported from InDesign more user-friendly. There is no Play-button but I think I could make it quite easily to next version of it. There are lots of other extra features added instead. Like zooming, scrollin zoomed pages etc... and user interface is fully customizable...


    More info:


    Demo Magazine:

    (3 dummy magazines from indesign connected together)

    (theres help-button in the top-right corner of eDocBrowser)

    Mark as:
  • Bob Bringhurst
    4,651 posts
    May 29, 2007
    Currently Being Moderated
    May 9, 2009 3:36 PM   in reply to merbland

    You may want to read up on exporting to SWF. This help topic is a good starting point, there's a good video by Michael Ninness, and there's a blog entry on exporting interactive documents to SWF.


    1. Try experimenting with different page sizes. When you create a document, notice that there are presets such as 800x600 and so on.


    2. I'm not aware of a way to do this in InDesign. If there is a way, I'd love to know what it is. But that seems like something you'd have to do in Flash Pro, and it sounds like you want to avoid the XFL route.


    3. Same as #2.


    If you are going to try exporting to XFL to edit the file in Flash Pro, start with this help topic. It includes links to one video that covers exporting an InDesign file to XFL, and another video that discusses how to edit the XFL file in Flash Pro. For the Flash Pro side, you'll want to ask questions in the Flash forum.

    Mark as:
  • Currently Being Moderated
    May 20, 2009 10:18 AM   in reply to merbland

    Hey merbland,


    I've been having the same gray space problem with my indesign export. after thinking about it for a bit, i found that if you can html code (or you have dreamweaver) you can put the flash file into a table. just set the table width to the width of your indesign document.


    hope this helps. i'm sure we're not the only ones who had trouble figuring this out.

    Mark as:
  • Currently Being Moderated
    Dec 15, 2009 12:27 AM   in reply to merbland

    Or, re: the "grey space" -- edit the body bgcolor attribute in the html document to a color which compliments your design. Not elegant, but easy.

    Mark as:
  • Currently Being Moderated
    Dec 15, 2009 12:43 AM   in reply to merbland

    My own first flipbook turned out quite nicely --except for one thing.


    The Previous Page button works, but the Next Page button does not. You have to view the whole thing backward.


    There are no overlapping transparent objects in the vicinity.


    I tried copying the working button, flipping it, and changing the Action. No joy. It's not "hot" and it doesn't show either the assigned rollover color or the pointing finger icon.


    I don't know a thing about Flash, either.

    Mark as:
  • Currently Being Moderated
    Dec 15, 2009 2:57 AM   in reply to bluffhouse

    Have you tried to use some Sample buttons? Theres lot´s of different arrow-shaped buttons which have been pre-programmed as next and previous page actions. Arrows that point to left is previous page and arrows that point to right is next page. You will find Sample Buttons panel from Buttons panels flyout menu...

    Mark as:
  • Currently Being Moderated
    Dec 15, 2009 10:09 AM   in reply to Petteri_Paananen

    I haven't tried the sample buttons. I'd like to be able to figure out why, if I can create one button which works, why I can't create two. ;-)

    Mark as:
  • Currently Being Moderated
    Dec 24, 2009 3:48 AM   in reply to merbland

    I too found the grey space very frustrating, but I eventually figured it out. (see -

    The colour and the size of the grey area can be changed in this part of the html file (see bold content):




              'codebase', ' rsion=9,0,0,0',



    'width', '1024',
              'height', '500',

              'src', 'sketchbook',
              'quality', 'high',
              'pluginspage', '',
              'align', 'middle',
              'play', 'true',
              'loop', 'true',
              'scale', 'showall',
              'wmode', 'window',
              'devicefont', 'false',
              'id', 'sketchbook',
              'bgcolor', '#ffffff',
              'name', 'sketchbook',
              'menu', 'true',
              'allowFullScreen', 'false',
              'movie', 'sketchbook',
              'salign', ''
              ); //end AC code


    Be warned though! The area around the document is the space where you can see the page turning outside the boundry of the document. (try setting it to the same size as your document and you will very quickly see what I mean.


    I can't help you with the other requests, but I hope I have been of some use.


    Mark as:
  • Currently Being Moderated
    Sep 20, 2010 6:45 AM   in reply to Benjamin J Farnell


    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points