Turning the Page on Page Flip

Chapter One

The very first time I saw the page turning effect in Flash was way back in 2002. It was called “Page Flip” and was written in AS1 by Sean O’Shell (PiXELWiT). It literally did help turn the page as far as innovation was concerned because it started to get people thinking about 3D in Flash and how real life objects could be somewhat realistically re-created in Flash. Of course, motion graphics and 3D animations have always been around to recreate real life objects, but using Flash to simulate reading a book had the advantage of using dynamic content, being easily updatable, and probably most important of all, having everything within a reasonably small file size.

Recreating the Wheel

I remember attending a FlashForward Flash conference in 2004 where I saw Flash legend Erik Natzke discuss his ActionScript and design work for Hewlett Packard. One of the files he showcased was a page turning mechanism he did for a HP/Dreamworks/Shrek promotion and went into great detail on all the math involved in how to flip a page in ActionScript. Natzke’s presentations are typically inspiring because of the way he uses math and logic to create stunning visuals, but actually hearing him talk about the math behind the page flipping technique was an intriguing experience!

E-Commerce Loves Page Flip

We now see the page flip technique used frequently within online stores, particulary those that have printed catalogs converted to Flash. Take the IKEA furniture catalog for example. Most stores employing a Flash-based flippable brochure have common elements such as the ability to zoom, skip directly to a page, print pages and even search for text.

Another twist on the page flip technique is being able to read and distribute magazines online through services such as Zinio.com.

Tools & Services

There are a variety of purchasable online tools and services to not only help you create and display material in an interactive book format, but some of the services even help you streamline the conversion process by taking your PDF content and automatically converting it to flippable pages. Some of the most popular and well known tools are:

• PageGangster | View Demo
  Allows you to upload PDF documents and have them converted on the fly into a page-by-page, Flash-based and interactive online book.
• Flipping Book | View Demo
  Using a combination of front-end Flash with back-end JavaScript, Flipping Book is a great way to present pretty much any type of media (print, design, video, audio).

The “Turn” of FlashDen Authors

We even have some superb variations of the page flip effect for sale on FlashDen. I apologize for not being able to feature everyone’s files, but here are a selection of some of my favorite interpretations:

Three Dimensional Expansion

It was only a matter of time before another twist in the tale of page flipping occurred. The most recent extension of page flip I have seen is PDFBook 3D. As the name suggests, it is a three-dimensional approach to organizing content throughout turnable pages, but the difference being, the book can be rotated along the x, y, and z axis.

The Future

There’s always a problem with trying to virtualize something that works so well in real life. It’s hard to improve upon the benefits of reading a physical book and recreate it electronically. Compare how fast it is to flip through a real book compared to any of the examples in this entire article. Compare how usable a book is compared to a Flash version. There are obvious shortcomings. But this should not mean that we should stop innovating or stop trying to make something better than it is today.

Look at Amazon.com for instance. Like it or loathe it, they are trying very hard to push their Kindle device and appear committed to developing the product in order to entice readers away from paper to their electronic device.

Perhaps the future of the electronic page flip effect will be a Flash-based interface on something like the Kindle or even the iPhone (once they allow Flash on there of course!). There’s already a proof of concept in circulation called the XO 2.0 Laptop that would be ideal for a new interpretation of page flip.

Whatever future progress holds, it must try to concentrate on the speed of which pages can be turned and how quickly the content on those pages can be rendered. That may be something only a combination of hardware and software can ultimately resolve, but imagine being able to flip through pages (or indeed navigate through some other mechanism) as quickly as you can in a real book. It’s possible and it’s attainable, it’s just when that we have to wait for.

Be Inspired By What We Already Have

Sometimes, it’s not about creating something from scratch. It’s about being inspired by existing concepts and improving usability and/or functionality through what is already around us. Without infringing on copyright or trademark, there is potential for us all to improve upon many facets of existing Flash interfaces and concepts by redefining the way they look, function, or what they can offer the end user in terms of features. A perfect example is how late Apple were in joining the mp3 player market. But when they arrived, there was no looking back, and today, they own that market. So be inspired and continually reinvent. Tomorrow’s answers are staring us all in the face today.

Scott

Scott is the Down the FoxHole blog editor. He is also a reviewer for ActiveDen. Scott is a freelance Web and Interactive Media Designer having previously worked as the Lead Web Designer for a well-known children's hospital in the US for 8 years. Follow him on Twitter @scottwills

• CodeCanyon, 3DOcean and Jason - 3 New Members of the Family!
• Holiday Giveaways, Freebies and More!
• Marketplace API Roundup