zero point nine

3D Page Curl Effect using Papervision3D

The venerable Flash effect of turning a page in a book done in 3D. I originally designed and programmed this effect in Actionscript 2 using a home-grown 3D class library at about the time Papervision was entering public beta. This implementation using Papervision3D and AS3 runs a few times faster.

Press ENTER to create new instances of the book. Press it several more times and watch your browser chug :).

Here’s the main class for the page turn effect. I used the code for the PV3D Plane class as a starting point (but, in hindsight, probably should have subclass’ed from it instead). To create the appearance of a rotation of the 3D object, the individual vertices are rotated around the Y axis by increasing amounts depending on their (original) position along the X axis.

Version: 0.9B – Last updated on 4/22/2007

Licensed under a Creative Commons Attribution 3.0 License.

This entry was posted on Thursday, April 19th, 2007 at 1:56 pm and is filed under flash, flash 3d, sourcecode. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

22 Responses to “3D Page Curl Effect using Papervision3D”

Flash Game Guy:
June 2nd, 2007 at 11:06 pm
Great Job! I’ve seen a bunch of these, and have worked on creating dynamic catalogs with one of the more popular ones online. I really like this one though. Are there any plans to add shadowing and the ability to flip pages from the corners in?
Skyler:
June 27th, 2007 at 1:42 pm
Hello Lee,

Fantastic demo with the page Curl. Great work!

Thank you also very much for sharing the CurlingPlane class. However, when I try to use it I don’t get anything showing on screen (though I have succesfully gotten Collada files, and other primitives in papervision to display).

I’m calling the constructor with a reference to a bitmapdata object embedded in the FLA:

var myBD:LibraryBitmap = new LibraryBitmap (0, 0);
var myBook:CurlingPlane = new CurlingPlane(myBD);
scene.addChild(myBook);

I have the class imported and have tried various things but to no avail. I don’t get any compile errors but nothing shows. Please assist.

thanks,

Skyler
Ade:
August 3rd, 2007 at 6:35 am
Does this still work with Papervision version 1.5? Like Skyler, I can’t get anything to show, but no errors are produced
beastriker:
September 7th, 2007 at 12:24 pm
WoW! nice!! like a real paper book =)
Pedro:
October 19th, 2007 at 3:53 am
Great work!
cali:
February 3rd, 2008 at 6:04 am
nice work…but if u let us download it we wouldnt had to steal it… :P
thnx
romantic:
March 2nd, 2008 at 1:10 pm
Great!!! like a real book!!!
Marcio:
March 31st, 2008 at 2:30 pm
Papervision 3D GreatWhite, no have the Mesh3D.as, how i can fix this?
memo:
April 1st, 2008 at 7:32 am
Really love the way the pages have momentum so if you start moving and let go, sometimes it goes up but falls back down, otherwise it completes the turn on its own… nice touch.
Rhye:
April 2nd, 2008 at 9:07 pm
Very Nice Congratulations!!!
Trambroid:
April 18th, 2008 at 3:01 am
Very good! I like it! nice job!
kartec:
May 21st, 2008 at 12:00 pm
Great. Very fluid. Nice job.
Bastik:
August 26th, 2008 at 3:57 am
like a real paper book! cool!
salman:
November 12th, 2008 at 5:42 am
how can i use it where i want to use it in the protfolio…
hope to hear from you

its really a nice script
gern:
December 10th, 2008 at 12:10 pm
very nice!

any chance this will let me put video on the pages or create two-page spreads?
admin:
December 10th, 2008 at 8:37 pm
With some modifications, for sure…
Bristol Web Design:
March 21st, 2009 at 8:21 am
This demo is extended here:

http://danro.net/2007/11/08/pv3d-pageflip-demo/

Very useful!

Holland Risley
Meiji:
April 12th, 2009 at 12:22 pm
Awesome! This is a very nice example! However, I keep getting this problem:

TypeError: Error #2023: Class CurlingPlane$ must inherit from Sprite to link to the root.

And then it shows nothing. I’m trying to run the project from Flex, am I missing something?

Thanks in advance!
Meiji
Lee:
April 13th, 2009 at 7:06 am
Meiji, the attached class isn’t designed to be run as a document class. You’d want to create an instance of the class in order to use it. Please note that it was made with an old version of Papervision (1.5), so you’ll also have to do some … investigative refactoring. Thanks.
Dan:
September 3rd, 2009 at 10:25 pm
Really Great Work.

I got a main class and instantiate your class inside. Doesn’t really work.
Would you mind showing us the rest of the code?

I’m really interested in this project and how you did it?

At least a hint to get it running would be awesome ;)

Thanks in advance!
Dan
David:
April 26th, 2010 at 11:01 pm
By any chance has anyone already done the “investigative refactoring?” :)
jayan Ramesh:
August 3rd, 2010 at 7:37 am
Marveious Work!!!!

3D Page Curl Effect using Papervision3D

22 Responses to “3D Page Curl Effect using Papervision3D”

Leave a Reply