Add page curling effect, without being an ActionScript guru

No Gravatar

Software Required: InDesign CS4

Get Adobe Flash player

Skill Level: Beginner to Intermediate

Not so long ago, creating a Flash flipbook with a page-turning effect for your website generally meant you needed to be an ActionScript guru.

Fortunately Adobe and InDesign CS4 has realised that we’re not all coders and have implemented an ultra cool page-turning feature that allows non-coders to export any ordinary InDesign file into an interactive SWF.

  1. Open up InDesign CS4 and create a New Document
  2. Enter the Number of Pages you require. Remember we’re essentially creating a book so make sure you have Facing Pages ticked!
  3. Set your Page Size and Orientation to however you’d like your flipbook to appear. I’ve set mine to Landscape and 218mm (W) x 125mm (H)

flipbook_1

4. I want my flipbook to look a little more authentic, so I’ve inserted a background image of a spiral bound book within my A-Master page. You’re welcome to include any background image you wish, or none at all for that matter!Now it’s time to begin laying out your pages! Depending on what you’re using your flipbook for, you can layout your flipbook however you like. I’m using it for an online portfolio, so my left hand page includes a client name and job description and my right hand page includes the job image.

5. Once you’ve laid out all your pages, you’re ready for your ordinary InDesign file to become an interactive SWF file, which includes the ultra cool page-turning effect.

You now need to export your InDesign file into a SWF file.

6. From the main menu select File > Export. Give your file a name; select SWF from the Format drop-down menu and then click Save.

7. You will be prompted with an Export SWF box. Make sure Scale is at 100%, All Pages is selected and all the Interactivity options are checked. All the other options are optional. Make sure
Include Interactive Page Curl is checked, this is the most important step! If you’re creating your flipbook from an InDesign file that includes Facing Pages, remember to check the Spreads option.

flipbook_3

Your flipbook is now an interactive SWF! You can now insert it into your website!

Here is my InDesign CS4 flipbook example file, including the swf file it generated.

  • Share/Bookmark

Polls

Will you be buying an iPad?

View Results

Loading ... Loading ...

Leave A Reply

Comments

Jose Cuadra (Dec 08, 2009)

I was never aware of this!

Great walk through I will be using soon. Maybe today. :)

admin (Dec 08, 2009)

Thanks Jose, it’s definitely an easier alternative. I actually forgot to link my sample files. Will post these shortly.

Lisa Taliana (Dec 09, 2009)

Jose I have now linked the InDesign CS4 file I used to create the example above.

Jon Callus (Dec 12, 2009)

Nice one Lisa!
Will be showing the guys at work. Do you know if its CS3 as well??

Lisa Taliana (Dec 12, 2009)

No, it only works in CS4

Polls

Will you be buying an iPad?

View Results

Loading ... Loading ...

Follow us on Twitter

Upcoming Events

  • Create Awards — Sep 17, 2010 7:00pm - Sep 17, 2010 7:00pm
    The CREATE:Awards red-carpet event held by Desktop Magazine, is hosted by Triple JJJ resident comedian Dave Callan, and features live entertainment.