Use Processing to Create Interactive Widgets for iBooks

Warning, this post is a bit nerdy.

So, I already blogged bout iBooks Author and how I might use it. I was thinking about how I might be able to create my own interactive elements. So I did a bit of research. If I knew html5 and Java Script I'd be all set. Unfortunately I don't. However, I do know some Processing. I use Processing in my electronics class sometimes (it's very similar to Arduino) and the programming club at my school uses Processing.

It turns out there is this great project called Processing.js that will run Processing programs as Java Script. A little more researching on the net and I now have the ability to create my own interactive elements for iBooks 2.0.

This is really cool. Our school has a cart of iPads. With iBooks Author it is possible for our teachers to easily create compelling custom content for our students. More importantly, when they decide they want interactive elements we can have our own students create that content, turning the content creation into a collaboration between the students and the "content exerts".

So, how do you do it? Start with the tutorial and demo files over at the Tulmult Inc blog. Be sure to watch the video and download the demo files. You'll also have to download the latest version of processing.js just drop it into your working folder.

Create a file titled index.html to be something like:

Be sure to edit the plist file so that the size matches your Processing sketch. Your default image also has to have the same dimensions as your sketch. I discovered this the hard way. Just trust me on this. You can check out what I've been working on if your interested. I've put my latest version in my Public Dropbox. It includes a simple color mixing interactive in section 1.3. If you're on an iPad when you click the link to my book the screen goes white while the file is downloading (it's about 80 MB). Just wait and you'll eventually be able to "Open in iBooks".

My file is for the ICCARS project and it's only a partial rough draft, but you're free to download it. Spectrum Guide.ibooks