iAd Production Beginner’s Guide

Table of Contents

iAd Production

Credits

About the Author

About the Reviewer

www.PacktPub.com

Support files, eBooks, discount offers and more

Why Subscribe?

Free Access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Time for action — heading

What just happened?

Pop Quiz — heading

Have a go hero — heading

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Getting Started with iAd

Learning what an iAd is

Understanding problems with existing mobile advertising

Discovering what makes an iAd awesome

Describing the anatomy of an iAd

Understanding the banner's role

Using different banner types

Static image banner

Dynamic HTML5 banner

Transitioning into the ad

Slide transition

Reveal transition

Making loading interesting with the splash page

Exploring the core ad unit

Understanding your iAd

Structuring with HTML

Styling with CSS3

Interacting with JavaScript

Arranging the files

Using tools to create and test iAds

Introducing iAd Producer

Testing with the iOS Simulator and the iAd Tester app

Speeding development with iAd for Developers

Joining the developer program

Using the right hardware

You've got a Mac

Time for action — checking your Mac

What just happened?

Time to get a Mac

Becoming a registered developer

Time for action — signing up for the developer program

What just happened?

Summary

2. Preparing Your Content for Mobile

Including media in iAds

Overcoming mobile constraints

Designing for the small screen

Delivering content when download speeds are limited

Complying with file size restrictions

Working with images

Understanding the different image formats

Resizing an image

Time for action — cropping images using Preview

What just happened?

Cropping a section from an image

Time for action — cropping a selection

What just happened?

Removing solid background colors

Time for action — removing solid colors

What just happened?

Speeding up our image downloads

Time for action — optimizing an image

What just happened?

Pop Quiz — understanding images

Have a go hero — editing your own images

Including audio

Converting your audio

Time for action — converting an mp3 to work on iOS

What just happened?

Incorporating video

Converting your video

Time for action — encoding a video

What just happened?

Fine tuning your video

Video content

Your video's audio

Video dimensions

Video durations

Have a go hero — keeping in the guidelines

Pop Quiz — audio and video

Summary

3. Making Your iAd

Getting iAd Producer

Time for action — installing iAd Producer

What just happened?

Working with iAd Producer

Launch screen

Default ad

Template selector

Asset Library

Ad canvas

Setting up your ad

Time for action — creating a new project

What just happened?

Getting the resources

Building your banner

Time for action — making the banner

What just happened?

Have a go hero — writing good banner text

Time for action — changing the background

What just happened?

Have a go hero — learning about CSS3 gradients

Time for action — adding an image

What just happened?

Time for action — supporting all orientations

What just happened?

Pop Quiz — making banners

Making a splash

Time for action — making the splash screen

What just happened?

Previewing the ad

Time for action — testing your iAd

What just happened?

Adding a menu

Time for action — making a menu

What just happened?

Have a go hero — menu pages

Building the core ad pages

Inserting an image gallery

Time for action — making the image gallery

What just happened?

Have a go hero — cover flow gallery

Shaking a view

Time for action — shake shake shake

What just happened?

Letting users find our stores

Time for action — store finder

What just happened?

Pop Quiz — iAd Producer

Summary

4. Making Sure It Works

Testing in Safari

Time for action — going on Safari

What just happened?

Testing in the simulator

Installing Xcode and the iOS Simulator

Time for action — installing Xcode with the Mac App Store (easy)

What just happened?

Time for action — installing Xcode manually (harder)

What just happened?

Time for action — opening an ad

What just happened?

Interacting with the simulator

Time for action — simulating hardware in the simulator

What just happened?

Pop Quiz — the iOS Simulator

Time for action — simulating different devices

What just happened?

Have a go hero

Testing on the device

Installing iAd Tester

Time for action — putting iAd Tester on your devices

What just happened?

Accessing your development iAd

Copying to a device

Time for action — exporting our iAd

What just happened?

Time for action — copying our ad to the device

What just happened?

Testing on the device

Time for action — testing the ad

What just happened?

Wireless testing

Time for action — wireless deployment

What just happened?

Have a go hero — securing iAd Producer

Submitting your ad

Time for action — publishing on the network

What just happened?

Pop Quiz — when to test on what

Tackling common problems

Validating your ads

Time for action — validating your iAd

What just happened?

Troubleshooting common issues

Warnings about the file size of images

Slow performance

Imported images appear small

iAd tester doesn't show any ads

Time for action — checking the network you're connected to

What just happened?

Sharing a demo

Taking screenshots

Time for action — taking a screenshot

What just happened?

Recording a screen cast

Time for action — lights, camera, action

What just happened?

