The launch of Apple’s iAd Network presents an exciting new opportunity to advertise on iOS devices. However, the process of building iAds seemed complex and time-consuming at first, and only few developers knew how to produce a good-looking iAd in HTML5.

That changed with the introduction of Apple’s iAd Producer, a free Mac application available to registered iOS developers – it will cost you $99 (£62) a year to become one. With a clean, intuitive interface, iAd Producer makes creating an iAd extremely easy, and you won’t have to write a single line of code if you don’t want to.

A basic iAd has a banner that sits at the bottom of the screen. Touch it and you’re taken to a series of pages that deliver more information or send you to a website where you can buy the product or service being advertised. The pages can contain text, images, video and carousels for a full multimedia experience. They’re built in HTML5, CSS3 and JavaScript – but with iAd Producer you won’t need any knowledge of these, and can instead concentrate on the design.

Step 1 Before using iAd Producer you need to create a banner, splash screen, menu screen – all mandatory – and at least three content pages.

For the iPhone 3/3GS, the banner should be 320 x 50 pixels (portrait) or 480 x 32 (landscape); for the iPhone 4 640 x 100 (portrait) or 960 x 64 (landscape), and for the iPad 768 x 66 (portrait) and 1,024 x 66 (landscape). The other pages should be 320 x 480 (iPhone 3/3GS), 640 x 960 (iPhone 4) or 768 x 1,024 (iPad). Here we’ll be creating an iAd for the iPad.

When you’ve got these assets together, launch iAd Producer, choose iPad as the target device for your iAd and click the Select button. Save the project.


Step 2 Double-click the Banner screen and choose a template; we’ll select the Image template to create a banner containing nothing except an image. Double-click the Banner screen again to open the screen editor. Click on the image to select it, go to the Inspector panel and bring in your banner image. Click the Overview button to return to the project chart.