ITB Tutorial Lesson 3 – Adding background images

By Ameen Saafir on April 25th, 2012

Okay, so you created your images and setup your book using our online authoring tool. Now it’s time to take the next step and create your first page! This lesson will cover adding different types of images to the page and positioning them where you want them. Then in the following lessons we will learn about how to make them move, play sound effects, animate, and other awesome ways to bring your book to life. Let’s get started!

Adding a background image

Background images are the static backdrop for your interactive book.  There is no interactivity associated with them and they will always show up on the lowest layer.  It is also a good idea to upload these as background images so that we can account for different screen formats (like iPhone vs iPad) by just resizing the background, and not touching any of the foreground images.  To upload a background image:

  • Select Add Media from the toolbar
  • Select Background Image from the dropdown menu
  • Pick the image you would like to use
  • Click Add, and you’re done!

Here’s a short video of the process: 

A tip from Deeno: Hey guys, so one of the challenges of creating interactive books is the iPad and iPhone have different aspect ratios. Most authors choose to just stretch the background image for iPhone or add black “letterbox” bars to the side of the book. This works fine, but for the perfectionist we have a third option. When you are done with the iPad version of the book, you can go back and change the background images manually on the iPhone version so they are perfect. You need to plan for this now, though, by creating a separate background image for each page at 960×640 resolution and 300ppi. I wouldn’t worry about the foreground images, they scale fairly well. Hope that helps!