Have a go hero — creating a demo

Sharing an ad

Summary

5. Templates and Objects

The templates

Creating a banner from a template

Time for action — creating a banner

What just happened?

Exploring other banner templates

Using splash screens and preroll videos

Time for action — prerollin'

What just happened?

Alternative splash screen templates

Bouncing, dropping, and rotating

The Wave template

Have a go hero

Using the menu templates

Time for action — making the menu

What just happened?

Trying the available menu templates

Pop Quiz — menu

Creating more pages

Time for action — pages

What just happened?

Highlighting the notable page templates

Interacting with images: Cover Flow

Using a 3D gallery: Grid View

Revealing info with: Flip View

Have a go hero

Creating more advanced styles

Using style presets

Time for action — where's your style?

What just happened?

Changing states

Time for action — what a state!

What just happened?

Pop Quiz — styles and states

Going beyond templates with objects

Time for action — adding objects

What just happened?

Have a go hero

Time for action — more objects

What just happened?

Tweaking the transitions

Time for action — transitions

What just happened?

Adding some animation

Time for action — animations

What just happened?

Pop Quiz — animations and transitions

Finishing touches

Have a go hero — touched up

Summary

6. Ad Destinations and Actions

Opening external websites

Selling digital products

Time for action — downloading an app from our ad

What just happened?

Time for action — getting iTunes Store IDs

What just happened?

Time for action — fixing our ad

What just happened?

Pop Quiz — digital downloads

Advanced store finders

Time for action — adding a store finder

What just happened?

Time for action — hidden pages

What just happened?

Have a go hero

Sending a message

Time for action — sending the message

What just happened?

Summary

7. Building for the Big Screen

Creating an iPad iAd

Time for action — setting up an iPad project

What just happened?

Time for action — adding a banner to your iPad ad

What just happened?

Have a go hero

Filling the screen with HTML5 full screen banners

Time for action — providing multiple banner creatives

What just happened?

Time for action — creating an immersive video experience

What just happened?

Time for action — testing full screen banner situations

What just happened?

Pop Quiz — banners

Have a go hero — improving your banners

Making massive menus

Time for action — combining objects to create a unique menu

What just happened?

Have a go hero

Creating a grand gallery

Time for action — making memories in a gallery

What just happened?

Scrolling content with a scroll view

Time for action — scrolling content in our ad

What just happened?

Increasing footfall with a store finder

Time for action — adding the store finder

What just happened?

Have a go hero

Summary

8. Enhancing Our App with Code

JavaScript

The code editor

Accessing page objects

Time for action — accessing an object

What just happened?

Handling user events

Sending SMS and e-mails

Time for action — detecting a tap and sending an e-mail

What just happened?

Have a go hero

Time for action — adding something extra to our e-mail

What just happened?

Have a go hero

Pop Quiz — variables

Adding a calendar entry

Time for action — using the calendar

What just happened?

Have a go hero

Playing audio

Time for action — controlling an audio player

What just happened?

Tweeting with Twitter

Time for action — tweeting the tweet

What just happened?

Have a go hero

The debugger

Error checking syntax

Using the debugger

Coding conventions

Have a go hero

Summary

9. Managing a Successful iAd Campaign

Finding your audience

Targeting

Contextual advertising

Behavioral targeting

iAd targeting

Pricing models

Cost per Millie (CPM)

Pay per Click (PPC)

Flat rate PPC

Bid PPC

Cost per Action (CPA)

iAd's pricing model

Measuring success

Time for action — viewing the logs

What just happened?

Customizing the logs

Time for action — customizing the logs

What just happened?

Time for action — using sections

What just happened?

Pop Quiz — naming your ad's sections

Have a go hero — analytics

Going live

Have a go hero — test submission

Tracking the campaign

Summary

10. Adding iAds into Your App

Setting up the base project

Time for action — a placeholder app

What just happened?

Time for action — running on the device

What just happened?

Adding the banner to your view

Time for action — adding the banner

What just happened?

Handling orientation changes

Time for action — you spin me right round

What just happened?

Pop Quiz

Handling no available ads

Time for action — ban the banner

What just happened?

Have a go hero

Time for action — clean the code

What just happened?

Summary

11. Tracking Revenue and Fallbacks

Enabling live ads

Accepting the contract

Time for action — signing the dotted line

What just happened?

Enabling your ads

Time for action — enabling ads

What just happened?

Monitoring your income

Revenue

Impressions

Requests

Fill-rate

eCPM

Click-through rate

Time for action — analysing earnings

What just happened?

Pop Quiz — earning learnings

Fallbacks

