There are a few considerations when preparing the graphics for a full-screen picture book or children's book, which will be compiled in iBooks Author^R. In this article, we will discuss those considerations. To simplify these tutorials, I am assuming that the target mobile device for your book is the iPad.

iPad Screens

One nice thing about Apple iPads is that, with the exception of the iPad Pro, each of the models have the same number of pixels on the screen. How can that be when each model is a different size? It's all in the resolution or pixels per inch. As you can see below, the two models with the smaller screen also have a higher ppi of 326. This higher ppi "squeezes" the image into the smaller screen.

iPad Air 2
9.7 in diagonal
retina 2048 by 1536 pixels 264 ppi
non-retina 1024 by 768 pixels 264 ppi

iPad Air
9.7 in diagonal
retina 2048 by 1536 pixels 264 ppi
non-retina 1024 by 768 pixels 264 ppi

iPad Mini 4
7.9 in diagonal
retina 2048 by 1536 pixels 326 ppi
non-retina 1024 by 768 pixels 326 ppi

iPad Mini 2
7.9 in diagonal
retina 2048 by 1536 pixels 326 ppi
non-retina 1024 by 768 pixels 326 ppi



What does it mean for the images of your book? You only need to make one set of retina ready images and your book will look good on all four iPad models. Apple suggests that you use the jpg format for opaque raster images. And if you need images with transparent areas, the png format is best. Apple also has a maximum pixel limit for interior images of 4 million pixels, according to the iBooks Asset Guide 5.2 Revision 3.

When I created my book apps with Kwik and Photoshop^R, I found it very helpful to take advantage of the layers feature in Photoshop. For each page of the book app, I put the background image on the bottom layer and the images that would be animated on layers above. When I exported the images, all background layers were exported as jpg and the other layers as pngs.

When I created the book apps, I exported all the images manually for both retina and non-retina iPads. However, iBooks Author will automatically create the non-retina, lower resolution image for you and display the correct image in your book depending on the resolution of the reader's device.

For those aspiring for a book app, you will be happy to know that there are now many Photoshop plugins available that will automate the export process. One that you might want to check out is DevRocket by Cazoobi which is available in their store, uistore.io.