Planning the Art for the Flash Storybook
You will notice that most iPad storybook apps begin with a static book cover and when the bottom corner of the book cover is clicked, the first page is displayed. There really isn't any reason for this except perhaps the difficulty of creating a complex animation in Xcode. However, it would be a waste not to use the FlashR IDE to create an animated first scene for our storybook.
This animated scene will be the first, and optional, part of the project. Because some may wish to use just a static book cover as the first scene of the app, we will start the second phase at the point that the intro scene animation has completed. Of course, you will want to create an intro animation that matches your storybook, which will probably not be a Christmas story. The purpose of Phase 1 is to introduce you to the Flash Timeline and ActionScript so that you can create your own intro. If you prefer not to have a fancy intro, you will want to start at the beginning of the second phase. In the second phase, we will build a complete storybook app including the pagination for the book, some animation and mobile interactivity such as the mobile Accelerometer, and several app management pages. These pages will include an Index, System Menu and a Credits page. We will go into the specifics of these pages later.
One of the greatest features of an iPad storybook is how well graphics are displayed on the mobile screen, so we will need some artwork for our experiment. Because many children's authors will be starting with existing artwork that they then scan into the computer, I decided to use some greeting card artwork for the first phase of our experiment. Throughout the series, you will find links in the menu below to articles discussing the preparation of the artwork for the project.
Planning the Artwork for Christmas Storybook Pages
Once the 5 pages are scanned into PhotoshopR, we still have five flat graphics. Now, we need to decide what parts of these graphics will be static and what parts will be animated.
For example, in the first page we have a Xmas fireplace scene with stockings hanging from the fireplace and a few cats resting on the floor next to the fireplace. We could create a simple animation that will jiggle a cat and play a meow sound file when the cat is touched. In preparation for this animation, we will need to remove the cats from the original art and place each of them on their own layer above the artwork. We can do this easily in Photoshop.
We will need to make these decisions for each page of the book. The best way to do this is to create a project storyboard.
← Back
IMPORTANT: These app development tutorials are written with the Flash novice in mind. You will need to optimize your app beyond what is covered in these tutorials before finalizing your app for the app store.
Copyright 2018 Adobe Systems Incorporated. All rights reserved. Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper is/are either [a] registered trademark[s] or a trademark[s] of Adobe Systems Incorporated in the United States and/or other countries.
This animated scene will be the first, and optional, part of the project. Because some may wish to use just a static book cover as the first scene of the app, we will start the second phase at the point that the intro scene animation has completed. Of course, you will want to create an intro animation that matches your storybook, which will probably not be a Christmas story. The purpose of Phase 1 is to introduce you to the Flash Timeline and ActionScript so that you can create your own intro. If you prefer not to have a fancy intro, you will want to start at the beginning of the second phase. In the second phase, we will build a complete storybook app including the pagination for the book, some animation and mobile interactivity such as the mobile Accelerometer, and several app management pages. These pages will include an Index, System Menu and a Credits page. We will go into the specifics of these pages later.
One of the greatest features of an iPad storybook is how well graphics are displayed on the mobile screen, so we will need some artwork for our experiment. Because many children's authors will be starting with existing artwork that they then scan into the computer, I decided to use some greeting card artwork for the first phase of our experiment. Throughout the series, you will find links in the menu below to articles discussing the preparation of the artwork for the project.
Planning the Artwork for Christmas Storybook Pages
Once the 5 pages are scanned into PhotoshopR, we still have five flat graphics. Now, we need to decide what parts of these graphics will be static and what parts will be animated.
For example, in the first page we have a Xmas fireplace scene with stockings hanging from the fireplace and a few cats resting on the floor next to the fireplace. We could create a simple animation that will jiggle a cat and play a meow sound file when the cat is touched. In preparation for this animation, we will need to remove the cats from the original art and place each of them on their own layer above the artwork. We can do this easily in Photoshop.
We will need to make these decisions for each page of the book. The best way to do this is to create a project storyboard.
← Back
IMPORTANT: These app development tutorials are written with the Flash novice in mind. You will need to optimize your app beyond what is covered in these tutorials before finalizing your app for the app store.
Copyright 2018 Adobe Systems Incorporated. All rights reserved. Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper is/are either [a] registered trademark[s] or a trademark[s] of Adobe Systems Incorporated in the United States and/or other countries.
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map
Follow @ArtAnimationTut
Tweet
Content copyright © 2023 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.