Time for action — adding another ad

What just happened?

Have a go hero

Summary

A. Pop Quiz — Answers

Chapter 2, Preparing Your Content

Chapter 3, Making Your iAd

Chapter 4, Making Sure it Works

Chapter 5, Templates and Objects

Chapter 6, iAd Destinations

Chapter 7, Building for the Big Screen

Chapter 8, Creating Interactive Ads

Chapter 9, Managing a Successful iAd Campaign

Chapter 10, Adding iAds into Your App

Chapter 11: Tracking Revenue and Fallbacks

Index

iAd Production

iAd Production

Beginner's Guide

Copyright © 2012 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: February 2012

Production Reference: 1160212

Published by Packt Publishing Ltd. Livery Place 35 Livery Street Birmingham B3 2PB, UK.

ISBN 978-1-84969-132-1

www.packtpub.com

Cover Image by Asher Wishkerman (<a.wishkerman@mpic.de> )

Credits

Author

Ben Collier

Reviewers

Karl Norsen

Olivier Rabenschlag

Acquisition Editor

Sarah Cullington

Lead Technical Editor

Susmita Panda

Technical Editors

Apoorva Bolar

Naheed Shaikh

Copy Editor

Brandt D'Mello

Project Coordinator

Shubhanjan Chatterjee

Proofreader

Aaron Nash

Indexer

Monica Ajmera Mehta

Graphics

Manu Joseph

Production Coordinator

Prachali Bhiwandkar

Cover Work

Prachali Bhiwandkar

About the Author

Ben Collier is based in Brighton, UK and specializes in responsive HTML5 websites/cross-platform web-apps, and great native iOS apps on Apple's App Store. He enjoys the constraints and challenges of working with small-screen mobile devices, as it forces focus on the important content and functionality within an app. You can visit Ben's personal website at http://bencollier.net or follow him on Twitter at @ben_c.

Ben is a partner at Ocasta Studios, who make and manage mobile and small-screen apps across all the leading mobile platforms. Visit http://ocastastudios.com for more info.

I'd like to thank those key into making this book a reality; the countless cups of coffee, fresh olives, and episodes of Mad Men. My friends and family were incredibly patient through the late nights and long weekends during which they didn't get the attention they deserved, and for that I'm extremely grateful. The team at Packt Publishing did a fantastic job at keeping me on schedule and turning this book into a reality; working with them has been a pleasure.

About the Reviewer

Karl Norsen is a technology strategist, manager, and technical lead. He is passionate about leveraging new and emerging technologies in marketing and expanding on how businesses can use technology to further connect their brand with consumers. His background in both technology and advertising has given him a unique perspective on brand awareness, innovative digital media, and utilizing technology to facilitate lasting consumer connections. His future interests include further expanding the reach of a creative technical director and continuing to provide innovative solutions that build on the ever-increasing role of technology in brand and business success.

For more information, you can find his full profile on LinkedIn.

Olivier Rabenschlag's roots are back in the UK where he worked for a variety of advertising agencies as a creative director. He launched numerous Axe body spray campaigns for Unilever and took on digital duties for Sony Ericsson in Europe. In 2006 Olivier moved to Miami to work for Crispin Porter & Bogusky on clients including Burger King, Coke Zero, Sprite, and Volkswagen. After a year in New York following Crispin he eventually moved to Los Angeles where he's now the Group Creative Director of Media Arts at TBWA\CHIAT\DAY responsible for the agency's innovation and integration capabilities across emerging media platforms. Clients include Activision, The Grammys, Nissan, Infiniti, Pedigree and Visa. Olivier helped launch the world's first iAd for the Nissan Leaf that was also presented as a case study at Apple's worldwide developers conference in 2010 by Steve Jobs.

www.PacktPub.com

Support files, eBooks, discount offers and more

You might want to visit www.PacktPub.com for support files and downloads related to your book.

Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at for more details.

At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.

http://PacktLib.PacktPub.com

Do you need instant solutions to your IT questions? PacktLib is Packt's online digital book library. Here, you can access, read and search across Packt's entire library of books.

Why Subscribe?

Fully searchable across every book published by Packt

Copy and paste, print and bookmark content

On demand and accessible via web browser

Free Access for Packt account holders

If you have an account with Packt at www.PacktPub.com, you can use this to access PacktLib today and view nine entirely free books. Simply use your login credentials for immediate access.

Preface

Think of an iAd as a micro-app contained within an app, on a user's iPhone or iPad, that they've downloaded from the App Store. When the user taps your advert's banner, it bursts into life, filling the entire screen of their device.

