Tuesday, October 22, 2013

Creating An App Version Of A Book

My illustrator, Carol Stevens, is amazing. With no coding experience, she has taken two of our books, The Chipmunk Who Wanted To Be A Bear and The Alligator Who Wanted To Be A Dog, and turned them into interactive apps for IOS (Apple products). They aren't available in the iTunes store yet (I will announce that soon!!), but I thought it might be helpful to share what we've learned here, since I believe that any product that makes text interesting, from books to ebooks to apps, aids the goal of childhood literacy.

Stevens used InDesign to create the apps. No coding is required, just design experience and a willingness to learn new things from video tutorials. I LOVE how Stevens took our book illustrations and made them animated and interactive. It is not a quick process, but she was able to create all the animation slides in Adobe Illustrator and then upload them into InDesign and create a Folio. She shared this Folio with me on my iPad, which I can read after I downloaded Adobe Viewer (which was a free app).

Here is a screen shot from The Chipmunk Who Wanted To Be A Bear App:
The Chipmunk Who Wanted To Be A Bear App
The icons along the left margin are for sound effects: A hawk, a growling animal, and a howling wolf. Since Chipmunk is afraid to leave his home (tapping on him makes him hide in his hole), these are sounds that he would find scary. Our beta testing children love to tap and hear the sounds over and over!

The icons along the bottom are: page up, hear the narration, hear the music, home page, page down. I happen to be a free-lance voice actress, so I was able to read and record the narration myself. We recorded in a sound studio, but it doesn't have to be that fancy if you don't have a studio handy. If you make sure you have a good microphone or headset, then you could record the narration without a sound studio. 

We just barely added the icon star on the right margin, thanks to feedback from our beta testers. When you first turn the page, stars appear indicating locations to tap to begin an animation. You can see those stars below in the screen shot from The Alligator Who Wanted To Be A Dog App:
The Alligator Who Wanted To Be A Dog App
See the four stars, three in the picture and one above? Those are the places where tapping once will begin the animation. The stars appear for a couple seconds, and then disappear. But we discovered that kids want to be able to see the stars again and again, so they always know where to tap for animations. Tapping the star icon on the right reveals the animating stars again for a couple seconds.

Stevens is brilliant with her animations! They add so much to the story. In this illustration Alligator is lonely, looking for a friend, and sad when the animals run away from his trying-to-be-friendly smile. Tapping below Alligator's chin makes a mouse run away through the grass. The star by his jaw makes a rabbit appear, see Alligator, and then disappear. While I enjoy books tremendously, I admit that an app animation adds a lot to a story too! Tapping above Alligator's eye makes his eye look forward and then back again. Tapping the star inside his mouth makes him close and open it. Tapping the star at the top of the page begins a ball bouncing from one side to the other.

Our beta testers, after a little experimenting, tend to touch the narration so that the story is read to them, and then listen while they tap all the animations. 

InDesign has provided a way for an illustrator/graphic designer to create an app without coding. That's fabulous! And I believe we will see more quality interactive books emerge in the app store thanks to that bridge. However, there were a couple limitations that I should mention. 

My favorite interactive book app is Miss Spider's Tea Party. It costs $2.99 and it's lovely! That app is what whet my appetite for an animated book app of my own. The illustrations and animations are fabulous, the storyline endearing, and the narration beautifully spoken. Using that interactive book app, I listed all the parts I wanted our books to include. We accomplished most of them, but not all. Without an animation and coding team, and using only InDesign, we had to compromise in a couple areas.

Without coding, we couldn't combine the animations with the sound effect. That hasn't been a problem for our beta testing kids, but it was on my ideal list, and we couldn't do it. 

The other limitation: when children tap on an animation more than once (and they love to do that), it can freeze or glitch the animation. It's no problem, pulling the page to the left (to the title page) and then to the right again, resets the animation. We also added the text "To reset animations pull page to left, and then the right" to help overcome that issue. So, it was fixable, but just an InDesign limitation to remember.  

We have yet to add our apps to the iTunes store, so I'll let you know how that goes, but if you're thinking about doing an app using InDesign, here are some links that'll help:

This is a white paper explaining how to take InDesign into iBookstore for Apple

This is a video walk through for submitting the app to Apple (you might want to see older videos in this series too, this looks like a great tutorial).

Step by Step guide to submitting the app from a DPS file

Some important quotes: "Creative cloud subscribers can create an unlimited number of “single issue” apps free of charge. if you are not a creative cloud subscriber, you can purchase serial numbers for creating single issue apps from the Adobe store. if you want to create a “Multi-issue” app, you will need a Professional or enterprise subscription to DPS."

"Note: Apple rejects many apps for being too “book-like.” Make sure that your folio is substantive and includes interactivity not available in ebooks. Also, do not select the “Books” category when submitting thapp."

Best of luck to you all! Let me know if your books turn into animated apps too!