Friday, March 25, 2011

Developing an iPad App: Step Four

The storyboard is now well defined, coming alive with sketches and interactive features. In Step Two I laid out each scene and identified interaction, animation and sound. As we got more into the process, seeing scene sketches from Kate, we added new interactions to many scenes.
Step Four: Merge Sketches with Storyboard
There are two types of animation that may occur in a scene:
  • One time animation that coincides with the narration
  • Interactive animation that happens when the reader interacts by touching or moving the iPad.
In the example scene (Scene 4) shown above, our main character, Aiden, developed during Step Three, feels hopeless finding himself in a prison cell. He just met the ugly prison guard who informed him he would face the King of Carrot Castle before the sun goes down.
(Narrator) “What am I going to do? I have to get out of here!” he whispered, burying his head in his hands.
A shuffling sound startled him. (1) He looked up to see a mouse scurry into a small hole in the carrot cell wall. “Hmmmm.” Aiden studied the hole in the wall. “The mouse eats carrots, but I don’t like carrots,” he said, wrinkling his face.

(Art Notes) Aiden sitting in the middle of the prison cell with his head buried in his hands, his dinner fork in his pocket. (spot illus.) Aiden's head up to see mouse. (spot illus.) Mouse running (two views--legs stretched out, legs in).

(One time animation) (1) Aiden looks up, mouse runs into hole

(Continuous animation) sparkling dust flying around in light from window. Shake iPad to make it move.

(Interactive animation) Touch hole to see mouse pop out.

(Sound notes) shuffling sound, mouse squeaks
At narration point (1), Aiden changes pose to see the mouse scurry across the floor and disappear in a hole. Those are the one-time animations for Scene 4. Interactive animations include a continuous animation that the reader can interact with—you see dust floating in the beam of light cast by the cell window that scatters when you shake the iPad. Also, touching the mouse hole makes the mouse appear with a squeak.

Kate came up with several fun games for the reader to do that helps move the story along. In addition, an entertaining sidebar enlists the reader to dress a knight in his armor, making him ready for the big castle search when Aiden escapes.

Our next actions include:
  1. Nur animating Scene 4 and 5 using rough sketches and spot poses.
  2. Kate working on color studies of Aiden and some scenes.
  3. I am putting together a payment agreement for the three of us with an attorney.
Stay tuned for the next step when I am sure to have color for you to marvel over.


  1. Sounds like things are moving right along and that you're having fun. That's great.

  2. This looks like a fun book and I'm impressed with your ability to do it.

  3. This is fascinating! Thanks for sharing your process with us!

  4. Thanks for stopping by, Beth and Jan. This is definitely a learn by doing project.



Related Posts Plugin for WordPress, Blogger...