iAd Beginner's Guide takes you from start to finish of building rich, compelling, and interactive iAds. You will learn how to create beautiful multi-page ads with store finders, social sharing, 3D images, and video galleries.

You will create ads that utilize the powerful technologies in the iPhone to make your brand shine. Once you have engaged the user, you can carry out targeted advertising campaigns with location-based coupons, store finders, and social engagement. Using the iTunes Store, you will see how it's even possible to add one-click digital content purchasing, right within your ad. Learn how iAd producer manages all the HTML5, JavaScript, and CSS3 behind your iAd. You will be creating emotive, gripping, and effective mobile advertising campaigns in no time.

What this book covers

Chapter 1, Getting Started with iAd, introduces you to iAd, the immersive mobile advertising platform from Apple. We'll look at what an iAd is, why they're awesome, and the underlying technologies they're written in.

Chapter 2, Preparing Your Content, shows the best techniques to get the most out of your media content.

Chapter 3, Making Your iAd, shows you how to install iAd Producer—the tool from Apple that allows us to make rich iAds. With drag-and-drop simplicity and step-by-step examples, we'll create our first demo iAd!

Chapter 4, Making Sure it Works, shows you how to test your ads on the device, or in the iOS Simulator, if you don't have access to the required hardware.

Chapter 5, Templates and Objects, presents the benefits and limitations of a large selection of templates and objects as we build another example iAd, using a range of the pre-built templates and objects in iAd Producer.

Chapter 6, iAd Destinations, shows you how to use the core of our ad to engage your user and induce them to perform an action, such as sharing your brand with a friend via email or downloading your digital content from the iTunes Store.

Chapter 7, Building for the Big Screen, shows you how to build more immersive iAds for the iPad. With its large multi-touch screen, we'll make an ad with even richer interactivity that'll work exclusively on the iPad.

Chapter 8, Creating Interactive Ads, teaches you how to modify the JavaScript code that powers your iAd by adding simple code snippets to enhance your ad with dynamic SMS/e-mail sharing and calendar events, to keep engaging the user with your brand after they've left your advertisement.

Chapter 9, Managing a Successful iAd Campaign, presents the best ways to manage a successful iAd campaign, adding tracking analytics into your ad, measuring user insights, and the targeting options available, to ensure you reach the ideal target audience.

Chapter 10, Adding iAds into Your App, teaches you how to add iAd into an existing application, to begin generating revenue, and intelligently animate banners in and out of view, depending on their availability.

Chapter 11, Tracking Revenue and Fallbacks, shows you how to integrate additional ad solutions when the iAd Network doesn't have an available banner in its inventory. Finally, you'll learn how to analyze the number of ads your app is displaying, and more importantly, how much you're earning!

What you need for this book

You’ll need to be a member of the iOS Developer program and have a Mac running Snow Leopard, OS 10.6 or later. We’ll look at getting or updating a Mac and joining the iOS Developer program in the first chapter. It’ll be useful to have an iPhone or iPad to test on, but isn’t vital as you’ll learn how to preview your ads without a device.

Who this book is for

This book is for brands, advertisers, and developers who want to create compelling and emotive iAd advertisements that generate revenue and increase brand awareness. You don't need previous experience of creating adverts or apps for iPhone and iPad, as you'll be taken through the entire process of making motion-rich, beautiful ads.

Conventions

In this book, you will find several headings appearing frequently.

To give clear instructions of how to complete a procedure or task, we use:

Time for action — heading

Action 1

Action 2

Action 3

Instructions often need some extra explanation so that they make sense, so they are followed with:

What just happened?

This heading explains the working of tasks or instructions that you have just completed.

You will also find some other learning aids in the book, including:

Pop Quiz — heading

These are short multiple choice questions intended to help you test your own understanding.

Have a go hero — heading

These set practical challenges and give you ideas for experimenting with what you have learned.

You will also find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: Duplicate, by copying and pasting, the line that contains CGPoint bannerOrigin and rename bannerOrigin to fallbackBannerOrigin.

A block of code is set as follows:

if (bannerView.bannerLoaded) {

// bring banner into view

bannerOrigin.y -= bannerView.bounds.size.height;

}

else {

fallbackBannerOrigin.y -= imageView.bounds.size.height;

}

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

if (bannerView.bannerLoaded) {

// bring banner into view

bannerOrigin.y -= bannerView.bounds.size.height;

}

else {

fallbackBannerOrigin.y -= imageView.bounds.size.height;

}

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: From the right-hand menu, select Set Up iAd Network.

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to<feedback@packtpub.com>, and mention the book title via the subject of your message.

If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or e-mail.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the