IAD-生产环境初学者指南-全-

IAD 生产环境初学者指南（全）

原文：zh.annas-archive.org/md5/92ec84291f104771530e0f47c706115a

译者：飞龙

协议：CC BY-NC-SA 4.0

前言

将 iAd 想象成一个包含在应用程序中的微型应用程序，位于用户下载自 App Store 的 iPhone 或 iPad 上。当用户点击您的广告横幅时，它将瞬间活跃起来，填满他们设备的整个屏幕。

iAd 入门指南将指导您从零开始构建丰富、引人入胜且交互式的 iAd。您将学习如何创建带有商店搜索、社交分享、3D 图像和视频画廊的多页广告。

您将创建利用 iPhone 强大技术的广告，让您的品牌熠熠生辉。一旦您吸引了用户，您可以使用基于位置的优惠券、商店搜索和社交互动进行定向广告活动。使用 iTunes Store，您将了解甚至可以在广告中添加一键数字内容购买功能。学习 iAd Producer 如何管理您 iAd 背后的所有 HTML5、JavaScript 和 CSS3。您将迅速创建情感丰富、引人入胜且有效的移动广告活动。

本书涵盖内容

第一章, 开始使用 iAd，向您介绍苹果公司的沉浸式移动广告平台 iAd。我们将探讨什么是 iAd，为什么它们如此出色，以及它们所使用的底层技术。

第二章, 为内容准备，展示了获取媒体内容最大效益的最佳技巧。

第三章, 制作您的 iAd，向您展示如何安装 iAd Producer——苹果公司提供的工具，允许我们制作丰富的 iAd。通过拖放简单性和逐步示例，我们将创建我们的第一个演示 iAd！

第四章, 确保其正常工作，向您展示如何在设备上或在 iOS 模拟器中测试您的广告，如果您无法访问所需的硬件。

第五章, 模板和对象，在构建另一个示例 iAd 时，展示了大量模板和对象的优缺点，我们使用了 iAd Producer 中的预建模板和对象。

第六章, iAd 目的地，向您展示如何使用广告的核心来吸引您的用户并诱导他们执行操作，例如通过电子邮件与朋友分享您的品牌或从 iTunes Store 下载您的数字内容。

第七章, 为大型屏幕构建，向您展示如何为 iPad 构建更沉浸式的 iAd。凭借其大型的多点触控屏幕，我们将制作一个具有更丰富交互性的广告，该广告将仅在 iPad 上运行。

第八章, 创建交互式广告，教您如何通过添加简单的代码片段来修改驱动您 iAd 的 JavaScript 代码，增强您的广告以动态 SMS/电子邮件共享和日历事件，在用户离开您的广告后继续与您的品牌互动。

第九章, 管理成功的 iAd 活动，介绍了管理成功 iAd 活动的最佳方式，将跟踪分析添加到您的广告中，衡量用户洞察力，以及可用的定位选项，以确保您达到理想的目标受众。

第十章, 将 iAd 添加到您的应用中，教您如何将 iAd 添加到现有应用中，开始生成收入，并根据其可用性智能地切换横幅的显示和隐藏。

第十一章, 跟踪收入和回退，展示了当 iAd 网络的库存中没有可用的横幅时如何集成额外的广告解决方案。最后，您将学习如何分析您的应用显示的广告数量，更重要的是，您能赚多少钱！

你需要这本书的物品

您需要成为 iOS 开发者计划的成员，并拥有运行 Snow Leopard、OS 10.6 或更高版本的 Mac。我们将在第一章中探讨获取或更新 Mac 和加入 iOS 开发者计划。拥有 iPhone 或 iPad 进行测试将很有用，但不是必需的，因为您将学习如何在没有设备的情况下预览您的广告。

这本书面向的对象

这本书是为希望创建引人注目且富有情感色彩的 iAd 广告以产生收入并提高品牌知名度的品牌、广告商和开发者而编写的。您不需要有创建 iPhone 和 iPad 广告或应用的先前经验，因为您将经历制作动感丰富、美丽的广告的整个过程。

惯例

在这本书中，您会发现几个经常出现的标题。

为了给出如何完成一个程序或任务的清晰说明，我们使用：

行动时间 — 标题

1. 行动 1

2. 行动 2

3. 行动 3

指示通常需要一些额外的解释，以便它们有意义，因此它们后面跟着：

刚才发生了什么？

这个标题解释了你刚刚完成的任务或指示的工作原理。

你还会在书中找到一些其他的学习辅助工具，包括：

快速测验 — 标题

这些是旨在帮助您测试自己理解的简短多项选择题。

尝试一下英雄 — 标题

这些设定了实际挑战，并给你提供了实验你所学内容的想法。

你还会发现许多不同类型的文本样式，以区分不同的信息。以下是一些这些样式的示例及其含义的解释。

文本中的代码单词显示如下：“通过复制和粘贴，复制包含CGPoint bannerOrigin的行，并将bannerOrigin重命名为fallbackBannerOrigin。”

代码块设置如下：

if (bannerView.bannerLoaded) {
// bring banner into view
bannerOrigin.y -= bannerView.bounds.size.height;
}
else {
fallbackBannerOrigin.y -= imageView.bounds.size.height;
}

当我们希望您注意代码块中的特定部分时，相关的行或项目将以粗体显示：

if (bannerView.bannerLoaded) {
// bring banner into view
bannerOrigin.y -= bannerView.bounds.size.height;
}
else {
fallbackBannerOrigin.y -= imageView.bounds.size.height;
}

新术语和重要词汇以粗体显示。您在屏幕上看到的单词，例如在菜单或对话框中，在文本中显示如下：“从右侧菜单中选择设置 iAd 网络。”

注意

警告或重要注意事项以如下框中的形式出现。

注意

技巧和窍门以如下形式出现。

读者反馈

我们始终欢迎读者的反馈。请告诉我们您对这本书的看法——您喜欢什么或可能不喜欢什么。读者反馈对我们开发您真正能从中受益的书籍非常重要。

要向我们发送一般性反馈，只需发送一封电子邮件到<feedback@packtpub.com>，并在邮件主题中提及书籍标题。

如果有您需要的书籍并希望我们出版，请通过www.packtpub.com上的建议标题表单或通过电子邮件<suggest@packtpub.com>发送给我们。

如果您在某个主题上具有专业知识，并且您对撰写或为书籍做出贡献感兴趣，请参阅我们的作者指南www.packtpub.com/authors。

客户支持

现在，您已经是 Packt 书籍的骄傲拥有者，我们有一些事情可以帮助您从您的购买中获得最大收益。

下载示例代码

您可以从www.PacktPub.com下载您购买的所有 Packt 书籍的示例代码文件。如果您在其他地方购买了这本书，您可以访问www.PacktPub.com/support，注册以直接将文件通过电子邮件发送给您。

勘误

尽管我们已经尽一切努力确保内容的准确性，但错误仍然可能发生。如果您在我们的书中发现错误——可能是文本或代码中的错误——如果您能向我们报告这一点，我们将不胜感激。通过这样做，您可以节省其他读者的挫败感，并帮助我们改进本书的后续版本。如果您发现任何勘误表，请通过访问www.packtpub.com/support，选择您的书籍，点击勘误提交表单链接，并输入您的勘误详情来报告它们。一旦您的勘误得到验证，您的提交将被接受，勘误将被上传到我们的网站，或添加到该标题的勘误部分下的现有勘误列表中。任何现有勘误都可以通过从www.packtpub.com/support选择您的标题来查看。

侵权

在互联网上对版权材料的盗版是一个跨所有媒体的持续问题。在 Packt，我们非常重视我们版权和许可证的保护。如果您在互联网上发现我们作品的任何非法副本，无论形式如何，请立即提供位置地址或网站名称，以便我们可以寻求补救措施。

请通过<copyright@packtpub.com>与我们联系，并提供疑似盗版材料的链接。

我们感谢您在保护我们作者以及为我们提供有价值内容的能力方面的帮助。

问题

如果您在本书的任何方面遇到问题，可以通过<questions@packtpub.com>联系我们，我们将尽力解决。

第一章：iAd 入门

iAd 是苹果提供的激动人心的移动广告机会。

在本章中，我们将探讨：

• iAd 是什么

• 使 iAd 变得出色的因素

• iAd 的结构

• 驱动 iAd 的技术

• 可用于构建你自己的 iAds 的工具

• 如何访问工具

了解 iAd 是什么

苹果在 2010 年夏季宣布支持 iAd，允许你直接针对在应用商店购买的应用程序中的客户投放令人惊叹的互动广告。每个 iAd 最初都是一个用户个人设备上的小型激动人心的横幅，一旦激活就会瞬间填满整个屏幕，为你，广告商，提供了一个精心打造深度沉浸式体验的机会。

应用开发者可以在苹果应用商店的他们的应用程序中为你的 iAd 指定空间，横幅在整个应用程序使用过程中位于屏幕底部。通常，iAds 比它们所在的应用程序更有趣！

iAds 内置在 iOS 4.0 及之后的苹果 iPhone、iPod touch 和 iPad 操作系统。

注意

将 iAd 想象成用户从苹果应用商店下载的第三方应用程序中的迷你应用程序。

使用 iAd，你的广告将被以下受众观看：

• 自 2008 年应用商店开业以来，已安装超过 150 亿个应用程序

• 已激活超过 2.25 亿个 iTunes 账户，每个账户都与一张信用卡绑定，实现一键计费（甚至在你使用 iAd 时）

• 全球每秒下载 200 个新应用程序

• 平均每天花费 73 分钟使用应用程序

• 每次访问平均与 iAd 广告互动 60 秒

苹果在其产品中设定了一定的质量标准，这在他们应用商店提供的广泛应用程序中得到了体现。然而，移动广告通常是用户不愉快的体验。对此不满，苹果决定在数百万用户的手机中构建一个独特的广告平台。

2011 年初，苹果宣布支持 iPad 的 iAd，这为我们提供了全面访问丰富交互式多点触控画布的机会，以我们以前只能想象的方式推广我们的品牌或产品。

注意

许多使用 iAds 的公司会制作一个促销视频，只是为了展示他们的广告！你有时会发现，使用 iAd，你将获得额外的公关机会，因为每个体验都是如此动态和不同，人们喜欢谈论它们。

每个 iAd 展示都可以针对以下内容：

• 人口统计信息： 目标性别或年龄

• 应用偏好： 用户的购买和下载趋势可以揭示他们的偏好

• 音乐热情： 尽管用户的音乐品味不是一个明显的有用定位技术，但由 iTunes 监控的收听习惯可以识别出特定的受众群体。这就是广播广告定位的方式。

• 电影、电视和有声书兴趣类型： 由于每个设备都与 iTunes 账户相关联，苹果可以访问用户的商店购买和媒体兴趣。

• 位置： 每个 iOS 设备都内置了位置功能；因此，如果您有实体店，您可以针对附近的潜在客户进行定位，可能还有本地的时间敏感优惠。

• 设备（iPhone、iPod touch 或 iPad）： iAd 网络让您可以为不同的 iOS 设备设计并定位独特的广告，为每个体验量身定制，以充分利用可用的硬件。

• 网络（Wi-Fi、3G）： 如果用户连接到 Wi-Fi，他们更有可能处于会与您的 iAd 互动的情况，因为 Wi-Fi 主要在静态位置可用，用户有更多时间关注您的广告。

苹果管理着整个广告投放过程，包括在 iAd 网络上托管广告，并通过无线方式将它们发送到 iOS 设备上的受众。

备注

苹果允许用户通过访问 iOS 4.0+设备上的oo.apple.com/来选择退出基于兴趣的广告。这仍然会将 iAd 发送给用户，但没有任何针对特定用户的目标。显然，苹果并没有公开宣传这一点，只有少数高级用户会选择退出。

理解现有移动广告的问题

移动广告并非新概念，但在 iAd 出现之前，它从未真正做对。它充斥着铃声、壁纸和高级短信服务，用户往往在不经意间被订阅了服务。这更多的是关于直接向客户推广付费移动媒体，而不是推广优秀的品牌和产品。

应用内广告开始针对更具体的品牌，但几乎所有移动广告都会将用户从当前的应用程序中推出，并使其无法轻易回到之前的位置。通常，用户会被推送到移动浏览器，到一个通常不是为移动设备设计的网页，缺乏用户的交互性和响应性。在 iAd 之前，典型的移动横幅广告可能是一个隐藏在用户应用程序中的普通静态条带，而不是嵌入到核心操作系统中的交互式广告。

在桌面端，大部分广告收入来自搜索，但移动用户正在使用更具体的应用程序来查找他们想要的信息。如果您想找到一个不错的餐厅，您更有可能打开餐厅目录应用程序，而不是进入移动浏览器并使用搜索引擎。上下文感知应用程序正在成为用户在移动设备上查找事物的方式。您的 iAd 在这些应用程序中智能定位，提供相关、上下文和令人兴奋的营销机会。

发现是什么让 iAd 变得出色

与传统的移动广告不同，每个 iAd 都提供了一个应用内交互式广告，它不会将用户推出应用程序。您以前从未能够以如此沉浸式的体验来推广您的品牌或产品，与用户的指尖互动。

尼尔森公司的一项研究比较了坎贝尔汤电视广告活动与他们的 iAd 移动广告，发现与 iAd 互动的用户是：

• 记忆广告的可能性高出两倍

• 记忆信息的可能性高出三倍

• 购买的可能性高出四倍

当信息与我们要他们吸收的信息互动时，人们记得更好。每个 iAd 都获得了访问深度沉浸式设备功能的机会，从全多点触控屏幕（允许用户近距离缩放并浏览您产品的图片）到设备的物理运动（允许他们使用摇晃来显示关于您品牌的随机信息或事实），iAds 提供了前所未有的引人入胜、互动和难忘的体验机会。

集成在 iAd 中的独特功能使得用户能够以多种引人入胜的方式与您的品牌互动，例如以下几种：

• 在 iAd 内下载应用程序或购买 iTunes 媒体： 如果您在 iTunes Store 或 App Store 上有可用的内容，例如您想要推广的电影或应用程序，用户可以在您的 iAd 中轻触一次即可购买，而无需离开他们当前的应用程序

• 将屏幕截图保存到相册： 像优惠券、条形码、食谱或品牌壁纸这样的图片可以直接保存到用户的设备上，或者立即设置为他们的背景

• 查看内联音频和视频： 视频可以在您的 iAd 中的自定义框架内播放，并叠加交互元素

• 查找附近的商店： 由于每个 iOS 设备都内置了丰富的 Google Maps，因此很容易显示您附近的商店或零售商列表

• 在不离开广告的情况下通过 Twitter 分享内容： iAd 框架是完全可扩展的，因此可以实现社交分享和几乎任何功能

在任何时候，用户都可以点击位于 iAd 右上角的关闭按钮，返回他们之前的应用程序，这使得他们更愿意点击 iAd，并将您的品牌与积极的体验联系起来。在这里，您可以看到演示广告中的关闭按钮：

通过 iAd，苹果公司创造了一种体验，它同时结合了传统在线广告的互动性和电视广告的情感因素。

注意

查看尼桑 leaf iAd 促销视频（在 YouTube 等视频网站上搜索Nissan Leaf iAd）；这是一个在 iAd 中激发情感并展示 iAd 平台巨大灵活性的绝佳例子。

描述 iAd 的解剖结构

一个 iAd 由四个关键部分组成，具体如下：

1. 横幅广告。

2. 从横幅切换到主要广告。

3. 启动页。

4. 核心广告单元。

理解横幅的作用

横幅是您广告的第一印象；它至关重要，必须激发用户点击它并探索您在 iAd 中等待的所有其他精彩内容。横幅可以通过横幅右下角的小标志识别，如下面的截图所示：

iAd 标志增加了用户点击您的广告的可能性，因为他们知道他们将获得一个丰富的沉浸式广告，而不会失去他们所在的应用位置。

横幅通常显示在屏幕底部或用户应用的标签栏上方，如下面的截图所示：

使用不同的横幅类型

您可以为您的 iAd 使用两种类型的横幅 - 一种静态图片横幅或一种动态 HTML5 横幅。

静态图片横幅

静态图片横幅是一种更为传统的横幅，通常因为它快速简单而被选择。

您的静态横幅可以是横幅框架的大小，也可以是一个屏幕尺寸的静态横幅，其中只有横幅中的一部分图像可见，当用户点击查看您的广告时，将显示完整图像。

动态 HTML5 横幅

HTML5 动态横幅为用户参与提供了更多机会，因为它允许动画文本和图形。在横幅中添加运动和动画可以使它在使用者的设备上脱颖而出，吸引他们的注意力，并增加他们点击了解更多关于您品牌信息的可能性。

使用 HTML5 横幅，您能够远程更新横幅中的数据，使用实时信息，如最新的体育比分或股票报价。

进入广告的切换

切换发生在用户点击横幅进入您的 iAd 时；它使进入启动页的过程变得柔和，并在两者之间创建视觉连接。切换可以是滑动或揭示。

幻灯片切换

幻灯片切换是展示您的启动页最常见的方式。它从横幅中推起一个全色块，覆盖用户当前所在的 app。一个进度条显示了您的启动屏幕加载的状态。

揭示切换

您只有在使用屏幕尺寸静态横幅时才应使用揭示切换。它将用户 app 中的用户界面元素推开，以揭示您的 iAd 启动屏幕。以下截图显示了本书稍后我们将创建的广告中的揭示切换：

使用启动页使加载变得有趣

启动页是一个可选的屏幕；它在主要 iAd 资源加载时显示，在用户点击您的横幅和能够与核心广告单元交互之间显示。

虽然闪屏页是可选的，但在你的广告资源加载期间传达你的品牌信息是一个理想的机会。

苹果估计，一旦用户进入你的 iAd，你有 15 秒的时间赢得他们的注意力，所以一个引人入胜的闪屏页确保我们在等待时保持他们的满意度。

闪屏页可以用来在过渡到主要广告之前展示有关你的品牌或产品的有趣统计数据或功能。

注意

即使你认为你的 iAd 轻量级且不需要下载时间，用户通常在缓慢的移动数据连接上，小广告不会立即加载。

在闪屏页上也可以使用预播放视频，尽管有了轻量级的 CSS3 动画和样式，我们可以将动态效果应用于图像和文本，这通常可以模仿视频，而不需要与流媒体视频相关的大（且慢）下载。

探索核心广告单元

这是你的 iAd 的主要内容，在这里你有真正的机会以多种令人兴奋的方式传达你的内容。核心广告单元由多个视图组成；将这些视为网站的不同页面，每个页面都有各种媒体和内容，以激发用户对你的品牌或产品的兴趣。

广告单元从根视图开始，通常用于导航，在 iAd 内的不同视图之间切换。

根视图的子页面提供了提供以下内容的机会：显示用户最近商店或零售商位置的动力地图，惊人的 3D 交互式视频旋转木马和图片库，或者仅限于你想象力的空白画布！以下是可以在你的 iAd 中使用的一些模板的选择，以帮助你了解你可以包含的内容类型：

理解你的 iAd

iAd 本质上是一个包含在用户已安装的应用程序中的丰富动态网页。就大部分而言，我们不需要担心正在发生的事情，因为苹果提供的工具为我们管理这些。话虽如此，了解驱动你的 iAd 的魔法总是好的。

HTML5 是 iAd 框架的底层技术。它基于 Web 的未来，下一代 HTML（并且错误地宣传为包括对 JavaScript 和 CSS 的增强）。我们的 iAd 可以结合使用 JavaScript 和 CSS 的最新功能。

使用 HTML 进行结构化

HTML5，即第五代HTML（超文本标记语言），是您页面的内容和语义结构。

视频、音频以及其他传统上需要插件（如 Flash，iOS 著名地不支持）的东西，现在可以使用 HTML5 来实现。

注意

对于好奇的人来说，如果你在网页上右键单击并选择查看源代码，你可以查看创建该页面结构和包含该页面内容的底层 HTML。

使用 CSS3 进行样式设计

CSS （层叠样式表） 的第三版允许在您的 iAd 中进行视觉样式设计。使用 CSS3，可以不使用图像就完成圆角和背景渐变的样式设计，这意味着您的 iAd 轻量级，并且能够更快地将品牌信息传递给用户。CSS3 具有丰富的动画能力，可以为您的 iAd 和横幅带来活力。

CSS3 具有平滑、硬件加速的 3D 效果，您可以将这些效果应用到您的 iAd 资产中，并结合动画。丰富的 3D 动画增加了您广告的互动性。

与 JavaScript 交互

JavaScript 是一种用于控制您 iAd 内部交互的编程语言。每当在某个地方轻触或捏合导致与您的 iAd 交互时，幕后 JavaScript 将控制这一点。JavaScript 能够访问用户位置以查找当地商店并提供基于位置的促销活动。JavaScript 可以使用 AJAX 技术从您的网站远程获取最新的优惠和信息，以创建动态且最新的体验。

文件排列

每个 iAd 都是一个文件夹，其中包含了用于您的横幅和广告单元的 HTML、CSS、JavaScript 和媒体文件。在下面的屏幕截图中，我们可以看到典型 iAd 的文件结构：

如果您愿意，您可以使用文本编辑器仅通过操作这些文件来创建整个 iAd。幸运的是，iAd Producer 在我们使用它创建 iAd 时会为我们创建和更新这些文件。

使用工具创建和测试 iAd

我们将使用的主要工具是 iAd Producer，这是一个简单的拖放工具，用于构建、测试和分发令人惊叹的交互式 iAd。

介绍 iAd Producer

iAd Producer 管理您 iAd 中的所有 HTML5、CSS3 和 JavaScript，而无需您编写任何代码。在下面的屏幕截图中，我们可以看到 iAd Producer 丰富的视觉界面：

iAd Producer 提供了您 iAd 的结构和流程的视觉概述。使用它，您只需点击几次即可添加额外的子页面并重构整个 iAd。

您的所有媒体资产都存储在中央资产库中，该库自动管理对高分辨率和低分辨率显示的支持，通过优化资产以适应更新 Apple iOS 设备中使用的 Retina 显示屏。

注意

Retina 显示屏是苹果公司在 iPhone 4 和 iPod Touch 及后续设备上使用的高分辨率屏幕。它的分辨率是旧设备的两倍，具有如此高的像素密度，以至于您的眼睛无法看到单个像素。这样鲜艳、清晰、锐利的屏幕可以让您的品牌在 iAd 中充分利用。要了解更多关于 Retina 显示屏的信息，请访问 www.apple.com/iphone/features/retina-display.html。

我们可以通过将图片和视频拖放到 iAd Producer 预构建的动感丰富的 3D 轮播图中来构建整个广告。菜单会自动生成，供用户探索和浏览您的 iAd。

iAd Producer 使您能够轻松地将视觉动画和效果应用到您的内容上，这是为您的 iAd 增添个性和兴奋感的好方法，而不需要视频的沉重负担。这些动画包括擦除、淡入淡出、旋转效果和立方体过渡，可以应用于媒体项目、文本，甚至整个页面。

为了创建用户熟悉的视觉冲击体验，iAd Producer 包含了一个丰富的轮播图、按钮、音频或视频播放器和画廊库；所有这些都可以通过简单的拖放添加到您的 iAd 中。

在制作您的广告的过程中，iAd Producer 会验证和检查您的项目，识别常见问题，例如图像大小或格式不正确，或者您忘记配置某个页面。这意味着您可以尽早发现问题，并专注于创建您的广告。

要扩展您 iAd 的功能，超出 iAd Producer 内置的功能，我们能够查看、编辑和扩展它创建的代码，以创建更酷的功能，如分享您的内容、测验或竞赛。

一旦您完成了您的 iAd，iAd Producer会对您的资源进行打包和优化，以减少大小和所需时间，将完整的广告体验传递给用户。

使用 iOS 模拟器和 iAd Tester 应用进行测试

iOS 模拟器是一个运行在您的 Mac 桌面上的虚拟 iPhone 或 iPad，是测试您无法购买或尚未公开的设备的快捷方式。它支持大多数真实设备会有的功能，例如方向和摇晃。方向允许设备知道何时旋转，并相应地更新屏幕内容。同样，通过摇晃，我们可以在用户摇晃设备时更新屏幕内容。在 iOS 模拟器中，我们可以从菜单中模拟这些旋转和摇晃；不幸的是，摇晃或旋转您的 Mac 不会产生类似的结果。

注意

即使您可以在没有设备的情况下测试您的 iAd，但在真实的 iPhone 上测试是至关重要的，因为 iAd 在模拟器中通常会加载和运行得更快。这是因为模拟器能够使用您系统的全部资源。

iAd Tester 应用是一个您可以安装到您的 iPhone、iPod 或 iPad 上的移动应用程序，通过 iTunes 进行安装。iAd Tester 应用能够远程连接到您 Mac 上的 iAd Producer，并允许您测试您的 iAd 在其他开发者的应用中会如何显示。

要访问 iAd Producer、iPhone/iPad 模拟器或测试您的 iAd 在设备上，您需要加入Apple 开发者计划。

使用 iAd 加速开发者开发

如果你已经有了自己的 iOS 应用程序，苹果有一个预构建的 iAd 包，用于驱动你的应用程序的下载，称为iAd for Developers。要使用它，你需要有一个在 App Store 上活跃的应用程序，然后通过advertising.apple.com/contact/上的表格联系苹果，并选择iAd for Developers来推广应用程序。单页 iAd 几乎与你的 App Store 列表相同，看起来类似于以下示例：

加入开发者程序

要访问完整的苹果文档和 iAd 工具，你需要成为付费的苹果 iOS 开发者计划的成员。这需要每年支付 99 美元，并为你提供访问 iAd Producer 的权限，这是我们将在整本书中使用来为你的品牌构建一些优秀的 iAds 的工具。

注意

别担心，尽管它被称为开发者程序，但你不需要是开发者或拥有开发技能，就可以使用这本书中探讨的技术。

使用正确的硬件

我们将在本书中使用苹果软件要求你使用他们最新的 Mac OS X 操作系统和硬件。

你拥有 Mac

如果你已经有了 Mac，它必须是一款 Intel Mac，运行 Mac OS X Snow Leopard 或更高版本。

检查你的 Mac 的行动时间

要检查你的 Mac 是否运行 Snow Leopard，请按照以下步骤操作：

1. 点击屏幕左上角的苹果图标，然后选择关于本机。如果版本中包含10.6或更高版本，你正在运行 Snow Leopard 或更高版本，可以安装我们将要使用的工具。

2. 如果你的版本低于10.6，我们可以通过检查你的处理器是否包含Intel来查看你是否能够升级，从关于本机。在这里我们可以看到操作系统版本是10.7.1，即高于 10.6，因此与 iAd Producer 兼容：

• 如果你拥有 Intel 处理器，你可以通过从苹果商店或零售商购买 Mac OS X Snow Leopard 升级盘来升级到 Snow Leopard（v. 10.6）。一旦升级到 Snow Leopard，你可以选择通过 Mac App Store 更新到 Mac OS Lion。

刚才发生了什么？

关于本机屏幕会告诉你你的 Mac 的技术规格以及它所使用的操作系统。

如果你没有 Intel 处理器，并且关于本机屏幕显示你的处理器为PowerPC，很遗憾，你不能升级到 Snow Leopard；是时候获得一台应得的全新机器了！

购买 Mac 的时间

当前系列中的任何 Mac 都应该能够运行 iAd Producer；所以，如果你已经关注了一段时间，就给自己一个惊喜吧！

如果你已经有了屏幕、键盘和鼠标，Mac Mini 是开始的最便宜方式。如果你想要从头开始，MacBook 或 iMac 可以很好地处理 iAd 生产和开发。

如果您计划购买一台二手机器，任何 2009 年中或之后的型号都应该预装了 Mac OS X Snow Leopard，并且能够运行 iAd Producer。使用前面概述的步骤来查看潜在的机器是否合适。

成为注册开发者

要访问 iAd Producer 工具和广泛的苹果 iAd 文档，您需要一个付费的开发者账户。让我们注册 iOS 开发者计划。

行动时间——注册开发者计划

按照以下简单步骤，您将很快就能访问开发者计划：

1. 访问 developer.apple.com/programs/start/standard/ 并在左下角点击继续。您将设置一个新的苹果开发者账户，并会被询问是否有一个您想使用的苹果 ID。如果您有 iTunes 或 MobileMe 账户，可以使用这个 ID。然而，当为您的公司或客户创建 iAds 时，您应该创建一个新的苹果 ID。这样可以确保账单和发票与您的个人账户分开。

2. 您可以设置个人账户或公司账户；选择与您相关的账户。

   注意

   设置公司账户可能需要大约两周的时间来验证您的公司信息，所以请尽快设置以避免在构建您的 iAds 过程中出现延误！

   • 如果您正在设置一个新的苹果 ID，您现在需要输入您的个人信息、密码和一般安全信息，然后点击继续。您将被要求完成一个专业档案；这只是苹果的一个调查，您选择的值不会影响您设置的账户。苹果将在几分钟内向您发送一封确认电子邮件；您可以选择点击此电子邮件中的链接来激活您的账户，或者将其复制到注册过程中的文本框中。恭喜，您已成为注册的苹果开发者！现在，您需要注册 iOS 计划。

3. 输入您的账单地址详情并点击继续。您将被要求选择您想注册的计划；勾选iOS 开发者计划并点击继续。

4. 您现在有机会审查您的信息，确保 iOS 开发者计划在开发者计划下，并且您的个人/账单信息是正确的。通过点击继续来确认这些细节。

5. 阅读苹果开发者协议并勾选框以接受它。点击我同意。

   注意

   苹果开发者协议主要针对在 App Store 上构建和分发应用程序，但在接受之前请确保您已全面审查。

6. 您现在可以通过点击加入购物车来购买 iOS 开发者计划。

7. 选择结账，一旦您的申请被处理，您将加入该计划。

刚才发生了什么？

使用苹果创建 iOS 开发者账户可以访问他们为我们构建优秀 iAd 所需的开发工具。这个开发者账户与在 App Store 中提供应用的开发者使用的账户相同。如果您有任何希望发布到 App Store 的应用，可以使用此账户提交。

注意

$99 的开发者费用仅有效期为一年，要继续使用 iAd Producer 和创建 iAd，您必须续订该程序的订阅。如有必要，苹果将通过电子邮件通知您续订说明。

摘要

在本章中我们学到了很多。现在您知道，iAd 是苹果 iOS 设备（iPhone、iPod touch 和 iPad）上的一项激动人心的营销机会。iAd 之所以突出，是因为它们提供了一种无与伦比的互动体验。每个 iAd 都是一个微型的互动网页，使用 HTML5、CSS3 和 JavaScript。iAd 有四个关键部分：

1. 横幅广告： 用户点击你的 iAd 的吸引人机会。

2. 过渡动画： 在横幅广告和启动页面之间的一种不会令人不适的动画。

3. 启动页面： 让用户等待变得有趣，并保持他们的注意力。

4. 核心广告单元： 构成给用户留下深刻印象的关键机会的导航和子页面。

iAd Producer 是我们将用来构建您的 iAd 的工具。我们可以在 iAd 模拟器和我们的设备上使用 iAd 测试应用程序来测试我们的 iAd。

在本章中，我们还有：

1. 获得了运行我们将要使用的工具所需的硬件。

2. 已注册开发者计划以获取构建和测试一些优秀 iAd 的工具！

现在您已经了解了 iAd 是什么，并且可以访问这些工具，我们可以继续到第二章，准备您的 iAd 内容，我们将探讨为 iAd 准备媒体和内容以及向移动设备传输媒体的限制。

注意

在我们开始构建它们之前，如果您想了解更多关于 iAd 的信息，请查看苹果的销售提案advertising.apple.com/和 iAd 文档developer.apple.com/library/iad/ [需要开发者登录]。

第二章：为移动设备准备您的内容

您需要优质的内容来制作出色的 iAd，并且这些内容需要以正确的格式呈现。

在本章中，我们将探讨以下主题：

• iAd 可以包含哪些媒体

• 应对移动限制

• 编辑和优化图像以用于您的 iAd

• 为您的 iAd 获取正确的音频格式

• 修改您的视频，使其能在 iOS 上运行

在 iAd 中包含媒体

iAds 可以包含图像、音频和视频。在它们可以包含在您的 iAd 中之前，每种都需要非常具体的格式并满足某些标准。

您将需要构建 iAd 的典型资产包括：

• 您的产品和/或公司标志

• 情感化的产品图像

• 引人入胜的音频片段

• 沉浸式视频

• 用于标记商店位置的地图针

• 背景和主题艺术作品

在设计和制作您的 iAd 资产时，重要的是要关注您的内容出现的上下文。

克服移动限制

与所有移动设备一样，iPhone 的较小屏幕和便携性意味着在物理尺寸、处理能力和连接性方面存在限制。这些限制不应被恐惧，相反，它们是完善您的信息并向未来的客户提供最相关体验的绝佳机会。

为小屏幕设计

较小的屏幕意味着您需要更好地利用您可用的有限屏幕空间；例如，可点击区域需要考虑用户手指的不一致性。我们需要确保所有可点击区域至少高 88px、宽 88px，并且每个可操作元素之间有足够的空间，以防止对用户体验有害的无意点击。

注意

在设计您的 iAd 横幅时，请记住横幅的右下角将被 iAd 标志遮挡，因此不要在那里放置任何重要信息。

重要的是要记住，您不应试图将整个产品线或公司理念都放入您的 iAd 中。吸引人的体验和直接与用户互动的独特机会应专注于少数几个关键产品或要点，鼓励他们采取行动并实现您的广告目标。

当在移动环境中处理广告时，用户通常处于一个充满干扰的环境中，因此创建清晰、响应式且对用户直观的屏幕是实现成功的 iAd 的关键。

在下载速度受限时提供内容

如果您希望您的 iAd 覆盖最广泛的受众，您需要假设大多数用户可能通过通常较慢的蜂窝网络连接。较慢的连接意味着用户在看到您令人惊叹的 iAd 之前需要等待更长的时间！因此，存在某些限制和建议。

遵守文件大小限制

苹果限制了 iAd 初始部分（横幅和启动屏幕）的文件大小，以确保它们快速加载并在关键的前 15 秒内吸引用户。

您的 HTML5 横幅大小可以达到以下范围：

• 在具有高分辨率显示的 iPhone/iPod touch 设备上为 60KB

• 在具有标准分辨率显示的 iPhone/iPod touch 设备上为 40KB

• 在 iPad 上为 65KB

• iPad 全屏 HTML5 横幅为 150KB

注意

横幅大小限制包括您横幅的纵向和横向版本，因此设计时确保许多相同的资源可以在两种方向上使用是很重要的。

您的启动屏幕大小可以达到以下范围：

• 在具有高分辨率显示的 iPhone/iPod touch 设备上为 256KB

• 在具有标准分辨率显示的 iPhone/iPod touch 设备上为 128KB

• 在 iPad 上为 300KB

注意您在高分辨率显示上获得的两倍存储空间；这是因为 Apple 的高分辨率显示（品牌为 Retina 显示）中水平像素和垂直像素的数量是两倍，因此图像的大小大约是两倍。

总是使用高分辨率显示尺寸，因为当您构建 iAd 时，iAd Producer 会自动调整资源大小。

小贴士

尽量保持您 iAd 中在任何时候加载的资源总数不超过 20 个。每次对文件的请求都包括一些额外的开销，这会减慢每次访问网络时的加载速度。

您的核心广告单元可以加载更大的资源，但保持这些资源小是一个好习惯。幸运的是，有很多方法可以优化您的资源以适应移动传输。

与图像一起工作

图像在您的 iAd 中用于背景、主题图形、您的标志、图片库和用户可配置的壁纸。它们可能是您 iAd 中最常见的媒体类型，并且以多种格式提供，这些格式可以被操作和编辑以增强广告的性能和体验。

理解不同的图像格式

在我们的 iAds 中，图像可以是JPEG或PNG，具体取决于它们包含的内容或将要用于什么目的。JPEG 通常文件大小更小，因为它们可以被广泛压缩。PNG 通常质量更好，更灵活，但这是以它们更大的文件大小为代价的。

当您能使用 JPEG 时，应该使用 JPEG。然而，当：

• 您的图像包含文本：当 JPEG 被压缩时，文本的清晰边缘可能会丢失。

• 您的图像包含锐利的边缘或形状：与文本一样，JPEG 压缩过程通常会模糊锐利的线条边缘。

• 您的图像包含大面积的纯色区域：JPEG 压缩可能会对大面积的颜色区域产生阻塞效果。

• 您的图像具有透明度：如果图像有透明部分，则图像后面的元素仍然部分可见。因此，您必须使用 PNG，因为 JPEG 不支持透明度。

调整图像大小

很可能您的许多资源都不是正确的大小或格式，可以直接用于您的 iAd。

我们可以使用预览，这是所有 Mac 内置的一个用于图像和文档操作的工具。尽管名为预览，但它的内置编辑功能相当广泛，为我们提供了免费、快速且专业的方式，将内容格式化为适合我们的 iAd。

使用预览裁剪图片的行动时间

让我们使用提供的样本文件之一，并使其准备好用于我们的 iAd。

1. 首先，我们需要这本书中包含的一个演示资产——如果你还没有下载完整的支持文件集合。双击文件iAd_Book_Resources.zip以提取内容。

   注意

   你可以通过访问www.packtpub.com/support并选择iAd Production Beginners Guide来下载资产。

2. 打开预览应用；你可以在 Mac 的应用程序文件夹中找到它。

3. 选择文件 | 打开。

4. 导航到book asset文件夹，该文件夹在第一步中已解压。找到dino stores项目文件夹，并选择banner-background.png。点击打开。你现在应该能看到我们将用于后续 iAd 的横幅图片：

   • 这是一个 iPhone 竖屏横幅，因此在高分辨率显示设备上需要是 640 x 100 像素，而在标准显示设备上则是其一半（即 320 x 50 像素）。让我们检查一下尺寸是否正确：

5. 要查看图片的大小，请转到预览菜单栏中的工具 | 显示检查器。这将显示关于我们图片的信息。查看图片大小值。在这里，我们可以看到图片的一般信息，包括其大小和类型：

   • 如你所见，这不是正确的尺寸；它的宽度是 1000 像素，高度是 156 像素。让我们将其调整到高分辨率横幅尺寸。

6. 由于 iAd Producer 会自动从高分辨率资产中生成低分辨率图片，所以我们只需要为高分辨率显示制作资产。

7. 目前 iPad 没有高分辨率显示，所以我们只需要为其制作一套资产。

   要调整你的图片大小，在预览菜单栏中，选择工具 | 调整大小。我们希望这张图片宽度为640像素，高度为100像素。在宽度框中输入 640。这将自动将高度更新为100，因为图片已经处于正确的宽高比。检查尺寸是否正确，然后按确定：

   

8. 你应该看到图片缩小到更小的尺寸。现在，我们需要保存它。在菜单栏中，选择文件 | 另存为。我们希望将图片从 PNG 转换为 JPEG，因为我们不需要 PNG 为这张图片带来的好处。将质量调整为大约三分之二。现在选择一个保存文件的位置；我们稍后会回来。

刚才发生了什么？

我们刚刚使用 预览 调整了第一张图像的大小。当你需要缩小图像时，请以此为例作为指南。

从图像裁剪部分

如果你只想从较大的图像中选择子部分，我们可以选择它并移除我们不需要的部分。这被称为 裁剪，我们可以在 预览 中完成它。

操作时间 — 裁剪选择

在我们的广告中稍后要使用的大图像中，让我们剪掉我们不想出现在我们的 iAd 中的部分：

1. 如果你还没有打开它，请从 应用程序 文件夹中打开 预览。

2. 从预览菜单栏中选择 文件 | 打开。在上一个练习中下载的 book assets 文件夹中，找到 Dino Stores 文件夹并打开 store-footprints.png。

3. 你应该看到三个恐龙足迹。我们将在我们的 iAd 商店查找器上稍后使用这些足迹；然而，我们不需要所有三个足迹，只需要红色那个。

   注意

   我们选择红色图像，因为用户将地图上的红色标记与目的地相关联。绿色标记表示起点，紫色表示用户选择的终点，蓝色信标表示用户的当前位置。

4. 在 选择 选项中，确保通过点击 选择 图标旁边的箭头并选择 矩形选择 来激活 矩形选择 工具。

5. 我们将选择围绕红色足迹的小区域，因此使用图像上方的 Zoom + 按钮放大足迹。你可能需要滚动以将正确的足迹显示在视图中。在这里，你可以看到工具栏上的选择工具和缩放按钮：

6. 现在，按住 Shift 键并拖动鼠标覆盖足迹，直到出现一个围绕它的方形框。在你拖动时，鼠标指针旁边会出现一个小的方框，显示你选择的大小；一旦达到 160x160，停止拖动。

   小贴士

   拖动时按住 Shift 键会强制出现方形选择而不是矩形选择。当你需要精确且等大的选择时使用此方法。

7. 你现在应该有一个围绕红色足迹的方形。如果它没有居中，你可以点击并拖动方形以在方形内居中足迹。你也可以使用箭头键来微调选择的位置。

8. 一旦你对方形的定位满意，从菜单栏中选择 工具 | 裁剪。其余的图像应该消失，只留下红色足迹。

现在我们可以保存图像；选择 另存为…，这样我们就不覆盖完整的图像，并确保以不同的名称保存，例如 map-pin.png。将其保存在安全的地方；我们稍后会将它放在我们的 iAd 地图上。

刚才发生了什么？

你现在知道如何使用 Mac 上的 预览 工具从图像中提取子部分。裁剪图像可以用来选择图像的有趣部分，或者改变它们的纵横比，例如使图像成为方形以更好地适应画廊。

移除实色背景

您通常会发现自己的图像有一个实色背景，但您想将它们叠加在一起。或者，您可能在 iAd 上有一个背景图像，您希望它始终可见，不被这种实色所遮挡。透明的分层图像可以为您的 iAd 内容增加深度，当与动画结合时，可以看起来非常令人印象深刻。

执行动作 — 移除实色

我们可以使用预览中的瞬时透明度工具来移除实色块。

注意

瞬时透明度工具可以用来从图像中移除实色块。它通过检测您选择的颜色的相似色调，并将这些像素替换为透明颜色来实现。

1. 如果您还没有打开，请打开预览。

2. 现在打开包含在您下载的演示资产Dino Store文件夹中的grass-blades.png文件。您应该看到一些绿色的草叶在奶油色的背景上。

3. 这个奶油色背景会干扰我们的 iAd 背景图像，所以我们将移除它。在我们继续之前，请确保视图菜单中的显示图像背景被勾选。这将允许我们看到图像的结束位置以及哪些部分是透明的。

4. 点击图像上方选择按钮右侧的小箭头，并选择瞬时透明度，如以下截图所示：

   注意

   如果您看不到选择选项，请尝试将预览窗口稍微放大一些，因为它如果太小就会被隐藏。

5. 瞬时透明度允许您拖动覆盖您想要移除的颜色区域。您拖动得越远，它选择的颜色范围就越广。将要选择的区域将以红色突出显示。将光标拖动到背景上，直到它变成红色。

6. 应该在草叶的外围有跳舞的线条；点击删除来移除这个区域。

7. 您现在应该看到草叶后面有一个棋盘式的效果。这是图像编辑软件用来显示图像透明区域的方法。

8. 现在，我们需要保存图像；在菜单栏中点击文件 | 另存为。选择保存图像的位置（我们稍后会用到它）。确保格式是 PNG，并且透明度复选框被勾选。

9. 点击保存。

刚才发生了什么？

我们现在已经移除了这张图像的背景颜色，所以稍后当我们把这张图像放在背景上时，只有图像的实色部分会覆盖它。以下截图显示了在添加透明度之前（左侧）和添加透明度之后（右侧）的外观：

如您所见，这可以让背景通过图像的透明部分可见。现在您已经知道如何操作您的图像，我们将探讨通过减小文件大小来优化图像以适应移动设备传输。

加快我们的图像下载速度

当图片创建时，它们包含可以删除、优化或压缩的额外信息。我们可以在将图片包含在我们的 iAd 之前处理它们，以保持在苹果的文件大小限制内并减少用户在参与我们的品牌之前等待的时间。

是时候行动起来——优化图片

有许多应用程序可用于优化图片；我们将使用 ImageOptim，因为它免费且开源。

注意

ImageOptim 分析每一张图片，并确定最有效的算法或最佳方式来压缩内容，然后删除任何不必要的注释或颜色配置文件。ImageOptim 是无损的，因此我们的图片不会丢失任何质量。

1. 从 imageoptim.pornel.net 下载 ImageOptim。

2. 双击下载的文件以提取它。将应用程序拖到应用程序文件夹中。

3. 打开 ImageOptim。

4. 将你的图片拖到应用中的表格上；它将自动优化并保存每一张。你可以一次拖动多张图片或整个文件夹，ImageOptim 将处理它们并显示保存情况。

   注意

   ImageOptim 可以优化 iAd 支持的所有文件格式，因此我们的 JPEG、PNG 和 GIF 都可以从复杂的文件大小减少中受益。

5. 你的图片现在已优化！你可以在图像文件名旁边看到你节省的金额。关闭应用，但请记住优化你将来要使用的任何图片。以下是在使用 ImageOptim 时可以预期的典型节省示例：

刚才发生了什么？

我们现在已经减小了图片的大小，这意味着它们将加载得更快，并有助于我们保持在 iAd 文件大小限制内。通常，你的图片大小将减少 15% 到 50%，而不会损失质量！

快速问答——理解图片

我们已经讨论了很多关于编辑图片及其不同格式的内容。尝试根据我们刚刚学到的知识回答以下问题：

1. 为什么我们要使用像 ImageOptim 这样的软件来优化我们的图片？

   • a. 因为它们看起来会更清晰和更清晰

   • b. 为了增加它们的文件大小和下载时间

   • c. 为了减少下载时间和保持在苹果的文件大小限制内

   • d. 优化后的图片可以有更多颜色，看起来更亮

2. 你应该在预览中使用哪个工具来移除实色块，以便使图像的一部分透明？

   • a. 快速选择器

   • b. Instant Alpha

   • c. Fast Grab

   • d. Mega Select

3. 何时你应该使用哪种图像格式？

   • a. JPEG

   • b. PNG

   • c. GIF

   • d. TIFF

4. 你何时需要使用 PNG 图片？

   • a. 为了减小文件大小

   • b. 要在图片中有一个透明区域

   • c. 要有动画内容

   • d. 当你的图片是黑白时

尝试一下英雄——编辑你自己的图片

为什么不使用你刚刚学到的方法来准备你自己的图片，比如你的公司标志，并为你自己的 iAd 准备好它？你可以：

• 仅裁剪你需要的内容

• 使任何实色背景透明

• 调整图片大小

• 根据哪个更适合，将其保存为 JPEG 或 PNG

• 使用 ImageOptim 优化并减小我们迄今为止一直在处理的资产文件的大小

包含音频

音频、音乐预览、角色口号或背景环境声音可以用来吸引用户参与您的 iAd 主题。

转换您的音频

就像图片一样，您的音频必须以苹果推荐的格式才能从您的 iAd 及其运行设备中获得最佳性能。

注意

苹果建议使用.m4a扩展名的 AAC 音频文件，比特率为 128 kbps。iOS 设备内部有专门的硬件芯片，可以轻松解码此格式，实现清晰、不间断的播放。

行动时间——将 mp3 转换为 iOS 上使用的格式

iTunes 包含一个强大的音频引擎，我们可以利用它将我们的音频转换为正确的格式。为此，请按照以下步骤操作：

1. 确保iTunes窗口已打开。您应该能在您的应用程序文件夹中找到它。

2. 在本章代码包提供的assets文件夹中，找到Dino Store资源文件夹，其中有一个音频文件roar-noise.mp3。将其拖到iTunes窗口中。

3. 我们现在需要设置 iTunes 以将音频转换为正确的格式。从菜单栏的iTunes部分，打开偏好设置。

4. 在常规选项卡上，点击底部的右边的导入设置。我们希望使用AAC 编码器导入，选择高质量设置，以便您的导入设置与以下截图匹配：

5. 点击确定并关闭偏好设置窗口。现在在您的库中找到roar-noise音频文件。右键点击它并选择创建 AAC 版本。完成后，您应该在库中看到该文件的两个副本。

6. 右键点击两个文件中的第二个，选择在 Finder 中显示。这将显示这两个文件，roar-noise.m4a和roar-noise.mp3。我们只对新的.m4a文件感兴趣，所以将其从文件夹移到您可以稍后轻松访问的地方。

7. 一旦您移动或创建了文件的副本，您可以从iTunes中删除它们，以防止库中充满不需要的音频。

刚才发生了什么？

我们刚刚将.mp3音频文件转换为支持的 iAds 格式的.m4a AAC 音频文件。

由于用户可以在他们的设备上调整或静音音量，确保任何对您的 iAd 体验至关重要的音频也带有视觉提示。如果您选择在您的 iAd 中自动播放任何音频，例如在背景中，您应该包括一种清晰的方式来暂停它。

音频在您的 iAd 中吸引用户效果很好，但为了更丰富的内容，我们可以在我们的 iAd 中嵌入视频。

集成视频

视频可以为您的 iAd 添加引人入胜的叙事和故事；您可以用它来制作电影预告片、产品演示或展示您最新的电视广告。优秀的视频可以将用户吸引到您的 iAd 体验中，并且如果做得正确，可以与您的 iAd 的其他部分完美融合，为您品牌创造无缝且难忘的曝光。

视频转换

Apple 设备内置了专门的硬件来流畅地播放您的视频，但为了实现这一点，它必须处于正确的格式。

行动时间——视频编码

使用随 Mac 一起提供的QuickTime，我们能在几分钟内创建兼容 iAd 的视频。

注意

QuickTime X（或 10）是当前版本的 QuickTime，由 Apple 随其 Mac 操作系统提供。QuickTime 提供音频和视频播放及流媒体，以及将视频转换为不同格式的简单界面。如果您能运行 iAd Producer，您将安装正确的 QuickTime 版本。

1. 打开 QuickTime；它应被称为QuickTime Player，您可以在应用程序文件夹中找到它。

2. 选择文件 | 打开文件。在提供的book assets文件夹中的Dino Store文件夹中打开dino-stores-intro.mp4文件。

3. 视频应在 QuickTime 窗口中加载。点击播放按钮，检查视频是否按预期播放并显示。

4. 一旦您观看了视频，请从菜单栏中选择文件 | 导出为 Web。

5. 选择文件名和保存位置。在导出版本为：下，确保iPhone和iPhone (Cellular)被选中，而计算机未被选中。您的导出设置应类似于以下截图：

6. 点击保存；这将现在处理您的视频。这可能需要几分钟，具体取决于视频的长度和您的 Mac 的速度。

刚才发生了什么？

QuickTime 刚刚创建了一些不同的文件，允许 iAd 显示您视频的两个不同版本。一个高分辨率的版本，当您的 iAd 通过 Wi-Fi 查看时使用，以及一个低分辨率的版本，当通过蜂窝网络流式传输时使用。

它通过创建所谓的参考电影来实现这一点，在这种情况下，文件dino-stores-intro.mov。iPhone 或 iPad 加载参考电影，然后决定是否想要高质量（较大的文件，在这种情况下dino-stores-intro - iPhone.m4v），还是低质量（较小的文件，dino-stores-intro - iPhone (Cellular).3gp）。这意味着无论您的 iAd 用户连接到什么网络，他们都可以以最小的缓冲观看您的视频。

QuickTime 还创建了一个海报文件，dino-stores-intro.jpg，它被用作我们视频的缩略图。

由于此方法旨在嵌入到网络上，它为我们创建了一个网页，dino-stores-intro.html；如果您想删除它，可以安全地删除，因为我们不会为我们的 iAd 使用它。

视频微调

对于高级用户，或者如果经验丰富的第三方正在创建你的视频资产，请考虑以下技术调整。如果你不理解这里发生的事情，请不要担心。我们刚刚转换的视频在我们的 iAds 中会运行得非常好。

视频内容

以 720p 或 1080p 的高清拍摄你的视频。与高质量视频一起工作对于让你的观众沉浸在 iAd 内容中至关重要。

限制使用缩放、快速摄像机移动和过渡效果。每当屏幕的大部分发生变化时，由于视频的创建方式，你的视频文件大小会增加。

你的视频音频

你可以通过降低音频质量来减小视频的大小。典型的音频质量为 CD 质量；然而，你可以将其质量减半，同时保持你 iAd 中的音频听起来很棒。

注意

如果你正在考虑使用大量音频和视频来增强你的 iAd，请查看苹果 iAd 资产指南中的视频交付设置，详情请见bit.ly/iAd-asset-guidelines。

如果你正在你的 iAd 中包含多个视频，请确保它们的音量相似，以避免给观众带来不适！

视频尺寸

你不需要在 iAd 中包含全分辨率视频来获得高质量的视频效果。iOS 设备拥有强大的渲染引擎，能够以非常高的质量显示全屏视频。

考虑以下最大尺寸以获得最佳视频：

• iPhone & iPod touch—480 x 320px（横屏）或 320 x 480px（竖屏）

• iPad—512 x 384px（横屏）或 384 x 512px（竖屏）

视频时长

当在你的 iAd 中包含视频时，苹果建议以下时长限制：

• 在你的主要广告单元之前播放的视频，例如在启动画面之后的预览广告，其时长应约为或低于 15 秒

• 你主广告单元中的任何视频都不应超过 60 秒

• 你应该将你 iAd 中的视频总时长控制在 2 分钟以内

• 不仅苹果的推荐可以减少你 iAd 中的加载时间，短视频通常能更好地保持用户的参与度。较长的视频可能会让用户关闭 iAd 并离开你的体验。视频应该用来激发用户；然而，为了确保他们在整个广告中保持参与，你应该专注于让他们与广告内容互动。

尝试英雄式操作 — 遵守指南

苹果会根据反馈或当新技术和最佳实践可用时偶尔更新其推荐和指南。通过探索苹果文档来保持最新状态是很重要的。

确保你遵循正确的最新资产指南，详情请见developer.apple.com/library/iad/documentation/UserExperience/Conceptual/iAd_Design_Guide/AssetGuidelines/AssetGuidelines.html。

阅读设计指南概述，了解 iAd 体验和工作流程，developer.apple.com/library/iad/documentation/UserExperience/Conceptual/iAd_Design_Guide。

备注

要访问这些文档，您需要使用我们在第一章开始使用 iAd时创建/使用的 Apple ID 登录，第一章*

快速问答 — 音频和视频

1. 应该将您的声音文件转换为哪种音频格式？

   • a. mp3

   • b. m4a/AAC

   • c. wma

   • d. jpg

2. QuickTime 创建的参考电影有什么作用？

   • a. 展示谁制作了视频

   • b. 允许您远程编辑视频

   • c. 自动选择高质量或低质量流

   • d. 包含您下一个秘密产品的片段

摘要

您现在可以操作、优化并将您的媒体转换为最适合您的 iAd 的最佳格式。在本章中，我们学习了以下内容：

• 移动设备的限制，如屏幕大小和下载速度

• 编辑和调整图像以用于我们的 iAd

• 将音频文件转换为在 iOS 设备上播放的格式

• 对我们的广告进行视频编码和微调

请记住，尽管您可以在 iAd 中包含音频、视频和图像，但这并不意味着您必须找到一种方法将它们全部放进去。在下一章中，事情将变得非常激动人心，我们将探讨安装 iAd Producer 以及如何使用我们刚刚创建的资产来制作我们的第一个 iAd。

第三章。制作您的 iAd

我们现在可以使用我们优化以与 iAd 一起工作的内容来构建我们的第一个广告。

在本章中，我们将涵盖以下主题：

• 在您的 Mac 上安装 iAd Producer

• 熟悉 iAd Producer 界面

• 设置空白 iAd 以便使用

• 使用模板构建您 iAd 的每个部分

• 调整模板以使您的广告更加出色

• 使用 Safari 预览 iAd 中的动画

获取 iAd Producer

iAd Producer 是一个工具，它允许我们通过简单的拖放可视化界面组装出优秀的交互式广告。在您的 Mac 上下载并安装 iAd Producer，以便您开始创建广告。

行动时间 — 安装 iAd Producer

要安装 iAd Producer，请按照以下步骤操作：

1. 要下载和使用 iAd Producer，您需要成为 iOS 开发者计划的付费成员。在 第一章 中，开始使用 iAd，我们注册了开发者计划，因此您在继续之前需要那些登录详情。

2. 前往 developer.apple.com/devcenter/ios/ 并点击 登录 按钮。

3. 输入您的 Apple ID 和密码，然后点击 登录。

   登录后，找到页面底部的 下载 部分。点击 iAd Producer 开始下载。您可以看到下载在这里被高亮显示：

   

   注意

   如果您在 下载 中看不到 iAd Producer，请确保您已登录并且您的开发者账户已被激活。

4. 下载完成后，打开文件并运行 iAd Producer.mpkg 以启动安装向导。按照安装步骤操作，并在需要时输入您的 Mac 密码。

   注意

   在安装某些软件时，您需要输入您的 Mac 密码以允许它获得对系统的特权访问。不要将此与为 iOS 开发者计划设置的 Apple ID 混淆。如果您在 Mac 上没有密码，只需将密码区域留空并点击 确定。

5. 完成安装步骤后，安装将需要几分钟。在您收到 安装成功 消息后，您可以关闭安装程序。

刚才发生了什么？

我们现在已安装了 iAd Producer；每次需要打开它时，您都可以在 Mac 的 应用程序 文件夹中找到它。

使用 iAd Producer 进行工作

让我们看看您将经常使用的 iAd Producer 的主要部分，以便熟悉界面。

启动屏幕

当您第一次打开 iAd Producer 时，您可以从项目选择器开始一个新的 iPhone 或 iPad 项目，如下面的截图所示。由于两个设备之间的屏幕尺寸和体验差异很大，我们必须为每个设备专门设计和构建广告：

从启动屏幕，您也可以打开您正在工作的现有项目。

默认广告

一旦您选择创建 iPad 或 iPhone iAd，系统会为您创建一个占位符广告，显示视觉流程。这是您广告的概览，您将使用它来组合广告的各个部分。以下截图显示了默认概览：

双击广告流程中的任何屏幕都会要求您为该页面选择一个模板；一旦分配，您就可以使用画布编辑器来设计 iAd。

模板选择器

在我们编辑广告的任何页面之前，我们必须将其应用到一个模板上，即使它只是一个用于构建的空白画布。iAd Producer 会自动显示与当前编辑页面相关的模板。这意味着您的广告遵循用户期望的结构。模板为您的 iAd 提供了一些很好的起点，无论是简单的带有图像和文本的横幅，还是用户可以翻动和操作的三维图像轮播，所有这些都可以通过简单的点击完成。以下是一个模板选择器示例的截图：

资产库

资产库包含您 iAd 的所有媒体和内容，例如图像、视频和音频。当您向资产库添加媒体时，请确保您使用的是高分辨率图像，以便在高清 Retina 显示屏上显示。iAd Producer 会在您导入资源时自动生成广告的较低分辨率的图像。

注意

如果您想要一个图像宽度为 200 像素，高度为 300 像素，您应该将水平和垂直像素加倍到 400 像素宽和 600 像素高。这意味着您的图形在高分辨率屏幕上看起来清晰且令人印象深刻。

以下截图显示了资产库中的媒体示例：

广告画布

一旦您选择了模板，您可以在概览中双击项目以打开该页面的画布。广告画布是您使用强大的视觉编辑器来定制广告每一页的地方。以下是一个添加了视频轮播的广告画布示例：

设置您的广告

让我们创建并保存一个空项目，以便我们在创建 iAd 时使用；您只需为每个广告做一次。

注意

无论您在处理什么数字内容，在您对 iAd 进行重大更改时保存您的 iAd 都很重要，以防 iAd Producer 意外关闭。尽量养成定期保存的习惯，以避免丢失您的广告。

行动时间——创建新项目

为了创建一个新项目，请按照以下步骤操作：

1. 如果您还没有创建一个新的项目，请从您的应用程序文件夹中打开iAd Producer。

2. 从启动屏幕中选择 iPhone 并选择选择。您现在将看到默认的广告概览。iAd Producer 已经自动为我们创建了一个名为Untitled的项目，并填充了默认的页面集。

3. 从文件菜单中选择保存以保存空的 iAd，准备稍后添加组件。将项目命名为类似Dino Stores的东西，因为这是我们将会工作的广告。

4. 您现在可以通过选择菜单栏上的文件然后保存或按键盘上的Command + S在任何时候保存项目的进度。

刚才发生了什么？

您现在已经看到了项目选择器和启动屏幕的实际操作，并且已经拥有了我们将在此基础上构建的第一个 iAd 的基础项目。如果您退出此项目，您现在可以从 iAd Producer 内部打开项目，方法是点击菜单栏上的文件 | 打开；或者，在 Finder 中简单地双击project文件以自动打开它。

获取资源

在本章中，我们将使用与本书一起可下载的Dino Stores示例资源。如果您想使用自己的资产，您需要以下媒体：

• 用于横幅的图片，大约 120px 宽和 100px 高

• 您公司的标志或名称的图片，大约 420px 宽和 45px 高

• 一个 80px 的方形图片，带有透明度，用作地图针

• 一个大约 600px 宽和 400px 高的加载图片

• 用于画廊的六到十张图片，每张大约 304px 宽和 440px 高

• 当 iPhone 摇晃时将改变的二或更多图片，每张大约 600px 宽和 800px 高

• 与您的产品或服务相关的图片，至少 300px 宽，用于主菜单页面

注意

这些像素大小是双倍大小，以考虑到 iPhone 4 及以后设备上发现的超高分辨率 Retina 显示屏。iAd Producer 将自动为旧设备创建低分辨率版本。

构建您的横幅

横幅是吸引观众点击并探索您的 iAd 的钩子。我们将使用一张图片和一个广告标语来创建一个简单但有效的横幅。

行动时间——制作横幅

为了制作横幅，请按照以下步骤操作：

1. 打开Dino Stores项目，并在广告概览中双击横幅。它应该是屏幕上的第一个项目。

2. 在您能够编辑广告的任何页面之前，您需要为它分配一个模板。从模板选择器中，您应该可以看到横幅的可用的模板。在这个横幅中，我们将使用图片和文本；选择此模板并点击选择。

3. 在选择横幅类型后，再次从 iAd 概览中选择横幅。现在您应该打开了横幅画布，准备自定义横幅，如以下截图所示：

4. 我们将更改的第一个项目是横幅消息。双击文本将将其更改为编辑模式。现在，输入您自己的文本，例如Rawr-some Pets。在标签外单击以退出编辑模式。

   小贴士

   在 iAd Producer 中，每个文本区域都被称为标签。它们之所以被称为标签，是因为 iAd 的用户无法编辑它们。对于可编辑的文本区域，我们可以使用文本框。

5. 现在让我们将文本稍微放大并居中，使其正确地位于横幅中。再次单击文本，以便在它周围出现选择框，然后在 iAd Producer 的右下角单击检查器选项。这会打开检查器面板，用于调整您 iAd 中元素的外观和样式。

   注意

   通过再次单击图标可以切换检查器面板的打开和关闭。您可以使用此功能放大画布的最大可用区域，以便可以更精确地编辑您的广告。

6. 在检查器面板中，单击文本部分以展开文本格式化选项。我们可以使用对齐设置中的中间按钮将文本居中，然后增加字体大小到大约25。您可以在以下屏幕截图中看到字体大小和对齐方式被突出显示：

刚才发生了什么？

我们选择了图片和文本模板来创建横幅的基本布局。然后，我们第一次使用广告画布来编辑默认设置。现在您知道如何选择模板，然后编辑和调整其文本和外观。

尝试英雄——编写好的横幅文本

在编写横幅文本时，您可以使用某些语言和词汇来吸引并抓住用户的注意力，使他们点击您的横幅。考虑更新您的横幅，使用行动号召，其中结合以下内容：

• 一个用于鼓励用户点击横幅的动作动词，例如“尝试”、“加入”、“获取”、“探索”、“创建”或“玩耍”

• 一个用于增加价值或重要性的词，以激发点击动作，例如免费、现在或快速

• 将内容保持在最少，以免阻止用户阅读

以下屏幕截图显示了一个完整的行动号召示例：

行动时间——更改背景

我们已经编辑了横幅上的文本；现在让我们更改背景，使其在它将出现的应用中更加突出。我们将使用渐变来填充背景，在两种颜色之间渐变。

1. 在灰色背景上的标签外单击，以在检查器面板中选择背景属性。现在单击背景，以打开背景属性部分。

2. 当我们选择横幅模板时，已经为我们选择了径向渐变，所以我们只需要更改两种背景颜色。

   注意

   径向渐变是两种颜色之间的平滑过渡；想象一下，将两个彩色圆圈融合成一个，从它们填充区域的中心开始。

3. 你应该看到一个带有小箭头和盒子的白色到灰色渐变条；点击左边的盒子以打开颜色选择器。颜色选择器有多种选择颜色的方式。我们将使用最简单的方式——蜡笔选择器。通过点击颜色选择器上的蜡笔盒子来选择它。在下面的屏幕截图中，我们可以看到背景部分以及蜡笔颜色选择器：

4. 我们现在有一系列蜡笔可供选择颜色。我们首先选择的是径向渐变的内部颜色；从颜色底部左边的自然史前橙色（命名为 Cantaloupe）中选择。你应该看到横幅的内部变成了那种颜色。如果没有，请确保已经选择了渐变条上的第一个框，然后再次尝试。

5. 接下来，选择渐变条右侧的小灰色框来更改径向渐变的外部颜色。我们将外部颜色更改为白色（命名为 Snow），底部最右边的蜡笔。一旦两种颜色都选好了，你就可以关闭颜色选择器。

6. 我们现在可以通过将左边的橙色框拖动到大约四分之一的位置向右来微调渐变。这改变了渐变淡入的起点，因此在中心可以看到更多的橙色。

刚才发生了什么？

我们刚刚在 iAd Producer 中使用了内置的渐变来创建一个用代码而不是图片的渐变，这意味着它们可以无损失地缩放到高分辨率或低分辨率屏幕，同时文件大小显著减小。iAd Producer 自动生成 CSS。

英雄尝试——学习 CSS3 渐变

CSS3 是一个正在开发中的规范，目前正受到最新一代浏览器支持。如果你对 CSS3 渐变及其如何应用于网站感兴趣，请查看以下资源：

• CSS3 渐变生成器是一个可视化的网络工具，它允许你生成和查看复杂渐变的 CSS 代码；请访问gradients.glrzad.com/。

• CSS Tricks 在css-tricks.com/5700-css3-gradients提供了一个全面且易于理解的浏览器支持和小怪癖概述。

• W3 编写并维护了 CSS3 渐变的深入规范；可在dev.w3.org/csswg/css3-images/#gradients找到。

行动时间——添加图片

在背景渐变设置好之后，我们现在需要添加横幅的最后一个组件，一个小图形来补充文本：

1. 要将图片添加到我们的 iAd 中，我们需要将我们的媒体添加到 iAd Producer 的资产库中。我们可以一次添加多个资产，所以我们将导入整个Dino Stores项目文件。在 iAd Producer 中，从远底右边的菜单中选择资产以打开资产库。你现在应该能在 iAd Producer 的右侧看到资产库，如下面的截图所示：

2. 选择文件 | 导入资产，然后找到本书资产提供的Dino Stores文件夹。在这个文件夹中，有一个final文件夹，其中包含为这个 iAd 准备的所有资产；选择final然后点击选择。你也可以直接从 Finder 将媒体拖到你的资产库中。

   注意事项

   Dino Stores示例的final文件夹中的资产已经调整大小并优化，以用于本项目。如果你想在第二章“准备你的 iAd 内容”中使用的资产，或者如果你选择制作自己的资源，请现在导入它们。

3. 请等待 iAd Producer 导入你的媒体和资产。导入完成后，它应该会显示一个列表，列出所有可用于你的 iAd 的资产。将banner-icon-rex.png拖放到横幅画布左边的占位符图片（一个带有月亮的风景剪影）上。它应该更新为我们的新图片。

4. 注意这是一个 PNG 图像；我们选择 PNG 是因为我们希望透明的区域显示背景渐变，这是我们不能用 JPG 做到的。现在新图片已经在我们的 iAd 中，而且文本似乎太靠右了，所以点击文本标签并将其稍微向左拖动。

刚才发生了什么？

我们已经将用于我们的 iAd 的资源集导入到资产库中，并更新了模板以包含我们自己的图片。

操作时间 — 支持所有方向

苹果建议我们的横幅应该同时在纵向和横向工作，这样做可以确保你的 iAd 看起来很棒，并且可以出现在支持 iAd 的任何应用程序中。我们现在将查看如何修改横幅以支持两种方向：

1. 要查看当前横幅在横向时的外观，请从菜单栏中选择视图然后选择横向。你会看到 iAd 会调整大小以匹配新尺寸；我们现在有一个更薄更长的画布来定制我们的广告。

2. 如你所见，我们的文本现在太大，图片已被裁剪。选择文本并将其更改为更合适的大小，例如22。你可能需要将文本移动到新视图的中心。

3. 我们现在将修复图片；点击以选择图片。如果检查器面板不可见，请从 iAd Producer 的右下角菜单中打开它。

4. 在检查器面板中的图片属性部分，将实际大小更改为拉伸以适应。这允许我们将图片缩小以适应横幅。

   注意事项

   通过缩放我们在纵向中使用的相同图像，我们保持横幅的总大小不变，因为我们不需要为横幅的横向版本加载任何额外的资源。

5. 仍然在检查器面板中，展开布局部分并检查约束比例选项。约束比例意味着当我们调整图像大小时，图像将始终保持正确的比例。在这里，我们可以看到为横幅上的图像选中的布局部分和约束比例选项：

6. 现在，将图像从边缘的小框中拖动，称为拖动句柄，以调整大小以正确地适应较窄的横向横幅。如果需要重新定位图像，将其拖动到看起来好的位置。

   注意

   当在广告画布上拖动或移动元素时，iAd Producer 将建议你可以使用的一些点；这些点由黄色线条指示，并且元素会吸附到它们上。

7. 不幸的是，我们的一些更改也影响了纵向视图，因为它们共享相同的资产和一些设置。从菜单栏中选择视图然后纵向，以返回到纵向视图。

8. 你可能已经注意到，图像现在缩小了，并且没有正确地适应横幅。这是因为我们选择的拉伸以适应设置与此视图冲突。我们可以通过从拖动句柄拖动图像来调整大小，使其适应应有的样子。

9. 重新定位图像，使其回到正确的位置。

   注意

   在视图下拉菜单旁边的画布上方的箭头图标可以用来快速在横幅的横向和纵向版本之间跳转。

10. 再次检查横幅，在每个方向上。现在一切看起来都应该很棒；如果不是，修复问题，直到你对横幅满意为止。

11. 使用菜单栏中的文件部分中的保存选项保存您的 iAd 项目。

刚才发生了什么？

我们通过支持横向和纵向方向完成了横幅，以确保我们的广告兼容，因此可以在尽可能多的应用程序中显示。

如果你使用了提供的资产，你的横幅应该看起来像以下截图：

突击测验——制作横幅

1. 为什么我们应该调整我们的 iAd 横幅，使其在纵向和横向模式下都看起来很好？

   • a. 因此我们的横幅可以倒置

   • b. 使我们的 iAd 在任何方向上都看起来很棒

   • c. 如果用户在火车上看到我们的横幅

   • d. 苹果要求我们支持两种方向

2. 径向渐变是什么？

   • a. 带有颜色的圆圈

   • b. 两种搭配得好的颜色

   • c. 两个颜色渐变的圆圈

   • d. 带有图像的按钮

现在我们已经完成了横幅，让我们看看如何通过一个闪屏页，平滑地将用户过渡到我们的核心广告单元。

制造轰动

启动画面是你在用户等待你的核心广告单元加载时保持用户兴趣的机会。

执行时间 — 制作启动画面

让我们制作一个展示弹跳图像和三个消息交替淡入淡出的启动画面：

1. 如果你正在继续上一个练习，请点击 iAd Producer 左上角的 概览 返回按钮。如果你还没有，那么打开 iAd Producer 并选择 打开项目；找到我们之前一直在使用的 Dino Stores 项目。

2. 你现在应该能看到你的 iAd 概览以及各个组件之间的流程。双击 启动画面 页面以打开模板选择器。对于这个启动画面，我们将使用 弹跳标志 模板。再次双击页面以在画布上打开它。

3. 从底部栏右侧的 资产 选项打开 资产库 面板。这应该会显示我们之前导入的所有资产。将 Pterodactyl.png 拖动到启动画面画布上的大图像占位符框中。

4. 你可能已经注意到我们的翼龙翅膀和头部被切掉了。我们可以通过使用拖动手柄调整图像框的大小来修复这个问题。一旦你将图像框的大小调整为显示整个图像，确保通过拖动整个图像使其居中，这样画布中间就会出现一条黄色线，图像会自动吸附到它上。这是 iAd Producer 建议的理想位置。下面的屏幕截图是 iAd Producer 中黄色线建议定位的示例：

5. 我们已经将图像添加到我们的启动画面中；现在，我们将自定义文本。弹跳标志 模板包含一个 Multi-Label 对象，类似于标准标签，但它允许我们在不同的消息之间切换，并带有过渡效果。

6. 双击 多标签；目前，它应该显示为 加载消息 1。这会打开多标签编辑器，并在我们编辑时淡出画布的其余部分。

7. 再次点击文本以突出显示它，并用你自己的消息替换它，比如 已经过去了 1.8 亿年。

8. 要将消息移动到下一个单元格，即多标签的子标签，点击 1 of 3 cells 右侧的向下箭头。在下面的屏幕截图中，这个单元格导航箭头被突出显示：

9. 现在，输入第二个单元格的文本，比如 但最终..。转到第三个单元格并添加最终消息，例如，他们来了。

10. iAd Producer 现在将自动在这些单元格之间切换，同时我们的广告正在加载。为了确保我们的消息有机会完成一个完整的循环，我们需要调整多标签的计时。我们将改变每个单元格可见的时间和过渡的长度，并确保启动画面在一段时间内可见。

11. 要更改多标签的持续时间，点击单元格外的任何位置以退出编辑模式。现在单击多标签以选择它，但不要重新进入编辑模式。如果检查器面板不可见，请打开它并找到效果部分。我们将想要将按字母更改为按行。这意味着效果是逐行应用的，而不是逐个字母。检查显示时间为2 秒和隐藏时间为0.5 秒；如果它们不是这些值，请更改它们。您最终的效果应该看起来像以下截图：

12. 现在让我们将启动画面的最小持续时间更改为7.5 秒。点击 iAd 的背景以修改主要启动画面的属性。在检查器面板中，将至少显示页面的值更改为7.5 秒，通过将滑块向右拖动。

    注意

    我们选择了7.5 秒的最小持续时间，因为这允许多标签单元格上的整个效果动画完成。每个单元格可见 2 秒，隐藏 0.5 秒，总共 2.5 秒。然后我们有三个单元格，总持续时间为 3 x 2.5 秒，即 7.5 秒。保持启动画面尽可能短的时间很重要，以防止用户在你甚至到达内容之前就关闭你的广告！

13. 最后，我们将在启动画面中添加背景渐变。在至少显示页面下，找到背景部分。就像我们处理横幅的背景一样，我们将使用径向渐变。我们将点击渐变条上的第一个颜色并选择右下角的白色蜡笔Snow。现在点击渐变条上的第二个颜色框并从左下角选择Cantaloupe。

14. 从文件菜单保存你的项目。这是我们的最终启动画面，其外观将与以下截图类似：

刚才发生了什么？

我们现在已经制作了第一个启动画面，将用户过渡到核心广告单元。您修改了动画效果的时间，以确保用户能够看到完整的启动动画。

由于我们的启动页面包含在 iAd Producer 中无法预览的动画，让我们快速看看如何使用 Safari 来模拟它们。

预览广告

虽然 iAd Producer 给出了关于你的 iAd 位置、样式和流程的很好概述，但它不会显示动画或让我们与我们的广告互动。幸运的是，由于每个 iAd 都是使用最新的网络技术构建的，我们可以使用 Safari，这是你的 Mac 上的内置网络浏览器。Safari 使用与 iPhone 相同的引擎来显示网页，所以表示应该是准确的；然而，请记住，你的 Mac 比你的 iPhone 快得多，所以在该设备上的性能可能会更差。

行动时间 — 测试你的 iAd

让我们暂时放下我们的 iAd 构建，检查一下我们迄今为止创建的Dino Stores广告，以确保模板和标签提供的动画正在工作：

1. 如果它还没有打开，请打开我们一直在工作的Dino Stores项目，并在画布编辑器中打开横幅。您可能需要返回概览来找到横幅。

2. 从菜单栏，选择导出然后在 Safari 中预览。这将打开 Safari，其中包含您的横幅。您应该看到文本从右侧滑入，图像淡入。如果在大横幅区域之外的可视框架中看到文本进入之前，请不要担心。

   注意

   您可能已经注意到，在 Safari 的预览中缺少 iAd 标志和框架，这是 iOS 设备上的 iAd 系统添加的，并且在 Safari 中不可用。

3. 让我们通过刷新页面再次查看动画。从 Safari 的菜单栏中选择查看然后重新加载页面。如果您在 iAd Producer 中对 iAd 进行了更改，重新加载页面不会显示更新的 iAd，因此您必须返回 iAd Producer 并再次选择在 Safari 中预览以更新它。

4. 如果横幅让您满意，请在 iAd Producer 中打开启动页面，并从菜单栏选择导出然后在 Safari 中预览。

注意

无论何时您在包含动画或效果的 iAd 上工作，您都可以随时预览 iAd，以查看使用此技术时的外观。

刚才发生了什么？

您刚刚预览了您的广告在 Safari 中运行的样子——就像之前的截图一样。在下一章中，我们将探讨设备测试，能够触摸我们的广告并沉浸其中，这使得我们更容易感受到我们的 iAd 体验将是什么样的。

现在我们已经看到了我们的横幅和启动页面将是什么样子，让我们继续构建广告的其余部分。

添加菜单

菜单是我们核心广告单元的根视图，并用于在 iAd 的子视图之间进行主要导航。广告的流程通常意味着用户会从菜单进入一个页面，然后返回菜单并进入另一个页面。

行动时间——制作菜单

让我们为我们的 iAd 制作一个菜单，以便访问广告中的三个页面——图片画廊、可摇动的图片视图和商店搜索器。要制作菜单，请按照以下步骤进行：

1. 如果您还没有这样做，请打开 iAd Producer 和我们一起工作的Dino Stores项目。从概览屏幕，双击应用中的菜单页面。然后，转到打开模板选择器。

2. 对于这个菜单，我们将使用隐藏-显示模板，它为我们提供了一个在更改页面时滑到下面的菜单，并且当用户想要返回主菜单时可以滑回。选择此模板并点击选择。双击广告流程中的隐藏-显示菜单以打开菜单画布。

3. 双击菜单区域以打开其编辑模式。然后，双击页面 1以更改文本。我们广告的第一页将是图片库，所以输入一些文本，比如查看我们的宠物。对下一个两个项目，可摇晃的图像视图和商店查找器重复此操作。你可以使用所有形状和大小和找到我们！来表示这些项目。有了新的文本，你选择的菜单将类似于以下截图：

4. 菜单的默认样式并不非常吸引人，所以让我们重新设计它。通过点击广告的背景退出菜单的编辑模式，然后再次单击菜单以选择它。然而，不要进入编辑模式。展开检查器面板的背景部分以显示渐变条，然后单击第一个颜色框以打开颜色选择器。

5. 这次，我们不会使用蜡笔来选择颜色，因为它们提供的选项非常有限。在颜色选择器中，点击充满彩虹的圆圈以打开颜色轮。颜色轮给我们一个带有颜色光谱的大圆圈，允许选择我们想要的任何颜色。以下截图显示了颜色轮选择器的每个部分的作用：

6. 对于我们的第一种颜色，通过在颜色轮上点击你想要的颜色来选择一个浅橙色。预览区域和 iAd 画布应该更新以显示你的选择。你可以在颜色轮上点击并拖动以实时更新你选择的颜色。

7. 一旦你找到了喜欢的颜色，通过在 iAd Producer 的渐变条上单击第二个颜色框来选择第二种颜色，在颜色选择器中打开该颜色。这次选择一个更深、更暗的橙色，以补充第一种颜色。你可以使用亮度滑块在浅色和深色颜色之间切换，以进行选择。

8. 现在我们已经为菜单选择了颜色，让我们确保它是一个线性渐变。线性渐变有一个起始颜色和一个结束颜色，从第一种颜色渐变到第二种颜色。在检查器面板的背景部分，检查渐变条下的类型是否为线性而不是径向。

   注意

   当为可触摸项创建线性渐变时，你应该保持顶部颜色比底部颜色更浅，以创造深度错觉。从浅到深的渐变会产生一种推出去的效果，这会给按钮带来一种真实、可触摸的感觉。如果你需要交换颜色，背景部分有一个带有两个箭头的按钮。点击该按钮将反转渐变的方向。

9. 我们已经为菜单的内部应用了样式；现在让我们更改边框。在背景部分下，你应该看到一个边框部分；如果它没有展开，点击它以显示边框设置。点击颜色框以打开颜色选择器。将默认的白色更改为另一种颜色，例如深棕色。我们可以将边框宽度增加到3px以使其更加明显。如果你想，可以将半径更改为20px，以增加菜单的圆角。边框样式可以从实线更改为点划线或虚线；然而，如果你尝试更改它，你会很快看到这些不适合我们正在制作的菜单。

   注意

   如果你制作了一个想要保存以便以后方便访问的自定义颜色，你可以将预览区域中的大色块拖到颜色选择器底部的空白框条上。当你想在广告中多次使用相同的自定义颜色并保持它们一致时，这很有用。

10. 你可能已经注意到顶部的主菜单标签没有任何样式应用，所以让我们将其改为与菜单的其他部分相匹配。双击菜单的主区域，然后单击菜单的顶部部分，那里写着菜单。选择菜单标签可能相当困难，所以如果你需要尝试几次才能选择它，请不要担心。

11. 首先，让我们将菜单标签的背景颜色与边框匹配，使其看起来像一个完整的单元。在检查器面板中，找到背景部分，将其更改为实色填充，并复制我们用于边框的相同红色。

    注意

    iAd Producer 不幸地隐藏了我们正在编辑的画布区域，背后是一个深灰色蒙版，所以你可能需要偶尔取消选择菜单标签，以查看你所做的更改。

12. 菜单标签的较暗背景意味着文本不再可读，所以让我们更改文本颜色。从检查器面板中，找到文本部分，并在需要时将其展开。单击灰色色块并将其更改为白色。在这里，我们可以看到调整颜色的菜单标签的选择：

13. 再次单击主广告画布以查看菜单的外观，并编辑你认为需要调整的任何部分，菜单就完成了！

14. 我们已经添加了菜单，现在让我们更改页面的背景。单击广告画布上的背景，并在检查器面板中打开背景部分。

15. 我们希望背景与启动屏幕相匹配，以便于过渡到我们的核心广告单元。如果你使用了启动屏幕的建议颜色，你将需要将调色板中的蜡笔部分的第一种颜色更改为白色（Snow），并将第二种颜色更改为橙色（Cantaloupe）。默认模板应该已经应用了径向渐变。检查是否已经应用，并在需要时进行更改。

    注意

    如果你正在使用 iAd Producer 2.0 或更高版本（2011 年第四季度发布），那么你可以从广告概览的检查器面板设置共享背景项目属性。这将导致所有未来的页面背景共享相同的默认值。

16. 这很简单；让我们给我们的广告菜单添加几张图片。通过点击 iAd Producer 窗口右下角的资产库图标来打开资产库。将t-rex.png图片从资产库拖动到画布上的占位符图片区域。将图片重新定位到画布的右侧，使其略微重叠屏幕边缘。

17. 现在将dino-stores-title.png图片拖动到画布上，并重新定位，使其位于恐龙旁边。你可能想要将标志图片放置在恐龙的牙齿之间，如下面的截图所示：

    注意

    当将图片拖动到画布上时，如果你将其放在现有图片的上方，现有图片将被替换。如果你想有重叠的图片，你需要将新图片拖动到画布上没有图片的位置，然后重新定位它。

18. 让我们给dino-stores-title.png图片添加一个反射效果。在画布上选择Dino Stores图片，然后点击检查器面板。找到反射部分并展开，如果需要的话。勾选复选框以启用反射。现在，我们可以调整反射设置以改善其外观。将偏移设置为0px意味着反射将从图片的末端开始，这通常是一个好主意。我们将保持大小为100%，但你也可以使用它来裁剪反射，如果你不希望整个图片在下面镜像的话。强度是反射的透明度；尝试一个大约15%的值以获得微妙而时尚的反射，类似于以下截图：

19. 如果你还没有这样做，请确保保存你的 iAd。

刚才发生了什么？

恭喜你，你刚刚为 iAd 制作了第一个菜单页面。拥有一个出色的菜单页面对于鼓励用户深入探索你的 iAd 并了解更多关于你引人入胜的信息至关重要。

尝试英雄菜单页面

为什么不尝试为菜单页面选择一个不同的模板，并像我们刚才对Hide-Reveal模板所做的那样进行设计？你可以做以下操作：

• 通过在画布编辑视图中打开页面并按下 iAd Producer 底部栏左侧的模板按钮来更改页面的模板

• 尝试将模板从Hide-Reveal模板更改为Buttons模板

• 重新设计模板以匹配广告

注意

警告——更改模板会重置整个页面，因此你将不得不重新设计所有组件并重新添加你的自定义图片。

构建核心广告页面

我们已经构建了导航来在页面之间切换，现在是为它们添加一些精彩内容的时候了！我们将添加一个3D 交互式图片库——一个当它被摇晃时会在图片之间切换的页面，以及一个使用内置 GPS 来定位用户最近的商店或分店的商店查找器。

插入图片库

让我们从图片库开始吧；我们将使用一个用户可以前后翻动的 3D 旋转木马来浏览图片。

行动时间——制作图片库

为了制作图片库，按照以下步骤进行：

1. 我们将把图片库添加到我们现有的Dino Stores项目中。如果你还没有做，请打开我们在 iAd Producer 中一直在工作的Dino Stores项目。

2. 双击页面 1以打开模板选择器。选择图片旋转木马模板并按选择。现在，再次双击页面以进入画布。

3. 我们现在在页面的画布上，准备编辑我们的图片库。要向图片库添加图片，你必须一次性将它们拖放到画布上的图片库对象上。

4. 让我们选择我们想要添加的项目组。从底部栏打开资产库，找到标记为gallery-image-1.jpg, gallery-image-2.jpg等图片的组。单击第一张图片，gallery-image-1.jpg；它应该被高亮显示。现在按住键盘上的Shift键，单击最后一张图片，gallery-image-6.jpg。这将选择两个选择之间的所有图片。用选定的图片组，将它们拖放到画布上的图片库对象上。

   注意

   注意我们在图片库中使用 JPG 图片。我们的图片没有透明区域，因此我们可以使用 JPG 并从较小的文件大小中受益。如果你使用自己的图片，图片旋转木马需要高分辨率的图片，宽度为 304px，高度为 440px。iAd Producer 会自动为你生成低分辨率的资源。

   • 图片库现在应该填满我们的图片，并为它们添加 3D 视角。你的项目应该开始成形，看起来类似于以下截图：

   

5. 为了给图片添加极片效果，让我们在图片的外围添加一个 4px 的白色边框。通过单击选择图片旋转木马。在检查器面板中，展开边框部分。勾选复选框以打开边框，然后使用颜色选择器将颜色更改为白色；将宽度增加到4px。

   注意

   不要被添加到你的 3D 图片旋转木马上的阴影或反射所诱惑。阴影和反射在 3D 视图中可能会表现不佳。将它们保留用于静态或 2D 元素。

6. 我们现在需要做的就是添加背景渐变以匹配我们 iAd 的其余部分，并更改标题。点击广告画布的背景；然后，打开检查器以更改页面背景。我们希望使用在启动画面和菜单中得到的相同径向渐变，因此将第一个颜色设置为Snow，第二个颜色设置为Cantaloupe。

7. 一旦你对背景渐变满意，双击图片轮播标签以更改其中的文本。输入页面的标题，比如“我们的宠物”。你可能还想要从检查器面板的文本部分增大字体并更改颜色。

刚才发生了什么？

我们刚刚将“图片轮播”模板分配给广告的第一页，并向其中添加了一些图片。我们学习了如何一次性选择多个图片并将它们应用到画廊对象中。

当添加你自己的图片时，尽量保持每个画廊有 6 到 10 张图片，以获得最佳体验。

尝试一下英雄 — 覆盖流画廊

现在你已经知道如何选择多个图片并将它们添加到图片库中，为什么不尝试使用其他画廊模板之一呢？Cover Flow模板可以用来创建一个类似于 iTunes 中动画专辑视图的 3D 图片库。你还需要在这个视图中调整图片大小，使每个图片都是 440 像素宽的正方形。

摇动视图

到目前为止，我们只使用了 iPhone 的触摸屏，所以让我们开始利用这个设备的其他功能。内置在 iPhone 中的加速度计用于检测旋转和运动事件，这样我们就可以创建一个当用户摇晃 iPhone 时通过改变屏幕上的图片来响应的页面。

行动时间 — 摇一摇

使用内置的“摇一摇切换”模板，我们将创建我们的 iAd 的第二页。然后，我们将添加多个图片，每次用户摇晃设备时，这些图片都会发生变化。

1. 在 iAd Producer 中继续Dino Stores项目，双击项目概览中的页面 2。从模板选择器中选择摇一摇切换并按选择。

2. 现在通过双击它打开画布中的页面。展开资产库，找到图片dino-shape-1.png到dino-shape-8.png。现在点击第一个图片以突出显示它，然后按住Shift键点击列表中的最后一个图片以选择所有这些图片。现在将选择拖动到画布中间的占位符区域。在下面的屏幕截图中，我们可以看到选中的多个图片准备拖动：

3. 一些图片比占位符区域大，所以我们需要使用拖动手柄来扩展它。尝试将其设置为画布的全宽，并增加高度，以便第一张图片不会被裁剪。你可能想要重新定位图片以确保它仍然正确居中。当你拖动时，黄色的辅助线应该会帮助你。

4. 我们现在将逐个翻阅每张图片，检查它是否正确。为此，我们需要双击第一张图片以进入单元格编辑模式。就像多标签一样，这个可摇动的图像视图设置了多个单元格，它在它们之间进行转换。你应该在图像下方看到“1/8 单元格”导航框；点击左右箭头以循环查看每张图片。

   注意

   当你在单元格之间切换时，你应该看到图像在彼此之间晃动和淡入淡出；这是当你的广告用户摇晃设备时发生的动画。

5. 导航到每张图片并检查它们是否在边缘处被截断；如果有一个被截断，点击图片外部以退出单元格编辑模式并使图像区域更大以适应整个图片。

6. 一旦你对每张图片的显示效果满意，点击广告画布的背景并打开检查器面板。让我们将背景改为与我们的 iAd 保持一致。使用以Snow和Cantaloupe为颜色的径向渐变。

   注意

   如果你发现渐变看起来比你预期的更淡，尝试重新选择径向渐变选项。有时 iAd Producer 无法正确更新视图，这样做会强制它刷新预览。

7. 如果你愿意，更改页面顶部的文本；然而，请记住你将需要一个方法来告诉用户摇晃设备将使他们能够与你的 iAd 交互。

刚才发生了什么？

我们刚刚使用了页面模板“摇一摇变一变”来向我们的 iAd 添加一个页面，每次用户摇晃时都会改变。你可以使用设备硬件功能为你的广告添加额外的交互性，为用户提供难忘且沉浸式的体验。

让用户找到我们的商店

现在我们已经让用户对我们的产品产生了兴趣，让我们给他们一个购买它的方法！利用 iPhone 内置的 GPS 功能，你可以向用户展示他们当地的商店，并提供联系方式以便他们联系。

注意

虽然 iPod touch 没有内置 GPS，但它可以使用其无线互联网连接来估算用户的位置。这通常非常准确！

行动时间 — 商店查找器

这将是我们的“恐龙商店”iAd 的最后一页；我们将使用附近的苹果商店作为示例位置设置。

1. 如果你不是从上一个练习继续，请打开 iAd Producer 并选择我们一直在工作的项目。转到广告概览；应该仍然有一个没有模板的页面；这是我们 iAd 中的最后一页。双击页面 3并选择地图模板。

2. 一旦你选择了模板，双击页面即可在画布编辑器中打开它。让我们先从自定义地图开始；点击画布中央的占位地图区域，并在检查器面板中打开它。

3. 在属性部分，找到站点 ID。默认情况下，这设置为demo；这是苹果公司使用的示例 ID，显示了他们苹果零售店的位置。你通常会更新这个为你的站点 ID，这需要由苹果公司设置。当你与苹果公司合作加入 iAd 项目时，你可以联系他们请求一个。

4. 半径值定义了广告应该查找店铺的用户位置有多远。根据你拥有的店铺数量，你可能想要更改这个值；店铺数量越多或密度越高，搜索半径应该越小。对于演示站点 ID，将其设置为50mi。

5. 仍然在属性部分，点击自定义图钉中的下拉文件选择器以选择一个自定义图像来显示每个店铺的位置。选择你想要使用的图像，例如map-pin-footprint.png；这是一个红色图标，因为红色在 iOS 地图上用来表示目的地。根据图像，你可能需要调整偏移量以使图钉位于位置中心；例如，尝试Offset X的-9px和Offset Y的5px。你的图钉应该出现在画布上的地图中心，如图所示：

6. 这样，地图视图就完成了，但让我们添加一些视觉调整，使其看起来更好。选择地图视图后，向下滚动到检查器面板的边框部分，并添加一个4px，实心白色边框来框定地图。

7. 让我们再添加一些阴影，使地图从背景中突出出来。在边框部分下方，通过勾选复选框启用阴影，并点击颜色以打开颜色选择器。将不透明度滑块调整到较低的设置，大约40%左右，以减少阴影的不透明度并使其在屏幕上不那么刺眼。

8. 地图视图样式完成后，现在让我们为页面背景添加径向渐变。点击画布并展开检查器面板中的背景部分。添加你在整个广告中使用的渐变。如果你使用了建议的渐变，从蜡笔颜色选择器中选择Snow和Cantaloupe作为颜色。

9. 让我们将位置文本更改为类似查找一家商店 ..的内容，通过双击标签进入编辑模式。

10. 让我们也为我们的总部添加一个编号。模板没有提供任何其他标签，所以我们需要自己添加。在底部栏的左侧，点击对象图标以打开对象库，然后向下滚动直到找到标签对象，如图所示。选择它以将一个空标签添加到画布上；

11. 双击画布上的新标签以进入编辑模式。输入一些文本，例如联系我们：555-1051。你可能需要调整文本区域的宽度以适应整个消息。现在，将文本区域移动到屏幕底部。

    注意事项

    你可能需要缩小地图并移动标签远离屏幕底部。我们使用的滑动揭示菜单模板将菜单的顶部部分添加到广告的每一页，这样用户就可以回到主页。在 Safari 中预览广告，看看你是否需要重新定位它——导航到广告概览并从菜单栏选择导出 | 在 Safari 中预览。只有当你从概览开始预览并点击菜单导航到该页面时，菜单才会显示。

12. 一旦你对标签的位置满意，保存你的完成版 iAd！

刚才发生了什么？

我们刚刚在我们的 iAd 中添加了最后一页，这样顾客就能找到我们最近的商店。你现在已经完成了你的第一个 iAd 的制作。做得好！你的概览屏幕应该类似于以下截图：

快速问答 — iAd Producer

现在你已经熟悉了 iAd Producer，看看你是否能回答以下简单问题：

1. 你去哪里找你导入到 iAd 中的媒体？

   • a. 检查面板

   • b. 画布

   • c. 文件菜单

   • d. 资产库

2. 一个在多个值之间变化的文本框叫什么名字？

   • a. 多标签

   • b. 大量标签

   • c. 文本转换器 5000

   • d. 淡入文本框

摘要

你在本章中学到了很多，并在 iAd Producer 中制作了你的第一个广告。你现在应该知道如何：

• 在 iAd Producer 中创建一个项目

• 制作横幅、闪屏页面、菜单和子页面

• 为每个视图选择一个模板

• 将径向和线性渐变添加到元素的页面背景

• 通过添加自己的自定义对象来扩展模板

• 使用 Safari 预览你的 iAd

现在你已经制作了一个出色的 iAd，我们将探讨如何在物理设备和模拟器上测试它，如何修复出现的问题，以及你 iAd 的常见问题。

第四章：确保其工作正常

现在我们已经构建了我们的第一个 iAd，我们需要测试其功能性和性能，以确保我们为用户提供最佳可能的体验。彻底的测试将有助于通过展示质量和档次来确立您品牌的价值。

在本章中，我们将探讨以下内容：

• 学习在 Safari 中测试的局限性

• 在 iOS 模拟器中进行测试

• 与模拟器交互

• 模拟硬件事件

• 在设备上部署和“触摸”我们的广告

• 调试常见问题

• 使用演示分享我们的 iAd

在 Safari 中进行测试

在上一章中，我们简要地看了如何在 Safari 中使用 Safari 预览我们的动画，现在让我们深入探讨并用于测试，我们会很快发现其局限性。

是时候在 Safari 上进行操作了

让我们在 Safari 中打开一个项目进行预览和测试。

1. 在iAd Producer中打开一个项目，例如我们一直在工作的Dino Stores项目。

2. 从广告概览中，通过单击选择 iAd 的页面；它周围应该出现一个黄色边框。现在，从菜单栏选择导出，然后在 Safari 中预览，或者使用键盘快捷键Cmd + Shift + Enter。

   注意

   如果在从概览中预览时没有选择特定的页面，iAd Producer 将默认打开启动页面。

3. 您的 iAd 页面将在 Safari 中打开；您现在可以点击周围来测试您的广告。点击菜单项导航到广告的其他页面。

   小贴士

   要直接从画布中测试广告，请选择导出，然后在 Safari 中预览，iAd Producer 将自动打开您一直在工作的当前页面。

4. 尝试与广告互动；你会很快看到有一些局限性。Safari 中的预览缺少围绕横幅的 iAd 框架，并且那些通常不会可见的元素在它们进入视图之前就可以看到。虽然图像、音频和视频元素将工作，但如地图和可摇动的视图等元素在 Safari 预览中不可用。

   如果某些对象不可用，Safari 将显示一个警告提示，告知您哪些组件无法加载。

发生了什么？

我们刚刚在 Safari 中直接从概览和编辑画布上的特定页面打开了我们的 iAd。这对于快速测试很有用，但在它可以显示的对象和我们可以使用的硬件交互方面存在局限性；例如，摇动设备和多点触控不可用。

您的 Mac 上的 Safari 可能使用的是比 iOS 中可用的WebKit更新的版本，这意味着您不太可能看到在使用 iOS 时可能出现的问题。

WebKit 是一个开源渲染引擎，它决定了网页应该如何显示。它被 Safari（在桌面和移动设备上）和 Chrome 等网络浏览器使用。

我们无法在 Safari 中测试我们 iAd 的某些部分和页面之间的流程和交互，所以让我们使用 iOS 模拟器打开一个 iAd。

在模拟器中进行测试

iOS 模拟器允许我们在没有设备的条件下进行测试，并且对于在兼容性检查中快速部署测试在一个准确的环境中非常有用。

在产品上市之前，开发者无法获得物理设备，因此启动时可用的 iPad 应用程序完全使用模拟器构建。

安装 Xcode 和 iOS 模拟器

要使用 iOS 模拟器在 iPhone 和 iPad 上进行测试，您需要从 Apple 安装 iOS SDK，它包含在 Xcode 中。SDK是软件开发工具包；它包含构建和测试特定平台软件所需的工具。

Xcode 可以从 Mac App Store 或从开发者门户手动下载。Mac App Store 更受欢迎，但仅适用于 Mac OS X 的较新版本。让我们看看如何使用 Mac App Store 安装，以及如果不可用，如何手动获取 Xcode。

注意

您需要在您的 Mac 上有大约 10GB 的可用磁盘空间来安装 Xcode 和开发工具。您必须将 Xcode 安装在您的主硬盘上，因为它需要更新核心系统工具，这些工具不能从外部磁盘运行。

行动时间 — 使用 Mac App Store 安装 Xcode（简单）

我们现在将发现您的 Mac 上是否有 Mac App Store，如果有，则安装 Xcode。

1. 从菜单栏最左侧的 Apple 图标中选择App Store以打开商店。

   注意

   如果找不到菜单按钮，这意味着您的 Mac OS 版本不支持 Mac App Store。要更新您的操作系统，请选择 Apple 图标并选择软件更新。完成任何必需的更新后，再次开始此练习。

   如果您仍然看不到 Mac App Store，请跳到下一练习—手动安装Xcode。

2. 打开 App Store 后，搜索 Xcode 或访问 itunes.apple.com/gb/app/xcode/id448457090 以自动打开 Xcode。

   注意

   在 Lion 之前的较旧版本的 Mac OS X 可能会尝试向您收取从 Mac App Store 下载 Xcode 的费用。如果 Xcode 未能作为免费下载出现，请遵循下一练习中的手动步骤，免费安装它。

3. 下载完安装 Xcode 应用程序后，双击它以打开安装程序。按照安装步骤操作，Xcode 将被安装！

发生了什么？

通过使用 Mac App Store 下载我们的应用程序，我们避免了从开发者门户下载的大量手动和繁琐的任务。您在打开商店时将自动收到更新通知；或者，如果 App Store 图标在您的 dock 中，当有更新可用时，将出现徽章。

如果您在安装后需要磁盘空间，可以安全地删除安装 Xcode 应用程序。但是，保留它将意味着未来的 Xcode 更新可以更快地下载，因为只需下载安装更改的部分。

如果您无法从 Mac App Store 下载 Xcode，请遵循下一练习中的手动下载步骤。

手动安装 Xcode 的时间 — 手动安装（更难）

如果您不想使用或无法使用 Mac App Store，我们可以从开发者门户手动下载和安装 Xcode。如果您已成功从 App Store 下载了应用程序，请跳过此练习。

1. 要访问 iOS SDK，我们需要登录到 iOS 开发者门户。转到developer.apple.com/ios/并使用您的 Apple ID 和密码登录。

2. 我们需要下载 iOS SDK，这是用于为 iPhone 和 iPad 开发 iOS 应用程序的应用程序。登录后，找到页面底部的下载部分，并点击下载 Xcode 4以开始下载。在以下截图中，我们可以看到开发者门户中下载 Xcode 的选项：

   注意

   Xcode 和 iOS SDK 的下载大小为几个吉字节，可能需要一段时间才能下载；如果您连接速度较慢，可能值得留到夜间完成。

   下载完成后，通过双击打开Xcode and iOS SDK.mkpg安装包。当提示此包将运行一个程序以确定软件是否可以安装时，点击继续。

3. 阅读并接受软件许可协议，然后继续到安装类型屏幕。确保所有选项都已勾选，因为我们需要安装 iOS 模拟器的所有组件。您的安装窗口应类似于以下截图：

4. 点击继续然后安装，以完成安装。

注意

默认情况下，Xcode 和相关工具存储在您的硬盘上的Developer目录中；您通常不需要更改此设置。

刚才发生了什么？

您刚刚从开发者门户手动安装了 Xcode（那些无法通过 Mac App Store 安装 Xcode 或它对您不可免费使用的人）。

您现在已安装了构建 iOS 和 Mac 应用程序的工具，包括 iPhone 和 iPad 的 iOS 模拟器。尽管我们不会使用 Xcode 来开发我们的广告，但我们仍然必须安装它以使模拟器工作。

打开广告的时间

现在我们已经安装了 iOS 模拟器，我们可以测试在完整的 iAd 框架中运行的 iAd。

1. 打开 iAd Producer 并加载一个现有的 iAd 项目，例如我们之前制作的Dino Stores项目。

2. 从广告概览中，点击左下角的模拟按钮以打开模拟器。您可以使用Cmd + Enter从键盘打开模拟器。

   注意

   iAd Producer 将根据您正在工作的项目类型自动打开 iOS 模拟器作为 iPhone 或 iPad。

3. 

   注意

   iAd 测试器应用是一个虚假的占位符应用，它模拟了一个您的广告可能出现的应用。通常，您的 iAd 将出现在底部，位于标签栏上方，用于在应用屏幕之间导航。

4. 点击横幅以打开您的 iAd。现在您可以像在设备上一样玩转并测试您的 iAd。

刚才发生了什么？

您现在已经在将运行的精确软件环境中测试了您的 iAd。每当您想要在模拟器中更新预览时，只需按下 iAd Producer 中的模拟按钮，它将被重新部署。

与模拟器交互

对于快速检查，与 Safari 相比，使用模拟器会更好，因为您的广告被正确地嵌入并且可以访问完整的 iAd 功能和组件。与 Safari 不同，我们在与 iAd 交互时能够模拟硬件事件。

模拟器中的硬件模拟实战时间

使用真实设备，我们可以摇晃、捏合和旋转 iPhone 或 iPad 来与 iAd 交互。这些事件可以在模拟器中模拟。

1. 我们将使用一个示例项目，其中包含我们可以与之交互的对象集合。打开与书籍资源一起提供的Interaction Demo项目。

2. 从广告概览中，点击模拟按钮以打开模拟器。首先，让我们看看如何旋转设备。

3. 您应该在 iAd 测试器中看到横幅出现。现在我们将旋转模拟器来检查我们的横幅在横幅模式下的外观。从菜单栏中选择硬件然后向左旋转或向右旋转来旋转设备。然后模拟器将旋转，横幅应该更新以显示横幅模式。现在将 iAd 旋转回纵向，可以通过相反方向旋转一次，或者通过在相同方向旋转模拟器三次，回到起始位置。

   注意

   您还可以使用键盘快捷键来旋转模拟器；尝试按住Cmd键并使用左右箭头。

4. 现在点击横幅以进入 iAd。从菜单中选择Shakey Time。现在我们将学习如何模拟用户摇晃他们的设备。从硬件菜单中选择摇晃；广告应该更新以显示您已经摇晃了它。尝试再摇晃几次。您可以在以下截图中的硬件菜单项中看到摇晃手势：

   注意

   很遗憾，摇晃您的 Mac 不会更新模拟器中的广告。然而，键盘上的cmd + ctrl + Z可以为您提供快速摇晃 iOS 模拟器的方法。

5. 点击菜单按钮回到演示 iAd 的起始位置。现在选择第二个项目GPS/多点触控。这将打开一个提示，请求访问您的位置，模拟真实设备中找到的 GPS 硬件。由于您的 Mac（可能）中没有 GPS，模拟器默认设置为加利福尼亚州库比蒂诺的苹果公司总部。

6. 现在，地图已经找到了你的位置，让我们模拟一个捏合手势来放大和缩小地图。将鼠标指针移至地图中间附近，并在键盘上按住Ctrl键；应该会出现两个圆圈，代表两个手指的触摸点。继续按住Ctrl键，从地图外部点击并拖动以放大。要缩小，重复此过程，但开始于地图外部并向内拖动。以下截图显示了模拟的多点触控拖动：

7. 尝试捏合和展开地图来放大和缩小；这可能需要一段时间才能习惯，所以如果你第一次没有成功，不要担心。当你对这些手势有信心时，点击菜单返回主广告屏幕。

8. 最后，我们将尝试快速滑动全景视图。从菜单中打开Flick页面。你现在应该看到一个图像；这个图像在一个可滚动的视图中，因此可以在其框架内移动以显示不同的部分。点击并拖动图像以查看这一点。要快速滑动图像，快速并尖锐地点击并拖动；你应该会看到在你放手后图像仍然继续移动。

   注意

   快速滑动用于快速导航大型的可滚动区域。iOS 计算拖动手势的速度和距离，并给滚动添加惯性，因此在你从屏幕上移开手指后它仍然继续移动。然后滚动逐渐减速到一个自然结束。

9. 一旦你满意自己能够与 iOS 模拟器交互，可以通过从菜单栏中选择iOS Simulator并点击退出来退出它，或者使用键盘快捷键，Cmd + Q。

发生了什么？

我们刚刚测试了模拟硬件事件，例如旋转、震动和多点触控。请记住，与设备相比，模拟器中的某些硬件功能表现并不完全相同；例如，GPS 模拟位置和鼠标指针提供的点击精度比手指更高。

快速问答——iOS 模拟器

检查你是否能够回答以下关于 iOS 模拟器的问题：

1. 我们需要安装什么才能使用 iOS 模拟器？

   • a. Xcode 和 iOS SDK。

   • b. 仅 Xcode。

   • c. 仅 iOS SDK。

   • d. iOS 的开发者预览版。

2. 你如何在 iOS 模拟器中使用捏合手势？

   • a. 按压屏幕。

   • b. 在键盘上按Cmd + Z。

   • c. 在触控板上用两个手指捏合。

   • d. 按住Ctrl以显示两个触摸点，然后点击并拖动。

演示时间——模拟不同设备

默认情况下，iAd Producer 以iPhone 4 with Retina Display打开 iPhone 广告的模拟器，或以通用 iPad打开 iPad 项目。iPhone 4 模拟器缩放至 50%，以抵消更高的像素计数，以便它仍然可以适应您的屏幕。我们还可以打开一个标准分辨率的显示 iPhone，以查看我们的低分辨率资源如何显示。让我们尝试在 iPad、标准分辨率 iPhone 和不同的 iOS 软件版本中进行模拟。

1. 让我们打开一个 iPad 项目来查看模拟器在测试 iPad 广告时的外观。由于我们尚未创建 iPad 广告，请从书籍资源中打开交互演示 - iPad文件。一旦加载，点击模拟以打开模拟器。

2. 模拟器应该会自动与 iPad 一起打开。尝试与 iAd 交互——摇动和旋转的硬件控制方式相同。

   注意

   区分 iPad 和 iPhone 4 视网膜模拟器可能很困难；如果您不确定哪个模拟器是打开的，请检查标题栏，它应该说明它是以 iPad 还是 iPhone 运行。

3. 默认情况下，iOS 模拟器将 iPad 的分辨率缩放至 50%，如果你的屏幕不够大，无法显示 iPad 的原生尺寸。要正确缩放 iPad 模拟器，请从菜单栏中选择窗口。现在点击缩放并选择100%。您也可以使用键盘上的Cmd + 1切换到 100%缩放，使用Cmd + 2切换回 50%。当缩放到 100%时，您可能需要滚动模拟器来访问 iPad 的屏幕外部分，如下面的截图所示：

4. 关闭 iPad 模拟器并打开一个 iPhone 项目，例如交互演示。我们现在将测试我们 iAd 的标准分辨率、非视网膜版本。打开广告概述中的横幅；它现在应该出现在编辑画布上。从右上角的视图下拉菜单中，将其从iPhone (Retina) - 50%更改为iPhone，如下面的截图所示：

5. 现在，点击模拟以打开标准分辨率的 iPhone 模拟器。模拟器现在应该有一个合适的 iPhone 框架包围它，没有标题栏。您应该使用标准分辨率模拟器来检查 iAd Producer 是否已正确将图像缩放到这些设备上显示。

6. 我们还可以指定不同的 iOS 版本来测试我们的 iAd。较旧的 iOS 版本可能有不同的渲染怪癖，并且可能以不同的方式显示内容，因此在部署之前测试尽可能多的版本是很重要的。要更改模拟器启动的 iOS 版本，请从 iAd Producer 的菜单栏中选择导出，然后选择模拟器 iOS 版本；尝试更改版本并点击模拟以重新启动广告。

注意

根据与 Xcode 一起安装的 iOS SDK 版本，您可能只有 iOS 模拟器的一个版本可用。苹果在发布每个新版本的 iOS 时都会定期更新 SDK，因此请留意苹果宣布 SDK 更新的电子邮件。然后，您可以重新下载最新的 Xcode 并安装更新，以便访问最新的模拟器。

刚才发生了什么？

使用模拟器，我们能够模拟不同的硬件和软件条件，以测试 iAd 可能出现的各种情况。

Have a go hero

为什么不尝试在不同的模拟器条件下测试我们在 第三章 "制作您的 iAd" 中制作的 iAd 或您自己的 iAd，以检查它是否按预期工作。您可以尝试：

• 在模拟器中测试

• 预览您的资产在高分辨率视网膜显示屏和标准分辨率显示屏上的外观

• 测试与硬件的交互，例如摇晃和使用 GPS 位置

• 在不同版本的 iOS 中使用您的 iAd

在设备上测试

在您的计算机上测试可以很好地检查图形是否如您预期的那样，预览动画，并尝试您的广告的流程；但它们无法与触摸和与沉浸式 iAd 交互的经验相提并论。

安装 iAd Tester

iAd Tester 是我们在 iOS 模拟器中使用的 虚假 占位符应用，用于测试我们的 iAd。苹果已将此应用提供给我们，以便我们可以在我们的 iOS 设备上安装并直接测试广告。使用 iAd Tester，我们可以访问设备上的 iAds、在 Mac 上远程访问，以及从 iAd 测试服务器无线访问。

在前面的屏幕截图中，您可以看到 iAd Tester 在 iPhone 4 上运行。

操作时间 — 将 iAd Tester 放置在您的设备上

当您安装 iAd Producer 时，它将 iAd Tester 的一个版本放置在您的 Mac 上。我们可以使用 iTunes 在我们的 iOS 设备上安装它。

1. iAd Producer 将 iAd Tester 的一个版本复制到您的 Mac 的 Developer 文件夹中。打开 Finder 并导航到 Developer，然后 iAdJSDeveloper；现在打开 iAdTester-Device 文件夹。您应该看到一个名为 iAdTester 的文件。

2. 打开 iTunes 并将文件拖到您的库中，正如您在以下屏幕截图中看到的那样：

3. 这会将 iAd Producer 添加到您的 iTunes 库中，以便它可以同步到您的 iOS 设备。现在，使用 dock 连接线将 iOS 设备（如 iPhone 或 iPad）连接到您的 Mac。iTunes 应该现在可以识别设备，它将显示在侧边栏中。单击设备图标以打开概览，并将选项卡切换到 Apps。确保 Sync Apps 已选中，并在右侧的应用列表中找到 iAdTester；勾选复选框以选择它进行同步。您的 iTunes 应用程序页面应类似于以下屏幕截图：

4. 点击应用并等待设备同步。现在 iAd Tester 应该已经安装。

   注意

   你的 iOS 设备在任何时候只能与一台机器同步；如果你想与不同的机器同步，你可能会丢失设备上的媒体和应用程序。

5. 对所有需要测试的 iOS 设备重复此操作。

刚才发生了什么？

使用 iTunes，我们将 iAd Tester 复制到我们想要用来测试 iAds 的 iOS 设备上。你应该尝试在许多设备上测试，所以请在每个设备上安装 iAd Tester。

保持你的 iOS 设备连接并打开 iTunes，因为我们现在将查看如何使用 iAd Tester 导出和访问我们的 iAd。

访问你的开发 iAd

iAd Producer 允许你导出并复制你的 iAd 到设备，或者通过网络无线广播你的项目。让我们导出我们的 iAd 并将其复制到已安装 iOS Tester 的设备上。

复制到设备

我们可以使用 iTunes 将我们的广告复制到设备上。如果你没有无线连接或者想在远离 Mac 的地方演示你的 iAd，这很有用。

注意

如果你正在开会讨论你那令人兴奋的 iAd 的进展，将 iAd 复制到设备上意味着你可以在不需要 Mac 开机并连接到同一网络的情况下展示你的作品。

行动时间 — 导出我们的 iAd

在我们能够将我们的 iAd 复制到 iPhone 或 iPad 之前，我们需要导出我们的广告。

1. 在 iAd Producer 中打开你想要导出的项目，例如，我们在上一章中制作的 iPhone iAd Dino Stores。

2. 从菜单栏的导出项中选择导出到磁盘（优化）。现在选择一个位置导出你的 iAd 并保存。

注意

当你导出一个优化的广告时，iAd Producer 会自动生成两个额外的文件，WebArchive.manifest和WebArchive@2x.manifest。这些清单文件是 HTML5 的一部分，告诉网络浏览器或 iAd 框架，它们包含的所有文件名都应该下载以供离线使用。这意味着你的 iAd 中的内容在需要之前就开始加载，所以当用户浏览你的 iAd 时，广告内容会立即显示。优化的广告也被压缩，代码中的空白和注释被移除。

刚才发生了什么？

导出我们的 iAd 项目到 Mac 上的一个文件夹。现在我们已经有了正确的格式的广告，我们可以将其复制到设备上并开始测试。

行动时间 — 将我们的广告复制到设备

iTunes 的文件共享功能可以用来将我们的 iAd 复制到设备上，以便可以用 iAd Tester 打开。确保你使用的是启用了文件共享功能的最新版本的 iTunes——从菜单栏中选择苹果标志，然后软件更新…下载可能需要的任何更新。

1. 在 Finder 中找到您导出的 iAd；它应该是一个名为 Your-Project-Name.ad 的文件夹。如果您好奇，可以查看您导出的 iAd 的结构。iAd Tester 需要我们导出项目的压缩或压缩版本，因此右键单击包含导出的文件夹并选择 Compress "Your-Project-Name.ad"。以下屏幕截图显示了我们的 Dino Store 项目正在压缩：

2. 在 ZIP 文件创建后，请检查 iTunes 是否已打开，并连接一个已安装 iAd Tester 的 iOS 设备。在侧边栏中单击设备以打开概览。现在，打开 应用程序 选项卡并找到底部的 文件共享 部分。

   注意

   不要对您导出的 iAd 中的文件进行任何更改，例如修改资产，因为导出的项目无法再导入到 iAd Producer。

3. 在 文件共享 部分中选择 iAd Tester，使其高亮显示。现在，您可以将压缩的 ZIP 文件拖动到文档区域，或者点击 添加 并找到要复制的文件。文件现在将同步到设备。以下屏幕截图显示了我们将之前压缩的 Dino Stores 广告同步的过程：

注意

如果 iAd Tester 没有出现在应用程序列表中，请确保它已安装。检查您的 iOS 设备主屏幕上的图标。如果没有，请尝试重新安装。

发生了什么？

我们现在已将我们的 iAd 传输到我们的设备，以便我们可以测试它。如果您想从 iPhone 或 iPad 删除广告（或任何文档），请在高亮显示文档列表中的项目并按 Delete 或 Backspace 键。

在设备上测试

一旦我们成功使用 iTunes 将我们的广告传输到 iPhone 或 iPad，我们就会想要运行并首次体验它。

操作时间 — 测试广告

在您的 iOS 设备上安装了 iAd Tester 并将广告传输到该设备后，我们现在可以打开并测试我们的广告：

1. 通过在主屏幕上点击其图标，从您的设备打开 iAd Tester。

2. 现在，点击 On My Device 以显示您使用 iTunes 文件共享复制到 iAd Tester 的 Documents 文件夹中的文件列表。

3. 选择您想要预览的 iAd；如果您使用的是 Dino Stores 项目，请从列表中选择 Dino Stores。

4. iAd Tester 现在显示一个模拟应用程序，其中可能包含您的 iAd；点击横幅以开始与您的 iAd 交互。在这里，您可以看到您需要导航以演示广告的三个屏幕：

5. 如果您想关闭您的 iAd，只需点击左上角的 X 返回到模拟应用程序。如果您想更改您正在使用的广告，请从导航栏点击 On My Device 并选择不同的一个（如果有的话）。

发生了什么？

我们现在可以在实际设备上测试我们的 iAd；这是了解我们的广告在受限制的移动设备硬件上表现如何的关键。

只为了查看我们的广告就走了这么多步骤，所以让我们尝试使用 Wi-Fi 网络无线测试我们的 iAd。

无线测试

幸运的是，为了快速测试，我们不需要每次想要预览更新时都同步新版本的 iAd 到设备上。如果我们的 iOS 设备和运行 iAd Producer 的 Mac 在同一网络中，我们可以无线访问我们的项目。

行动时间 — 无线部署

iAd Producer 能够无线共享开放项目到 iAd Tester。在继续之前，请确保您的 iOS 设备和 Mac 连接到同一网络。

1. 打开 iAd Producer 和您想要测试的项目。确保项目与您正在测试的设备相匹配；例如，iPhone 项目只能在 iPhone 或 iPod touch 上可用。打开交互演示项目以在 iPhone 上测试它。

2. 一旦项目打开，我们需要启用无线共享。通过从菜单栏中选择iAd Producer，然后选择偏好设置，或使用键盘快捷键Cmd +*, (一个逗号)来打开偏好设置菜单。

3. *从偏好设置菜单中，打开测试选项卡，并确认启用设备上的 iAd 测试滑块设置为开启。如果没有开启，将其滑动到开启位置。以下截图显示了您应该使用的 iAd 测试设置：

   注意

   您还可以通过从菜单栏中的iAd Producer项使用本地共享广告选项来切换无线共享的开启和关闭。

4. 现在您可以关闭偏好设置窗口，并在您的 iOS 设备上打开 iAd Tester。您在 iAd Producer 中打开的所有项目都将广播并可在 iAd Tester 中查看。

5. 从 iAd Tester 中，您现在应该看到一个计算机部分，其中应该列出您的电脑名称。点击您的电脑名称以查看打开的 iAd Producer 项目列表。

   注意

   如果您找不到您的电脑，请确保两个设备连接到同一网络。如果您找不到您的项目，请记住，在 iAd Producer 中尚未保存的新项目将显示为未命名。

6. 选择您想要预览的广告。您现在将看到与使用 iTunes 文件共享在设备上保存的广告相同的相同模拟占位符应用。

7. 现在尝试在 iAd Producer 中修改您的广告并再次在 iAd Tester 中预览它。您可能需要关闭并重新打开广告以预览更新，因为设备需要下载更改。

8. 当您关闭 iAd Producer 或项目时，它将不再远程可用，直到您在 iAd Producer 中再次打开该项目。

发生了什么？

iAd Producer 现在通过您的 Wi-Fi 网络本地广播您的 iAd，以便在运行 iAd Tester 的设备上访问。这是一种轻松测试您的广告，并且经常在真实设备上测试的好方法；尽可能使用它！

尝试一下英雄 — 保护 iAd Producer

目前，任何连接到与您相同 Wi-Fi 网络的人都可以看到正在广播的广告。如果您在一个可信的网络中，比如您的家庭或办公室，这应该是安全的，但如果您在使用公共 Wi-Fi，您可以确保哪些设备可以访问您的 iAds。

尝试以下步骤：

1. 如果您还没有，打开 iAd Producer 并启用本地共享广告。

2. 从 iAd Producer 预设中，勾选 查看 iAds 需要身份验证 复选框。现在按 配对设备..。

3. iAd Producer 将显示一个 PIN 码。在您的设备上打开 iAd Tester 并点击您的计算机名称；它应该在下面显示 开放以配对。输入 PIN 码。以下截图显示了示例 PIN 码：

4. 对您想要配对的任何其他设备重复此操作。

您的 iAds 现在只能通过授权设备无线访问。或者，当您不想广告被广播时，可以切换到 本地共享广告 选项。

注意

记住，iAd Producer 只广播当前打开的 iAd 项目；当您关闭 iAd Producer 时，您或您网络上的其他人将无法访问任何广告。

# 提交您的广告

一旦您完成您的 iAd，您可以将它提交给 Apple iAd 网络，以便从实时服务器上进行测试。这很有用，因为它模拟了您的 iAd 在上线时将经历的精确交付流程，并允许您测试在蜂窝网络上的下载性能。

行动时间 — 在网络上发布

要启用您的账户以使用 iAd 测试服务器，您需要联系 Apple，他们可以启用您的 Apple ID 以进行测试。您只能在 iAd 制作的最后阶段，并且有 Apple 的 iAd 账户经理时才能这样做。

1. 选择 导出，然后 上传到 iAd 测试服务器。您需要使用您的 Apple ID 登录。然后会出现 上传选项 对话框。

2. 输入您的 iAd 的详细信息，例如广告名称和描述。

   注意

   如果您上传的广告名称与现有广告相同，它将被覆盖；为了避免这种情况，请确保您使用一个独特的名称。

3. 点击 上传，您的 iAd 将开始上传到测试服务器。在上传过程中，您无法编辑广告，但您可以继续工作在其他 iAd 项目上。

4. 上传完成后，您可以将通知邮件发送给您的团队，告知他们 iAd 已在测试服务器上可用。邮件中包含用于在您的设备上查看广告的说明。

发生了什么？

您刚刚将您的广告上传到 iAd 测试服务器；这使您能够精确复制您的 iAd 将加载的条件，例如网络速度和延迟问题。您现在应该在所有可能的连接方式上测试您的 iAd，例如 Wi-Fi、蜂窝网络和差的网络信号。

快速问答 — 在何时测试什么

虽然在可能的情况下最好在设备上进行测试，但当我们对 iAd 进行快速迭代时，通常更容易以其他方式预览我们的广告。看看您能否在这些情况下提出最合适的方法：

1. 如果您想测试 iAd 中的按钮，哪种方法最好使用？

   • a. Safari。

   • b. 总是在设备上测试。

   • c. iAd Producer 的画布预览。

   • d. iOS 模拟器。

2. 您更改了其中一个元素的动画，并想看看它的效果，您会使用哪种方法？

   • a. 设备。

   • b. 模拟器。

   • c. Safari。

   • d. 画布。

   • e. 上传到 iAd 测试服务器。

3. 您导入了一些额外的资产，并想检查它们是否已正确缩放；您会使用以下哪种方法？

   • a. iAd Producer 的画布预览。

   • b. 一台设备。

   • c. Safari。

   • d. iOS 模拟器。

解决常见问题

您需要确保您的 iAd 符合苹果公司的法规和指南，并了解如何在 iAd 开发过程中解决可能出现的常见问题。让我们看看如何查找潜在问题，并克服您可能会遇到的一些问题。

验证您的广告

您可能省略了 iAd 中所需的某些元素或设置，或者您的资产大小可能超出了苹果公司的指南。幸运的是，iAd Producer 能够发现您广告中可能阻止其正确工作的潜在问题，并提出改进建议以提高广告的性能。

行动时间 — 验证您的 iAd

当您在 iAd Producer 中处理项目时，您可以随时检查广告的状态。

1. 在 iAd Producer 中打开您想要验证的项目，例如，本书资产中的验证示例。

2. 项目打开后，从菜单栏选择 导出，然后 显示项目警告。这将打开 项目报告 窗口。以下是一个 项目报告 的示例：

报告按一般和页面特定问题拆分，分为两个部分：

• 错误—用红色圆形图标突出显示

• 警告—用橙色三角形图标突出显示

错误意味着项目无效，并且未经纠正不会被苹果公司接受进入 iAd 项目。警告是建议和提示，表明您可能遗漏了某些内容，或提供了改进您 iAd 的方法。警告不会阻止您的 iAd 被苹果公司接受，但重要的是，如果可能，检查并修复它们。

让我们先修复项目中的错误。

1. 如果您正在使用示例广告，您会注意到错误是由于我们其中一张图片的文件大小引起的。我们可以通过使用 Preview 调整图片到正确的大小，并用 ImageOptim 优化图片来修复这个问题。每次我们在 iAd Producer 之外更新资产时，我们都需要告诉它更新其本地副本。

   注意

   当您将资产添加到资产库时，iAd Producer 会为每个资产创建一个副本并将其保存在您的项目中。

2. 要使用 iAd Producer 底部的左下角的资产按钮刷新我们的资产库，以获取资产的最新版本。已更新的资产旁边有一个圆形箭头；右键单击资产并选择更新。确认您要更新文件，更新后的资产现在将出现在您的库中。在下面的屏幕截图中，我们可以看到一个资产更新确认的示例：

3. 如果您正在使用示例项目，请重新打开项目报告；现在它应该不再有文件大小错误。

注意

如果项目报告仍然显示您已修复的错误或警告，请尝试点击底部的右下角的刷新按钮。报告通常会自动更新，但有时您需要强制它检查您的项目。

一旦修复了项目中的所有错误，请查看剩余的警告。示例项目有几个警告，大多数像“名为'页面 1'的页面没有更改”。这个警告是由于我们没有应用模板或更改此页面而生成的。逐个检查每个“未更改”的错误，并添加一个模板和一些自定义内容。

其他常见警告包括：

• "在'Preroll Video'页面上的具有出口'video'的对象缺少一个或多个必需属性": 如果您的广告中没有预滚动，可以安全地忽略此警告；如果您有，请确保您已将视频添加到启动页面的预滚动选项卡中。

• "图像资源'image-name'的高度/宽度大于包含组件 ImageView1 的高度/宽度": 这意味着图像的尺寸大于包含它的视图的尺寸，因此您可以调整图像的大小（并减小文件大小），因为图像比所需的要大。

如果您无法修复所有警告，只要您知道它们并且意识到其影响，就不用担心。

刚才发生了什么？

我们刚刚在 iAd Producer 中使用了项目报告工具来突出显示阻止项目被苹果接受的错误，并修复了一些可能影响广告性能的警告。您也可以从广告概览的检查器面板中找到项目报告工具。现在，我们可以查看项目报告未检测到的问题。

故障排除常见问题

在构建您的 iAd 时，您可能会遇到一些常见问题；以下是一些可能的解决方案。

关于图像文件大小的警告

我已经减小了图像的大小，但 iAd Producer 仍然显示警告或错误。

通过确保使用正确的图像类型可以减小大图像的大小；例如，如果你不需要透明度，确保你的图像使用 JPG 格式。在预览中保存 JPG 图像时，我们可以提高压缩级别以减小文件大小。从预览的菜单栏中选择文件，然后另存为，并调整质量滑块，直到图像大小减少到可接受的水平。然而，要注意，过度降低图像质量可能会导致图像出现块状和像素化。尝试不同的质量水平，直到找到可接受的权衡。在下面的屏幕截图中，你可以看到保存图像时质量和文件大小对话框的示例：

慢速性能

我的广告在模拟器上表现很好，但在设备上真的很慢。

你的 Mac 比你的 iOS 设备拥有更多的资源和功率（尽管它们正在迅速追赶），所以在设备上测试时你可能会看到一些性能下降。

注意

这就是为什么你应该在整个开发周期中经常在设备上测试。你将能够及早发现问题并追踪原因。同时，也要确保在不同的设备型号上进行测试，因为某些设备的性能比其他设备更强。

通常，可以通过隔离减慢广告速度的组件来优化你的 iAd 性能；检查以下元素：

1. 大阴影：每个阴影都必须动态地绘制到你的 iAd 上，而较大的阴影生成需要更长的时间。如果你看到性能不佳，尝试减少阴影的距离和模糊度。

2. 缓慢或跳跃的动画：如果设备中没有足够的功率重新绘制运动每一帧，对象将不会平滑地动画化。通常，这会在你同时进行太多动画，或者动画元素应用了太多样式时发生。尝试减少同时动画的项目数量，并移除或减少如阴影、反射或透明度等密集样式。

3. 图像仅短暂显示部分内容：这通常是由于你的 iAd 没有预取广告使用的资产。iAd Producer 仅对导出的优化广告启用预取，所以当你在你 Ad Test Server 上测试广告时，你不应该经常看到这种情况。

注意

即使你的导出 iAd 已经优化，你仍然可能会看到图像在下载过程中部分出现。优化的广告会在需要之前开始下载资产；但是，如果你连接速度慢，或者有大量资产，它们可能在你需要之前没有下载完成。

导入的图像看起来很小

当我用 iAd Producer 打开图像时，它们比我预期的要小。

iAd Producer 假设你正在导入用于视网膜显示屏的高分辨率图像，因此它将你的图像可见大小减半以适应这一点。你应该始终以你想要它们显示的水平和垂直分辨率的两倍导出你的图像。

例如，如果你有一个全屏图像，以 960px by 640px 导出它，这是 480px by 320px 标准屏幕尺寸的两倍。

你应该尽量保持源图像尽可能大，因为缩小图像很容易，但如果没有损失质量，则无法将其放大。

iAd 测试器没有显示任何广告

我的广告在无线共享时没有出现在 iAd Tester 中。

如果你无法在 iAd Tester 中看到你的广告，请确保你想要分享的项目已在 iAd Producer 中打开。只有打开的项目才会通过你的无线网络广播。如果你在 iAd Producer 中打开了项目，请确保它正在共享你的广告项目——你可以从菜单栏中的 iAd Producer 项打开本地共享。

如果 iAd Producer 确实正在广播你的开放项目，但你仍然无法在 iAd Tester 中看到你的电脑，请确保你的 iOS 设备和 Mac 连接到同一网络。

行动时间 — 检查你连接的网络

假设你的 Mac 无线连接到你的网络；如果它有有线连接，你需要确保你的 iOS 设备连接到同一接入点。

1. 在你的 Mac 上，点击菜单栏中的 Wi-Fi 图标以显示可用的网络。注意旁边有勾选的网络名称；这是当前连接的无线网络。

2. 在你的 iOS 设备上，打开设置；然后，从菜单中选择Wi-Fi项。现在这将显示一个类似的可用的网络列表。检查是否有勾选与你的 Mac 连接到同一网络的网络名称；如果没有，点击该网络名称以连接设备。你可能需要输入网络密码才能访问网络。在下面的屏幕截图中，你可以看到 iPhone 和 Mac 的设置：

发生了什么？

我们刚刚检查了我们的 Mac 和 iOS 设备连接到同一网络，这样 iAd Producer 和 iAd Tester 就可以成功连接到对方。

如果你仍然无法访问你的 iAds，你可能已经打开了 iAd Producer 中的身份验证设置；要么配对设备，要么从 iAd Producer 首选项中关闭身份验证。

分享演示

当你开发你的 iAd 时，你可能想与同事分享你的进度，以获取评论和建议。我们可以分享我们的 iAd 快照，录制快速屏幕演示，甚至与团队的其他成员共享正在进行的广告。

捕获屏幕截图

为了快速直观地展示我们的 iAd，我们可以截图其中一个屏幕。

行动时间 — 捕获屏幕截图

我们可以在 iOS 设备上或通过使用 Mac 的模拟器来截取屏幕截图。

1. 要在我们的 iOS 设备上截取屏幕截图，打开您想要捕获的屏幕，例如在 iAd Tester 中的广告页面。

2. 找到主屏幕按钮（屏幕底部中央的圆形按钮）和锁定按钮（用于关闭设备的顶部按钮），同时按下这两个按钮。您应该听到相机咔嚓一声，屏幕会短暂地变白。如果这没有发生，请再次尝试并确保您同时精确地按下它们。

3. 这会将整个屏幕图像的副本保存到您的相机胶卷中，您可以在 iOS 设备上的照片应用中找到它。打开您刚刚拍摄的图片，您可以通过电子邮件发送图片。

4. 如果您想在 Mac 上截取屏幕截图，请在 iOS 模拟器中打开您的 iAd。一旦您得到了想要分享的广告页面，按下键盘上的 Cmd + Shift + 4。现在您可以点击并拖动您想要捕获的屏幕区域，或者按下 空格键 并点击高亮的模拟器，这将只捕获该窗口。

   注意

   您也可以通过在键盘上按下 Cmd + Shift + 3 来截取整个屏幕的截图。

5. 您的截图将保存为 PNG 文件在您的桌面上。您可以通过将其拖动到电子邮件客户端来与同事分享。

刚才发生了什么？

您现在可以在您的 Mac 和 iOS 设备上截取屏幕截图。这些快捷键不仅限于 iAd Tester；您能够捕获您想要的任何屏幕或应用。

如果您需要展示您的 iAd 中的动画和交互，我们可以录制屏幕演示与您的团队分享。

录制屏幕演示

屏幕演示是记录 Mac 屏幕上动作的短片。如果您想要向没有访问 iAd Tester 或 iOS 设备的团队成员发送工作进度演示，屏幕演示非常有用。

行动时间 — 开机，摄像头，行动

目前还没有简单的方法来记录我们 iOS 设备的输出，因此我们将使用 iOS 模拟器和 QuickTime 来录制我们的 iAd。

1. 在 iOS 模拟器中打开您的广告，确保您的广告没有完全打开，这样只显示横幅。

2. 现在，从 应用程序 文件夹中打开 QuickTime Player。从菜单栏中选择 文件，然后选择 新建屏幕录制。

3. QuickTime 将会显示一个包含红色录制按钮的窗口。当您想要开始录制时，点击此按钮。以下截图显示了带有说明对话框的 开始录制 窗口：

4. 在录制之前，QuickTime 将会显示如何停止视频的说明；您可以使用菜单栏中的 停止录制 项或键盘快捷键 Cmd + Ctrl + Esc。

5. 点击 开始录制 并开始与您的 iAd 互动。一旦您获得了想要的素材，停止录制。

   注意

   使用键盘快捷键意味着你的视频不会以你试图找到停止按钮而结束！

6. QuickTime 现在将显示你的屏幕录制，准备播放。检查视频；如果你对它满意，请从菜单栏中选择文件，然后另存为..。如果你想再次尝试录制视频，请关闭此电影并开始新的屏幕录制。

刚才发生了什么？

使用 QuickTime，我们能够录制屏幕内容以制作演示视频并与我们的团队分享。QuickTime 创建的屏幕截图以.mov文件格式保存，采用 H.264 格式，应在大多数现代视频播放器中可播放，并在许多移动设备上可播放，例如基于 Android 和 iOS 的设备。

尝试英雄般的演示——创建一个演示

为什么不尝试与同事或朋友分享你的 iAd 录音呢？你可以：

• 录制你的 iAd 的每一屏并与元素互动

• 使用模拟器硬件控制来显示不同的方向和摇晃事件

• 在录制演示时，将 iOS 模拟器更改为标准、非视网膜设备，因为它会在模拟器外部提供一个更好的设备框架

• 将你的 Mac 背景设置为纯白色，以获得更专业的效果

• 下载 PhoneFinger，一个可以将鼠标光标替换为手的工具，以获得更真实的演示。它可以从wonderwarp.com免费下载

• 通过从 QuickTime 导出你的广告与你的团队分享

现在，你能够创建一个出色的 iAd 演示；你还可以使用这些技术来创建你完成 iAd 的促销材料。

分享一个广告

你可以将你的 iAd 与任何在其设备上安装了 iAd Tester 的人分享。使用 iAd Producer 导出优化的 iAd；压缩文件夹，就像你使用 iTunes 文件共享测试你的 iAd 一样，但不是将其复制到你的设备上，而是将.zip文件发送给你的团队。

摘要

我们现在能够以各种不同的方式测试和分享我们的广告，并知道在正确的时间使用最有用的技术。你现在可以：

• 使用 iOS 模拟器模拟你无法访问的设备和 iOS 版本

• 快速无线测试你的设备，以便离线使用

• 解决你可能遇到的一些常见问题

• 分享你的 iAd 的快照和视频演示

在下一章中，我们将探讨模板的高级使用，以提供丰富的功能，例如视频和壁纸选择器，以及动画和过渡效果，以增加我们广告的情感表达和响应能力*。

第五章. 模板和对象

我们已经使用了一些 iAd Producer 中可用的模板来构建我们的广告，但我们能做些什么来超越基本的模板设计和功能。

在本章中，我们将探讨何时使用哪个模板，以及我们如何能够使用对象来增强我们广告的功能，包括：

• 每个模板的功能

• 设置用户的壁纸

• 添加预播放视频

• 动画我们的对象

• 翻转我们的页面

模板

由于模板种类繁多，我们只需将媒体拖放到广告画布上，就可以简单地构建交互式广告。模板很有用，因为它们为用户提供了熟悉感；因为它们遵循苹果的标准，并且被网络上的其他广告使用。我们将查看 iAd 的每个部分可用的不同模板，然后制作一个基本广告，我们将使用模板并在以后用对象扩展它们。

如果您计划使用自己的资产，您将需要：

• 一个时长不超过 10 秒的预播放视频，以及用于创建它的相关媒体。此视频需要为 Wi-Fi 和蜂窝网络编码，以便在 iAd 中使用。

注意

在第二章中，我们探讨了使用QuickTime X的保存为网页功能来导出我们的视频以供 Wi-Fi 和蜂窝网络使用，以便我们的 iAd 可以根据用户的连接加载适当的电影。

• 一个用于横幅的图标，大约高度和宽度为 100px。

• 三个或更多用户可以将其设置为背景的全屏图像，宽度为 640px，高度为 960px。

• 一个大约高度和宽度为 640px 的大图像，用于优惠券页面，大约高度和宽度为 640px。

• 一个全屏、宽度为 640px、高度为 960px 的图像，将由用户从屏幕上擦除。

• 由三个或更多较小的、类似图标的图像组成的一个大图像，类似于以下屏幕截图所示：

从模板创建横幅

让我们设置一个新的项目，并使用图像和文本模板添加一个基本的图像横幅。

行动时间——创建横幅

为了创建横幅，请按照以下步骤操作：

1. 从您的应用程序文件夹中打开 iAd Producer，并选择一个 iPhone 项目。

2. 从菜单栏中选择文件 | 另存为，并为您的项目输入一个名称，例如咖啡豆。

   注意

   如果您正在使用此项目的示例文件，您可以在本书资产中包含的咖啡豆文件夹中找到它们。

3. 现在，通过将您的资产拖动到资产库面板中，将您的资产添加到项目中。示例资产可以在final文件夹中找到。如果您正在使用自己的资产，请确保优化您的图像并将您的视频转换为格式。

4. 在广告概览中双击横幅，以打开模板选择器。选择图像和文本横幅类型。现在，再次双击横幅以在编辑画布上打开它。

5. 将coffee-cup-small.jpg或您的横幅图标拖动到画布上的图像占位符。您将看到一个带有白色背景的咖啡杯出现。

6. 由于图像不是透明的，让我们更新横幅以匹配我们图像的白色背景。单击横幅的背景以取消选择图像，然后打开检查器面板。如果尚未展开，请展开背景部分，然后将背景类型更改为颜色填充并将颜色更改为白色。

7. 双击画布上标记为横幅信息的文本，开始编辑横幅文本，输入类似咖啡豆的内容。您的横幅应该看起来类似于以下截图：

8. 如果您没有定期保存项目，请确保单击保存。

刚才发生了什么？

使用我们在上一章中学到的技能，我们快速使用文本和图像模板制作了一个横幅，并用我们自己的图标和信息进行了定制。

探索其他横幅模板

图像和文本横幅类型具有很大的冲击力，同时仍然轻量级，并且可以快速出现在用户的设备上。如果您有一个强有力的信息或出色的文案，可以独立存在，那么简单的文本模板可以帮助您快速轻松地传达这些内容。图像模板提供了一个良好的起点，但默认情况下不应用任何动画或文本，因此在使用时不应进行任何修改。

每个模板选择器都提供了一个空白模板可供使用，您可以使用对象来构建完全定制的页面。

使用启动屏幕和预滚动视频

对于这个 iAd，我们将从我们的启动页面过渡到预滚动视频。我们将使启动页面看起来像视频的第一帧，以便它们在这两个页面之间平滑过渡。

行动时间 — 预滚动

我们将继续使用咖啡豆项目，并添加一段蒸汽咖啡的短视频：

1. 如果您还没有，请打开咖啡豆项目，或者如果您正在制作自己的广告，现在请打开它。

2. 预滚动视频与启动屏幕一起设置，因此在我们添加预滚动之前，我们需要添加一个占位符启动屏幕。双击广告概览中的启动，以打开模板选择器。选择马赛克模板。马赛克模板将画布上添加的图像切割成多个部分，这些部分将过渡到屏幕上。再次双击启动页面，以打开广告概览。

3. 打开资产库面板，将coffee-steam-video.jpg拖动到画布上。这是我们的预滚动视频的海报帧，可以在主视频加载时平滑过渡到广告。海报帧是我们视频的第一秒的快照图像，在将其转换为 QuickTime 时自动创建。

4. 在仍然处于闪屏编辑画布中时，将画布上方的切换按钮从闪屏切换到预滚动视频，如图所示：

5. 您现在应该看到一个灰色视频占位符，其中将放置预滚动视频。单击占位符以选择它。从底部栏打开检查器以编辑视频的设置。

6. 我们需要选择我们的预滚视频的视频文件和海报帧。确保检查器的属性部分已展开，然后在视频标题下单击选择视频。从文件列表中选择coffee-steam-video - iPhone.m4v（如果您使用的是自己的视频，请选择您的电影）；视频对象现在应该更新为黑色。

   注意

   如果您使用的是自己的视频，例如我们在第二章“为移动设备准备内容”中创建的视频，您需要将(Cellular)替换为-3G，用于视频的蜂窝文件。例如，视频文件video-name - iPhone (Cellular).3gp将重命名为video-name - iPhone-3G.3gp。这允许 iAd 为连接加载正确的视频。

7. 重复此步骤为海报帧，并选择coffee-steam-video.jpg。iAd Producer可能会假设您的海报帧是为视网膜显示屏设计的，并将其大小缩小 50%，尽管苹果公司建议仅支持视频的标准分辨率。如果您使用的是本书中包含的资产，这已经为您完成了。

8. 如果占位符只显示一半大小，我们可以使用预览来将图片分辨率加倍。切换到资产库，右键单击coffee-steam-video.jpg图片的海报帧，并选择在外部编辑器中打开，在预览中打开文件，如图所示：

9. 在预览中，从菜单栏选择工具 | 调整大小。我们想要加倍每个分辨率，所以输入640作为宽度；高度应该自动更改为960，以保持图片的比率。

10. 通过菜单栏选择文件 | 保存，或按键盘上的cmd + S来保存图片。关闭预览并返回到iAd Producer。

11. 我们需要通过在资产库中右键单击它并选择更新来更新资产。确认您想要更新资产，现在图片应该填满整个视频对象。如果它仍然只有一半大小，尝试在检查器面板中重新选择占位符帧。

    注意

    虽然将图片放大到更大的尺寸并不理想，因为会损失一些质量，但在我们过渡到标准质量视频时，这不会很明显。

12. 现在，切换回闪屏页面，使用画布上方的切换按钮。我们将更改图像的默认马赛克动画，这是我们在选择模板时自动选择的。

    注意

    不要忘记，无论何时您想查看效果的外观，您都需要在设备上、iOS 模拟器中或通过使用Safari来预览它。

13. 点击图片选择它，并打开检查器面板。如果它们还没有展开，请展开属性和效果部分。在效果部分，将内置效果更改为飞入，并将方向更改为拼图。内置效果是马赛克中的每个单元格如何在屏幕上出现，而方向是它们出现的顺序。我们还应该通过在持续时间区域选择2s来减少效果的总体持续时间。

14. 由于我们缩短了效果的时间，让我们也将图片分割成单元格的数量减少；这防止广告尝试太快地动画化太多项目。从属性部分，将行数更改为6，将列数更改为4。您的马赛克视图属性应该类似于以下截图：

15. 确保没有选择任何元素，并打开检查器面板。让我们将最小显示持续时间更改为2s，通过将滑块向左拖动，使其与我们的启动效果持续时间相匹配。这将防止我们添加的占位符帧显示时间超过所需。

16. 让我们还将启动画面的背景更改为深灰色或黑色，使用背景选项卡中的颜色选择器；这将真正让我们的启动效果更加闪耀。

17. 确保您已经定期保存您的 iAd。

18. 现在是预览您的广告的绝佳时机，无论是使用 Safari 模拟器，还是使用iAd Tester在您的设备上，有了启动效果和视频，它看起来将会非常棒！

刚才发生了什么？

我们使用了马赛克启动模板来显示海报图片，这是我们的视频的第一帧，然后过渡到我们的预加载视频。通过结合启动页面和预加载视频，我们让用户进入我们的 iAd 体验变得非常出色。

替代启动画面模板

由于启动页面是用户在您的核心内容加载时看到的内容，因此选择正确的模板并对其进行自定义以吸引用户并保持他们的注意力至关重要：

前面的截图显示了 iAd Producer 中可用的模板选择。

弹跳、坠落和旋转

每个这些模板都为我们提供了一个图像区域，以及一个多标签单元格，在核心广告单元加载时，它会在多个消息之间淡入淡出。

图片也是动态的，取决于我们选择了哪个模板。弹跳模板上下浮动；我们在第三章“制作您的 iAd”中使用它，让我们的恐龙看起来像是在飞翔。坠落模板的图片从屏幕顶部落下到合适的位置，而旋转模板在加载内容时像螺旋一样扭曲图片。

注意

要理解这些动画的最佳方式是观看它们。创建一个新项目并尝试这些不同类型很容易。默认情况下，iAd Producer 创建占位符图像和文本，因此您甚至不需要向项目中添加任何资产即可预览动画。

Bouncing、Drop和Rotating模板允许您通过将图像拖到屏幕上并编辑一些文本来创建轻量级和快速的启动页面。

Wave 模板

Wave模板使用一个小图标图像并将其重复以填充屏幕。然后，每个图标实例从小到大缩放，以创建水波般的效果。如果您有一个小而可识别的产品图像或标志，可以重复多次以创建醒目的启动屏幕，那么Wave模板效果很好。

尝试一下英雄

让我们看看 mosaic 模板的不同效果组合，并尝试其他启动模板和配置。为什么不尝试以下：

• 创建一个新的临时项目

• 使用Mosaic模板以及其他效果设置，例如Door Left用于Build In效果，以及Random用于Direction

• 向Wave模板添加图标并调整模式和间距

• 当使用Bouncing、Drop和Rotating启动模板时，查看应用到的不同图像动画

• 在您的 iOS 设备上预览效果及其性能

使用菜单模板

菜单页面提供了我们广告页面之间的核心导航；在 iAd Producer 中使用菜单模板创建的菜单会在我们修改、添加或从广告中删除页面时自动更新。

行动时间——制作菜单

让我们快速设置一种简单的导航我们的 iAd 的方法，使用菜单模板：

1. 我们将继续使用我们的coffee beans示例项目；如果它还没有在 iAd Producer 中打开，现在就打开它。

2. 在广告概览中，双击菜单页面以打开模板选择器。对于此页面，我们将使用简单的按钮模板。选择它，然后再次双击菜单页面，以在编辑画布上打开它。

3. 打开资产库并将coffee-bean-ribbon.jpg，或您的公司标志图像，拖到画布上的图像占位符。您应该看到图像出现在画布上；然而，它已经在角落被裁剪了。

4. 要修复此问题，选中图像后，打开检查器面板并展开布局部分。单击以下截图中的原始大小按钮，图像容器将自动调整到正确的尺寸，以显示整个图像：

5. 这张图片是 JPG 格式，所以它不支持透明度。这意味着我们需要确保页面的背景与图片的白色相匹配，并且没有其他元素在其后面重叠，否则它们将被隐藏。点击画布背景，并在检查器面板的背景部分使用颜色填充选项将背景更改为白色。

6. 与纯白色背景相比，按钮看起来有点无聊。让我们通过调整它们的背景颜色、添加阴影和移除边框来重新设计它们。

7. 点击按钮对象以选择它，然后打开检查器面板。找到背景部分，并为按钮选择一个渐变背景。例如，选择线性渐变的两色，例如，雪和银。

   注意

   记住，当在按钮上使用渐变时，渐变应从顶部轻柔到底部深色。这将使按钮看起来更像一个物理的、可按压的对象，因为它会从其他对象中突出出来。

8. 展开阴影部分，勾选复选框以启用阴影。尝试将距离减少到0px，这意味着阴影在按钮的每个边缘都可见。

9. 现在我们已经在按钮的外围添加了阴影，让我们通过在对象的检查器中的边框部分禁用复选框来移除边框。

   以下截图显示了边框属性已禁用，以及到目前为止我们的菜单的整体外观：

   

10. 保存您的 iAd。

刚才发生了什么？

我们在我们的 iAd 中添加了一个按钮菜单页面，这样我们的用户就可以在广告的页面之间导航。通过将模板作为指南并修改它以匹配我们品牌的风格，我们的菜单页面看起来独特，但对我们用户来说感觉熟悉。

尝试可用的菜单模板

每个非空菜单模板都提供相同的功能，只是有一些额外的对象和变化。例如，隐藏-显示菜单类型类似于我们刚刚添加到我们的“咖啡豆”广告中的按钮模板，但它将按钮组合到一个容器中，当你在页面之间移动时，这个容器会动画进入和退出屏幕。擦除清除菜单模板将您的菜单隐藏在用户必须擦除以显示的图片后面。在这里，您可以看到模板选择器中可用的模板：

iAd Producer 提供了一组有限的菜单模板，但非空模板提供的最有用的对象是用于打开我们的子页面的按钮集。当您更改广告的结构时，按钮会自动更新。尽管 iAd Producer 提供了空白模板，但请考虑使用其他模板，并删除您不需要的项目。这样，您仍然会有一个在您修改广告时更新的菜单。

快速问答——菜单

看看您是否能回答关于菜单模板的问题：

1. 如果你想创建一个带有导航的空白菜单模板，你应该怎么做？

   • a. 使用空白模板

   • b. 使用按钮对象创建自己的菜单

   • c. 我们不需要设置模板；iAd Producer 将自动创建菜单

   • d. 使用非空白模板之一，并删除我们不需要的项目

现在我们已经让用户进入我们的广告，并且有方法在广告中导航，让我们添加一些内容供他们与之交互。

创建更多页面

苹果为我们 iAd 的页面提供了一系列模板，可以适应我们的需求并创建令人惊叹的交互式广告。使用页面模板，您可以快速构建 iAd 的基础。

行动时间 — 页面

让我们创建一个壁纸选择页面和两个空白模板页面，我们将稍后使用它们从头开始创建自己的视图，使用对象：

1. 让我们在我们的咖啡豆iAd 中添加一些页面。如果你还没有在iAd Producer中打开它，现在就打开。

2. 首先，让我们设置我们的两个空白模板。双击广告概览中的第一个页面以打开模板选择器。有两个空白模板可供选择，要么是纵向要么是横向；我们想要一个纵向页面，所以选择两个中较高的、较窄的那个。对下一个页面重复此步骤。

3. 现在，双击第三个页面，并在模板选择器中选择壁纸选择器。再次双击壁纸页面，以在画布上打开它。

4. 壁纸选择器模板需要一张或更多图片，它将在画廊中显示。用户可以浏览这些图片，并将他们喜欢的设置为设备上的背景。让我们为壁纸选择器添加三张图片。打开资产库面板，并突出显示三张图片文件wallpaper-1.jpg - wallpaper-3.jpg。要选择多个项目，单击第一个文件，然后按住shift键单击最后一个文件。将突出显示的组拖动到画布上的占位符图片上。

5. 第一张图片应该出现在画布上。现在我们已经添加了图片，我们可以更新页面的样式以改善其外观。图片在黑色背景上看起来很棒，所以我们将更新页面的背景颜色为黑色。

6. 单击广告的背景，并打开检查器面板。在背景部分，将背景类型设置为颜色填充并将颜色设置为黑色。

7. 由于我们有了新的黑色背景，页面的标题难以阅读；由于我们在按钮中有设置为壁纸的文本，我们可以安全地删除标签，而不会让用户对页面的目的感到困惑。单击带有文本壁纸选择器的标签，并按删除或退格键将其从画布上删除。

8. 由于我们现在有额外的屏幕空间可用，让我们在壁纸选择画廊中放大图片的大小。单击画廊以选择它，然后点击并拖动页面的顶部中心拖动手柄到页面顶部。你可能注意到，左右拖动手柄已经达到页面的全宽度，尽管我们的图片相当薄。这是由于iAd Producer为我们添加了填充。填充通过在其周围添加空空间来增加对象占据的区域。我们可以调整填充；在对象仍然被选中时，打开检查器面板并展开布局部分。在布局部分，我们可以更改填充 X，水平（或左和右）填充，以及填充 Y，垂直（或顶部和底部）填充。我们只想调整宽度，所以尝试将填充 X减少到更小的值，例如，75。

   小贴士

   请记住，在我们的 iAd 的左上角始终有一个可见的按钮，让用户关闭广告。这应该在 iAd Producer 中可见，因此请避免在其附近放置对象，并且永远不要将可点击的交互式按钮放置在其附近，以防用户关闭你的广告而不是执行他们打算执行的操作。

9. 一旦你对图片的大小满意，让我们继续调整我们的画廊。iPhone 应用程序通常在可翻页区域下方使用分页点，以显示你所在的页面，并指示更多页面是否可见。你可能已经在你的 iPhone 或 iPad 的主屏幕上注意到它们，在那里显示所有你的应用程序。我们可以在检查器面板的属性部分勾选显示点复选框，将这些建议添加到我们的画廊中。你可能需要调整画廊的高度以容纳这些建议。我们的完整画廊应该看起来像以下截图：

10. 现在，在 iOS 模拟器或设备上预览广告。你可能注意到，你无法从画廊返回到菜单，因为菜单按钮似乎无响应。这是由于 iAd 框架将我们的画廊放置在按钮上方，即使在 iAd Producer 中看起来不是这样。我们可以通过右键单击按钮并选择置于顶层来确保按钮始终位于其他对象之上，如图所示：

11. 再次测试你的 iAd，你应该能够从壁纸选择页面返回到菜单。

12. 现在，通过点击iAd Producer左上角的概览导航箭头打开广告概览。你现在可以看到我们的广告结构正在形成，但如果我们想改变页面出现的顺序怎么办？在广告概览中，我们可以点击并拖动我们的 iAd 页面，以调整它们在广告中的显示方式。尝试将壁纸选择页面从最后一页拖动到中间。你的广告中的菜单模板将自动更新以显示你页面的新顺序。

    小贴士

    记住，你只能更改 iAd 中页面的顺序，而不能更改横幅、启动画面或菜单/核心广告单元的顺序。你的广告必须遵循苹果定义的该流程。

13. 在我们完成页面之前，我们可以重命名空白模板，以便我们稍后用对象构建。继续停留在广告概览中，单击第一个页面以选择它。在检查器的属性部分，将名称更改为Bean Blender。对最后一个空白页面重复此操作，并将其命名为Steamy Savings。

刚才发生了什么？

我们使用了壁纸选择器模板，通过提供出色的背景，在用户的设备上留下持久的印象。每次用户查看他们的设备时，都会提醒他们你的广告体验和品牌。

突出显示显著的页面模板

可用的页面模板种类繁多；以下是从模板选择器中选取的一些最佳和最有用的模板，如下截图所示：

与图像交互：封面流

就像 iTunes 封面流，用户可以翻动他们的专辑图像的 3D 画廊，我们也可以将一组图像从资产库拖动到封面流模板中。在这里，你可以看到聚焦于中心项目的封面流画廊：

使用 3D 画廊：网格视图

网格视图为画廊增添了一个惊人的转折。它自动创建你的图像的小缩略图，当点击时，会旋转以显示全尺寸图像。这种视图看起来很棒；如果你在使用它，确保在检查器中调整行和列设置，以匹配你的画廊中的图像数量。

使用：翻转视图揭示信息

翻转视图为你提供了一个大图像区域，该图像以 3D 方式旋转以显示其背面。你可以在图像的背面添加自定义对象；这通常用于显示更多信息，例如产品价格详情。

尝试一下英雄

为什么不创建另一个 iAd 项目来尝试不同的页面模板呢？你可以：

• 使用本书中的示例图像或你自己的图像来尝试不同的画廊。特别注意网格视图和封面流模板，因为它们可以产生一些相当出色的画廊。

• 将一张大图添加到平移查看模板中，该模板允许用户翻动图像的特写并调整页面上的样式。这对于风景、景观图像或产品的特写视图非常适用。

• 在不同的设备上测试一些模板，看看它们如何影响性能。

我们已经看到了 iAd Producer 中大部分可用的页面模板。现在，让我们来看看如何在我们的模板中设置样式。

创建更高级的样式

iAd Producer 拥有强大的编辑工具，可以使你的广告制作更简单、更一致，并为用户提供更好的体验。让我们看看如何创建样式预设和创建高级按钮状态。

使用样式预设

很可能你会在整个 iAd 中使用相同的样式以保持一致且难忘的体验。iAd Producer 允许你将某些样式组合保存为预设，以便在广告中使用。

行动时间 — 你的样式在哪里？

使用 iAd Producer 的样式预设来跟踪和在我们的每个广告中应用常用样式非常简单：

1. 在iAd Producer中，打开包含在“书资产”文件夹中的Styles Demo示例项目。

2. 从广告概览中，你应该看到这个广告有两个页面；第一页有一些时尚的样式文本，而第二页上有一些无聊的默认文本。我们将复制第一页的样式并将其应用到第二页。双击第一页以在画布上打开它。

3. 单击文本区域以选择它；然后，如果尚未打开，打开检查器面板。在样式标题下，有一个带有自定义字样的下拉文本框；点击其右侧的齿轮图标，然后选择另存为...，以保存新的样式预设。

4. iAd Producer 显示哪些属性将包含在样式中。让我们不包含透明度在这个样式预设中，通过取消透明度旁边的勾选。不同的样式取决于你正在编辑的对象，所以请确保你注意到了哪些属性被包含。

5. 我们还希望给样式起一个难忘的名称，这样我们就可以在多个预设中知道哪个是哪个。在名称文本框中输入一些描述性的内容，例如框内大文本。点击确定，以保存样式。以下截图显示了可用的属性：

6. 自定义下拉文本框现在应该更新以匹配样式的名称。回到概览，打开第二页的未设置样式的文本；你应该会看到一些普通的默认文本，填充了整个页面。

7. 通过单击选择普通文本标签。从检查器面板中，点击样式下的下拉区域，并从列表中选择你想要应用的样式，例如框内大文本。我们保存的样式应该被应用，以便文本与第一个视图中的文本相匹配。

   小贴士

   记住，只有我们选中的并保存到预设中的样式才会被应用。

8. 尝试调整样式属性之一，例如，在检查器中展开文本部分，并将背景颜色更改为红色。样式下拉菜单将更新以显示样式已被修改。点击旁边的齿轮图标，然后选择保存以更新样式，如图所示：

9. 现在应用样式的每个对象都将更新以匹配新的样式；您可以通过回到广告的第一页来检查。您的文本现在应该是红色的。您还可以通过选择另存为选项而不是保存来复制一个样式。

刚才发生了什么？

使用 iAd Producer 内置的样式预设功能，我们能够确保广告中的样式保持一致。使用样式与我们的对象意味着我们可以在编辑样式时一次性更新多个对象。

样式被保存，并且每个 iAd Producer 项目都是唯一的，因此您无法在不同广告之间传输它们，但您可以为每个项目保存所需的所有样式。

改变状态

可点击的对象，如按钮，可以根据它们的状态应用不同的样式。状态根据对象之间的交互而改变；按钮可以是正常的（这通常是它的外观），高亮的（当用户按下或点击按钮时），以及禁用的（当按钮可见但不会响应用户交互时）。

我们可以使用 iAd Producer 中的样式编辑器来修改每个状态的按钮样式。改变按钮状态可以增加广告的响应性，因为当用户与您的 iAd 互动时，他们会立即获得反馈。

行动时间——状态的重要性！

让我们调整“咖啡豆”示例项目中的菜单按钮状态：

1. 如果您还没有做，请打开我们一直在工作的“咖啡豆”项目。双击菜单页面以在画布上打开它。

2. 单击菜单对象以选择它，然后打开检查器并找到设置标题。在标题下方，样式下拉菜单旁边是状态选择器，它允许您在编辑正常、高亮和禁用状态之间切换。当您选择不同的状态时，您应用的所有样式将仅在按钮处于该状态时出现。您可以在以下屏幕截图中看到状态选择器：

3. 将选择器更改为高亮；此按钮状态应使用正常线性渐变的反转或反转版本。展开背景部分，并选择与正常状态相同的渐变。如果您使用示例颜色，请使用从雪到银的渐变，使用蜡笔选择器。

4. 现在，我们可以通过按下位于渐变类型下拉菜单旁边的渐变反转按钮来反转渐变的方向，这在以下屏幕截图中被突出显示。这仅仅是切换颜色顺序。反转渐变会给按钮带来一种按下或推入的感觉：

   小贴士

   iAd Producer 有时不会更新画布以显示你的更改；如果发生这种情况，你应该保存、关闭，然后重新打开你的项目。如果你仍然看不到更改，请使用 iOS 模拟器或设备来测试你的按钮状态。

5. 现在，将状态选择器更改为禁用。由于禁用按钮在被点击时不会执行任何操作，它们应该感觉平坦，并使用较浅的颜色以显得褪色；实现这一点最简单的方法是降低我们禁用按钮状态的透明度。

6. 展开透明度样式部分，并将透明度滑块拖动到大约 40%。降低透明度使按钮略微透明，褪色颜色，并稍微显示背景在其后面。禁用样式通常不会被我们的 iAd 用户看到，因为禁用按钮的唯一方法是使用 JavaScript 代码。所以，只有当你知道你将使用它时，你才需要设置它。

7. 最后，保存你的 iAd 并在设备上测试它。当你与按钮交互时，你应该能感觉到状态的效果。

刚才发生了什么？

我们刚刚使用状态选择器来更改按钮在被高亮或禁用时的外观。我们还学习了应该应用到每个状态上的样式，以及为什么这种样式是合适的。

如果你使用 iAd Producer 提供的默认样式来设置按钮，它将自动应用正常、高亮和禁用按钮的正确状态。

突击测验 — 样式和状态

尝试回答这些问题：使用按钮状态和样式预设

1. 在创建样式预设时，你如何知道保存了哪些样式？

   • a. 只保存你修改过的样式

   • b. 所有样式都已被保存

   • c. 背景和文字颜色是唯一保存的样式

   • d. 保存样式时将显示一个清单

2. 每次你保存一个样式预设时，都会显示一个可编辑的清单，列出将随预设存储的样式。你应该如何为高亮或触摸的按钮应用样式？

   • a. 线性渐变，与正常状态相同但相反

   • b. 使用与正常按钮状态相同的颜色的径向渐变

   • c. 单一的深色

   • d. 我们不需要为高亮状态设置样式，因为它从未被使用

3. 你应该反转正常按钮的渐变以创建一个凹陷的、按下的感觉，模仿真实的按钮。在正常或默认状态下，应该应用什么颜色到按钮上？

   • a. 单一的光亮颜色

   • b. 从顶部浅色到底部深色的线性渐变

   • c. 从中间的深色到边缘的浅色的径向渐变

   • d. 从顶部深色到底部浅色的线性渐变

使用对象超越模板

我们可以通过选择空白模板来构建自己的页面，或者使用模板作为起点，并使用对象在此基础上构建。让我们利用到目前为止所创建的内容来丰富我们的 iAd。

行动时间 — 添加对象

我们将把到目前为止构建的Coffee Beans示例添加到其中，通过创建两个自定义页面，使用我们在创建项目时之前选择的空白模板。要添加对象，请按照以下步骤操作：

1. 打开我们一直在工作的Coffee Beans广告的 iAd 项目。从Overview打开画布上的第一个空白页面：它应该被命名为Bean Blender。你应该看到一个空白页面，有一个菜单按钮，准备好添加我们的自定义对象。在我们开始之前，将页面的背景设置为纯Color Fill白色，以便它与菜单页面相匹配。

2. 我们将制作一个页面，在摇动之间切换，显示有关咖啡豆的不同事实。点击 iAd Producer 底部的Objects按钮，打开对象库。

   注意

   已经有一个我们可以使用的可摇动视图模板！然而，我们将自己构建这个页面，以展示大多数模板实际上只是使用你可用对象构建的。

3. 从对象库中，点击Shake View，然后将在画布上添加一个占位符摇视图。默认情况下，Shake View假设你想要在图像库之间摇动，但是，我们将从每个单元格中删除占位符图片，并添加我们自己的对象到视图中。

4. 双击Shake View以打开单元格编辑模式；页面上的其余部分将变暗以指示更改，如以下截图所示：

5. 现在，单击占位符图片，然后按键盘上的delete或backspace键。我们需要对视图中的每个单元格重复此操作，使用单元格导航箭头在单元格之间切换，并删除占位符，直到你删除了所有占位符。你可以使用Cmd + 左箭头或右箭头通过键盘在单元格之间导航。

6. 删除占位符图片后，我们应该调整我们的Shake View大小，点击单元格外部以退出编辑模式，然后通过单击重新选择Shake View。现在点击并向上拖动顶部中间的拖动手柄，使其刚好位于关闭按钮下方。

7. 我们将把自定义对象添加到Shake View中；确保你处于第一个单元格，通过双击Shake View进入编辑模式，并使用单元格导航箭头更改单元格，直到页面指示器显示1 of 4 Cells。打开Objects页面，点击Label；这将向Shake View添加一个占位符标签。将标签文本更改为Unroasted Beans；你需要调整文本区域的大小，以确保整个文本可见且在一行内。现在，将标签重新定位到摇视图的左上角，并拖动标签使其占据视图的全宽；这将确保其正确对齐。让我们更新文本样式为粗体，对齐方式为左对齐，使用检查器面板的Text部分。

8. 让我们添加第二个标签；再次，点击对象，然后选择标签。更新文本为未烘焙的咖啡豆是绿色的，来自咖啡树的种子，并将字体大小减少到大约17。将标签重新定位在Shake View的底部，并将其调整大小以填充整个宽度。

9. 在仍然处于单元格编辑模式时，点击对象|图像，向单元格添加图像。从资产库中，将图像beans-1-un-roasted.jpg拖动到我们刚刚添加到画布上的图像对象。单击图像以选择它，然后打开检查器上的度量部分。按原始大小按钮将图像对象调整大小以适应其中的图像。考虑对图像进行样式设计，可能使用深灰色边框和阴影。

10. 当你对图像的风格满意时，从对象库中添加一个图像到画布上。将画布上的图像大小调整为 65px 宽和 50px 高；你可以使用布局部分在检查器中设置确切的大小值。将图像对象重新定位在单元格的右上角；使用出现的黄色标尺来引导你。

11. 从资产库中，将图像coffee-grades-sprite.jpg拖动到占位符图像对象上。你应该看到两个咖啡豆出现；然而，如果你看一下源图像，你会发现它实际上是一串几个咖啡豆。我们将使用一种称为CSS 精灵的技术；使用精灵，我们将几个我们想要使用的单独图像组合成一个大的图像。

    然后，我们只显示我们当时想要的图像部分。将图像合并成一个可以减少加载时间，因为您广告中包含的每个文件都会增加对 iAd 网络的请求。我们可以将图像精灵定位在图像对象内部，只显示我们想要的区域。双击图像对象，精灵的隐藏区域将变为可见，尽管稍微亮一些，以显示哪些部分是可见的和隐藏的：

12. 点击并拖动精灵，将其移动，以便仅显示最左侧的绿色未烘焙豆。一旦你满意，精灵和单元格看起来类似于以下截图。我们将继续添加剩余的单元格到我们的Shake View：

13. 我们Shake View的每个单元格都将具有相同的结构，只是文本和图像不同。我们可以从单元格复制对象并将其粘贴到下一个单元格中；这样可以节省时间并保持每个单元格与上一个单元格的一致性。

    注意

    在 iAd 中保持一致性很重要，尤其是在在两个视图或单元格之间转换时，如在Shake View中。

14. 我们想要选择单元格中的所有对象；要做到这一点，在键盘上按住cmd键，然后点击你想要选择的对象。一旦你选择了所有对象，在这个例子中，四个对象，右键点击其中一个对象并从菜单中选择复制，或者按cmd + C，在键盘上。现在，使用单元格导航箭头切换到第 2 个单元格（共 4 个）。在单元格内任何位置右键点击并从菜单中选择粘贴，或者使用cmd + V，在键盘上。我们在单元格 1中选择的对象现在应该出现在单元格 2中。首先，更新单元格顶部的标题标签为Lightly Roasted，并将底部标签文本更新为After several minutes the beans "pop" or "crack" and visibly expand in size。从资产库中拖动图像beans-2-light-roast.jpg到单元格中的主图像。最后，调整图像精灵的位置，以显示当前绿色豆子右侧的两个较深的豆子。

15. 对最后一行重复此操作，然后复制并粘贴你需要用到的对象。接着，将标题标签设置为Dark Roast，将底部标签文本设置为After a few more minutes the beans begin popping again, oils rise to the surface. This is called second crack。更新主图像为beans-3-full-roast.jpg，并将图像精灵移动到下一个两个豆子上。

16. 我们还剩一个空单元格；使用单元格导航箭头切换到它，然后点击箭头右侧的齿轮图标。选择删除单元格，因为我们只需要前三个。

    小贴士

    当制作一个需要交互且不是立即显而易见的页面时，你应该添加屏幕提示来帮助用户。考虑在这个页面上添加一个Shake to change标签，这样用户就知道该做什么。

17. 在设备上测试你的广告；如果你注意到单元格之间的过渡可能会卡住，考虑移除图像上的阴影以增加性能。

刚发生了什么？

你刚刚通过向空白模板添加对象从头开始构建了一个整个页面。使用Shake View对象，我们使页面变得交互式，用户可以通过摇晃来浏览我们复制粘贴的不同单元格（以节省时间和保持用户摇晃体验的一致性）。

我们使用了一个图像精灵，将几个图像组合成一个大图像，并只显示我们想要显示的部分。图像精灵是一种起源于早期视频游戏的技术，它减少了 iAd 网络的请求，因此我们的广告加载得更快。

尝试一下英雄

为什么不通过以下方式改进你的Bean Blender页面：

• 在Shake视图对象中添加一个关于双倍烘焙咖啡的额外单元格（见烘焙风味，在en.wikipedia.org/wiki/Coffee_roasting）。

• 为每个项目创建一个样式预设，这样你就可以更新一个单元格的样式，其他单元格将匹配它。

行动时间——更多对象

我们画布上仍然有一页空白；让我们添加一页充满蒸汽的页面，用户必须擦干净才能揭示促销优惠：

1. 我们将继续使用我们的Coffee Beans示例项目，所以如果你还没有做，请在 iAd Producer 中打开它。从概览中打开最后一个空白页面，标题为Steamy Savings。使用颜色填充选项将背景设置为纯白色。

2. 打开对象库，并将Wipe Clear对象添加到画布上。Wipe Clear对象显示一个图像，当用户用手指擦除时，图像会消失。将Asset Library中的图像steam-mirror.jpg拖动到Wipe Clear对象上。你会看到对象被图像填充；使用检查器中的布局部分的原始大小选项调整Wipe Clear对象的大小。现在图像应该填满屏幕。在设备或 iOS 模拟器上测试页面；你可以擦除或摩擦屏幕以移除图像的一部分。

3. 你可能已经注意到，在你有机会擦除所有图像之前，你的广告已经自动淡出了图像。这样做是为了让那些没有与你的页面互动的用户仍然可以获取内容。不过，让我们调整这个设置，让我们的内容在屏幕上停留更长一点。

4. 打开检查器的属性部分，将淡入延迟设置为7.5 秒和10 秒之间，并将持续时间设置为3 秒。淡入延迟是指 iAd 开始淡出广告之前需要多长时间，如果用户没有清除所有内容，持续时间是指淡出动画持续的时间。

5. 你的属性应该看起来类似于以下截图：

6. 我们还可以调整Wipe Clear对象的透明度，使得页面内容可以通过蒸汽略微看到。在检查器中，展开不透明度部分，并使用滑块将数量减少到大约90%。

7. 让我们添加在Wipe Clear淡出后才会显示的对象。目前，Wipe Clear对象填满了整个页面，所以我们无法访问画布。将整个对象从画布上拖动到左侧或右侧。iAd Producer 会淡出对象以显示它不包括在内，如以下截图所示。一旦我们添加了元素，我们将重新定位它：

8. 在画布上移除Wipe Clear对象后，从对象库中添加一个标签到页面上。将标签放置在广告的顶部中央，并将文本更新为Steamy Savings。接下来，我们将在页面上添加一个图像，但不是使用图像对象，而是将Asset Library中的图像coffee-cup-large.jpg直接拖动到画布上的一个空白区域。图像应该会自动生成一个图像对象出现在那里。将咖啡杯放置在屏幕中央。

9. 现在，将一个Multi-Label对象添加到画布上，并为每个单元格添加一个优惠码，例如，为cell 1添加#HALFOFF - 50% off，为cell 2添加#EXTRA - double serving，为最后一个单元格添加#SAMPLE - free expresso。在多标签上方添加一个带有文本Voucher codes:的标签，以便用户知道它们是什么。此外，在屏幕底部添加一些小文字，说明如何使用这些代码，例如在店内出示优惠码。

10. 设计和定位元素，使你的页面看起来类似于以下截图：

    小贴士

    当在支持的对象上的单元格编辑模式下时，你可以使用Apply Style to All Cells按钮快速将你的单元格样式复制到其他单元格。

11. 当你对页面的布局满意时，通过点击并拖动将Wipe Clear对象重新定位到画布上。你可能会发现一些对象覆盖在Wipe Clear对象之上；如果发生这种情况，右键点击Wipe Clear对象并选择Bring to Front。这将确保该对象是屏幕上的最前元素。

12. 保存并在设备或模拟器上测试你的广告。

刚才发生了什么？

我们现在已经完成了我们的咖啡豆iAd 的主结构；它侧重于提供更多关于咖啡的信息和趣味性，然后提供一个用户机会，在Steamy Savings页面上通过优惠来行动他们的新兴趣。一些最好的广告并不是在每个机会都推销他们的产品和品牌，而是微妙地赢得用户的兴趣。

调整过渡

过渡用于在广告的页面之间进行动画处理；你可以为每个页面设置出现和消失的动画，以在页面打开和关闭时添加一些运动和效果。

行动时间——过渡

让我们通过改变过渡来改善我们的咖啡豆广告的感觉，使用户能够顺畅地浏览我们的内容和页面：

1. 在 iAd Producer 中打开项目咖啡豆。

2. 默认情况下，iAd Producer 为每个页面添加淡入和淡出过渡，淡出第一页并淡入第二页。这导致我们的启动页面和预览视频之间出现闪烁，因为我们使这些页面匹配相同的内容。让我们删除这两个过渡，以便在启动页面和预览视频之间实现无缝切换。双击Overview中的Splash页面，在编辑画布上打开它。

3. 确保顶部页面的切换设置为Splash，并从底部栏的右侧展开检查器面板。我们仍然希望我们的Splash页面在出现时淡入，但不想在页面消失和预览视频开始时有任何过渡。

4. 展开Transitions部分，并确保过渡设置为Fade In。现在，将切换到Preroll Video并将过渡设置为None：

5. 预览你的广告，你应该注意到改进；事情将会更加顺畅！

6. 返回广告概览，并确保检查面板仍然打开。我们可以快速更改广告的概览页面过渡。单击菜单页面以选择，但不要打开它。然后，在过渡部分，选择向左滑动。为每个页面重复此操作，选择你选择的过渡效果。

7. 保存你的广告，并在设备或 iOS 模拟器上预览不同的过渡效果。

刚才发生了什么？

我们将溅屏和预览视频之间的过渡改为主广告单元，以在广告的不同部分之间创建无缝的流程。

添加一些动画

我们页面上的每个对象也可以有出现和消失的动画，类似于全页过渡。给我们的广告添加动作，可以吸引人们的注意力，并使体验更加吸引人。

动作时间 - 动画

我们将在咖啡豆项目中添加一些动画，这些动画将使我们的对象在其页面上移动：

1. 在iAd Producer中打开咖啡豆项目。双击菜单页面以在画布上打开它。点击菜单对象，并展开动作面板。

2. 我们希望当页面加载时，菜单从屏幕底部滑入，当它关闭时滑出。确保面板的标题为页面出现，并点击+图标以打开可用的动作列表。

3. 从动作列表中找到并选择滑入。这将添加动作；将方向更改为从底部进入。请再次确认你的动作属性与以下内容匹配：

   注意

   如果可用的动作列表中没有包含在动画下列出的任何内容，请确保你已经选择了菜单。

4. 我们可以通过修改持续时间、延迟和计时来调整动画。持续时间为0.75 秒通常效果不错；尝试调整并预览动画。计时选项会改变动画的行为，例如，默认的缓动进出选项将开始缓慢并逐渐减速，而线性选项则从开始到结束以恒定速度移动。

   注意

   当为关键对象设置动画持续时间，例如菜单或文本时，尽量保持它们在 1 秒以下。较长的动画会让你的广告感觉缓慢且不灵敏。

5. 点击动作面板标题中的页面出现，并将其更改为页面消失。这将允许我们设置页面即将消失时的动作。添加滑出动作，并将方向更改为底部。你可以使用播放三角形图标来预览动画。

   注意

   将页面的消失动作与出现动作相匹配是很好的。因此，如果一个对象在出现时从底部滑入，那么在消失时也应该滑出到底部。

6. 由于我们的菜单是从屏幕底部出现的，让我们让我们的主图像从屏幕顶部进入和退出。对于图像，重复前面的步骤，但将方向属性更改为顶部用于页面出现，以及顶部用于页面消失。

7. 保存并预览你的广告。你可能想要向广告的其他页面上的对象添加一些动作。

刚才发生了什么？

我们使用动作和动画来构建页面的组件，并在用户在广告中导航时增强页面过渡。

突击测验 — 动画和过渡

通过回答以下关于动画和过渡的问题来测试你到目前为止所学的内容：

1. 为什么你可能想要防止你的启动页面和预告片视频之间的过渡？

   • a. 为了使你的内容加载更快

   • b. 为了防止它们之间出现闪烁

   • c. 这将防止我们的广告使用过多的电池电量

   • d. 过渡可以在视频中复制

2. 页面消失动作何时开始？

   • a. 当广告立即打开时

   • b. 在广告关闭之前

   • c. 在页面消失过渡之前

   • d. 在页面消失过渡之后

收尾工作

为了使你的 iAd 更加特别，我们可以修整一些粗糙的边缘，以制作出最精致、最吸引人的广告。这些最后的调整在使用你的 iAd 时非常明显。

尝试英雄式操作 — 已润色

让我们尝试修复Coffee Beans项目的最后几个问题；考虑尝试以下建议：

• 使所有菜单项在每个页面上匹配（使用样式预设）

• 更新预告片中的跳过视频按钮，使其看起来很棒；不要忘记修改其状态

• 尝试在核心广告页面之间使用不同的过渡效果

• 在Wipe Clear对象上方放置一条消息，告诉用户要擦除屏幕

• 通过向空白横幅模板添加对象来创建一个新的横幅

• 向其他页面上的元素添加动画

• 检查横幅是否在两种方向上都工作

如果你需要一些灵感来润色你的 iAd，请查看assets文件夹中完成的Coffee Beans项目。

摘要

在本章中，我们专注于使用模板和对象来创建定制、独特的 iAds；有了这些基本技能，你能够快速构建高级广告。你现在知道以下内容：

• 如何将预告片视频添加到广告中

• 可用的模板有哪些

• 如何使用对象在模板上构建

• 如何使用空白模板从头开始创建页面

• 通过使用精灵可以优化小图像的加载时间

• 如何在广告的页面之间进行过渡

• 对象可以在画布上和画布外通过动作进行动画处理

记住，你可以将模板作为你页面的基础，然后通过添加对象来定制和增强它们。在下一章中，我们将探讨如何通过在我们广告内创建有价值的行动和目的地来利用客户对我们品牌的喜爱。

第六章。广告目的地和操作

在创建了一个令人兴奋的广告，让用户对我们的产品或品牌感到兴奋之后，我们需要引导他们执行对我们有益的操作。

在本章中，我们将探讨：

• 为什么我们不应该直接将用户重定向到我们的网站

• 销售我们的数字内容，如应用程序和音乐

• 将我们的商店查找器提升到下一个水平

• 优化我们的广告结构

• 使用短信文本消息与我们的品牌进行社交互动

打开外部网站

移动设备上的传统广告通常由横幅组成，点击横幅会将用户带到他们的移动浏览器，并经常加载一个完整且杂乱的桌面网站。创建一个 iAd 则不同，因为您有一个完整的框架来构建一个微型应用程序，所有这些都在主应用程序内。使用 iAd 框架和 iAd Producer，您可以在我们的 iAd 中创建相同甚至更好的集成体验。

将您的 iAd 视为一个您绝对不希望用户离开的微型网站。让我们探讨我们可以在 iAd 内实现的目的地和用户操作，避免将用户带到您的主站。

销售数字产品

我们可以直接在我们的 iAd 中销售数字产品，如歌曲、电影或应用程序，而无需用户离开他们所在的广告或应用程序。只要您的项目在 iTunes 商店有售，它们就可以包含在 iAd 中。

注意

当用户从您的广告中下载数字内容时，您将获得与直接从商店购买相同的收入。

执行动作 — 从我们的广告中下载应用程序

在 iAd Producer 中使用购买模板，我们将为上瘾的免费应用程序Bouncing Balls添加一个购买页面。

我们将继续使用我们在上一章中工作的Coffee Beans项目。在 iAd Producer 中打开它。

1. 让我们添加一个额外的页面作为我们的购买页面。从广告概览中，点击显示菜单和页面之间关系的线条上的加号图标，如以下截图所示：

2. 双击新创建的页面，标记为页面 4，以打开模板选择器。选择购买模板，然后再次双击页面以在编辑画布上打开它。您将看到一个占位符产品页面，类似于在 iOS 应用商店中看到的页面。

3. 如果检查器面板尚未打开，请打开它，然后在画布上的任何位置单击以选择由模板自动添加到页面的商店视图对象。展开属性部分，以显示我们需要为此广告页面配置的设置。

4. 你会看到我们需要提供我们的项目可用的国家、Store ID以及 iTunes 分配给项目的唯一 ID，这样模板就知道我们想要销售哪个项目。现在，使用358992973作为Store ID并从列表中选择你的国家：

5. 你应该看到画布更新以显示平衡球应用程序。如果你选择一个国家时项目没有出现，尝试选择英国或美国，因为内容可能目前在你所在的国家不可用。稍后我们将探讨如何从 iTunes Store 获取你自己的内容的Store ID。

6. 在设备上测试广告并尝试购买项目；你将被要求输入你的 iTunes 账户密码。如果你不想完成交易，在此步骤上点击取消。在 iOS 模拟器中无法下载或购买商店项目，因为它不允许访问受许可的内容。

   注意事项

   注意：如果你正在测试下载非免费项目，即使它是你自己的产品或内容，你也将被收费。

7. 如你所见，我们几乎不需要做什么就能创建一个伟大、快速且无缝的方式让用户下载我们的内容。通常你不会为此页面进行样式设计，因为它与 iTunes 和 App Store 的购买体验保持一致。所以，保持原样并保存你的 iAd 项目。

刚才发生了什么？

我们在我们的 iAd 中添加了一个额外的页面，使用 iAd Producer 中的广告画布上的加号按钮。你可以使用加号按钮添加尽可能多的页面到你的 iAd 中，但尽量保持总数不超过五个，以防止你的广告显得过于拥挤。

使用一个示例Store ID，我们能够让我们的 iAd 用户直接在广告内购买或下载应用程序，而无需离开广告。应用程序将在后台下载并自动出现在用户的设备主屏幕上。现在，让我们看看如何将你自己的 iTunes 内容添加到购买模板中。

操作时间 — 获取 iTunes Store ID

我们可以使用 iTunes 中的内置商店获取购买模板所需项目的Store ID：

1. 要访问 iTunes Store，打开 iTunes。你可以在 Mac 的应用程序文件夹中找到 iTunes。双击图标以打开它。

2. 在 iTunes 的侧边栏中，点击在商店标题下找到的iTunes Store项目，如下面的截图所示：

3. 在 iTunes 主栏的右上角找到搜索商店文本区域。输入你想要查找 ID 的内容，例如，苹果的 iBooks 应用程序。按Enter键进行搜索。

4. 现在，你会看到一个搜索结果列表；找到你的项目，点击价格旁边的箭头，并选择复制链接。这将把你的项目链接复制到你的剪贴板：

5. 现在，我们需要粘贴链接，以便我们可以从中提取存储 ID。打开 TextEdit，这是随你的 Mac 一起提供的文本编辑器。你应该能在应用程序文件夹中找到它。一旦打开，你应该会看到一个大的白色文本区域；右键单击它并选择粘贴，或者使用键盘快捷键cmd + V。你会看到我们刚刚复制的链接出现。该链接是一个你可以分享的网站 URL；点击时它会自动打开 iTunes Store。

   小贴士

   如果你不能选择粘贴，或者如果出现了链接以外的其他内容，请回到 iTunes 并再次复制链接。

6. 你会在链接的末尾找到存储 ID。以itunes.apple.com/gb/app/ibooks/id364709193?mt=8为例。在这个链接中，ID 是id之后和?mt=8之前的数字字符串，所以你会使用364709193作为存储 ID。现在尝试打开咖啡豆项目并更新存储 ID 为 iBooks ID。

7. 现在，让我们尝试查找一首歌；回到 iTunes 并搜索一首歌，例如 RJD2 的《美丽矿》。从搜索结果中找到你想要的项目，并复制链接。将链接粘贴到 TextEdit 中；它应该看起来像这样：itunes.apple.com/gb/album/a-beautiful-mine/id148031770?i=148032644。

   对于歌曲，你只能提供单个曲目供购买，而不是整个专辑，因此我们需要歌曲的项目 ID。单个歌曲 ID 位于i=之后，所以对于这个项目，它将是148032644，而不是其他 id，后者用于识别整个专辑。

   我们也可以在我们的广告中提供电影供购买，例如，复制《第九区》的链接并将其粘贴到 TextEdit 中。电影链接看起来像itunes.apple.com/gb/movie/district-9/id331251689。像应用链接一样，此电影的存储 ID 位于链接末尾的id文本之后；此项目的 ID 是331251689。尝试在 iAd Producer 中使用此 ID 更新存储 ID，以查看电影和电影的购买模板如何显示。

   注意

   一些内容，尽管在你的国家 iTunes Store 中可见，但在 iAd Producer 或测试你的 iAd 时可能显示不正确。尝试暂时将国家更新为美国以修复此问题。如果你继续遇到问题，请联系你的 Apple iTunes Store 代理或开发者支持。

8. 最后，可以包含书籍——它们的 ISBN 用作存储 ID，但书籍必须在 iBook Store 中有售。例如，要找到《宝岛》的存储 ID，复制链接并将其粘贴到 TextEdit 中。链接看起来类似于itunes.apple.com/gb/book/treasure-island/id370190362?mt=11，存储 ID 位于id之后，在这个例子中是370190362。

刚才发生了什么？

我们使用 iTunes 和 iTunes Store 来查找项目的 Store ID，这是 iAd Producer 中购买模板所必需的。您可以在需要获取商店中自己的项目 ID 时使用此技术。

根据您拥有的数字内容，在广告中推广时，考虑免费提供或打折。让我们调整我们的广告，因为我们不小心在添加购买页面时创建了一些不一致性。

行动时间 — 修复我们的广告

由于我们为“咖啡豆”项目使用的菜单模板会在我们添加或删除页面时自动更新，因此我们无需做任何操作来更新它。然而，我们还需要进行一些调整：

1. 继续使用我们的“咖啡豆”项目，确保它在 iAd Producer 中已打开。在编辑画布上打开购买页面。

2. iAd Producer 已自动将我们的页面命名为购买，这对我们的用户来说并不特别吸引人。在没有选择任何对象的情况下，展开检查器，并在属性中将页面重命名为，例如“获取应用！”。这使用了一个行动号召，请求并鼓励用户遵循您的指示。

   在下面的屏幕截图中，您可以查看属性部分和名称字段：

   

3. 返回到广告概览并打开画布上的菜单。您会看到文本已更新以匹配页面的新名称，但其他按钮的样式尚未应用到我们的新菜单项上。整个菜单对象在屏幕底部也被截断了。

4. 点击菜单对象，将其拖动到页面上方，以确保最后一个按钮不被遮挡。您可能还需要通过拖动底部的拖动手柄来调整菜单的大小，以适应我们添加的额外按钮。

5. 接下来，我们将更新按钮的样式，使其与其他按钮匹配。选择菜单后，双击第一个按钮进入编辑模式；然后，再次单击按钮以选择它。这可能需要尝试几次。一旦选中，如果尚未展开，请展开检查器面板，并单击应用样式到所有按钮，如以下屏幕截图所示。这会将样式复制到菜单中的所有其他按钮，使它们匹配并保持一致：

   • 现在按钮与其它按钮匹配后，让我们在设备或 iOS 模拟器上测试我们的广告。

6. 您可能已经注意到，我们无法从购买页面返回，因为菜单项缺失。它位于页面上，但隐藏在页面上的购买对象后面，因此我们需要将商店项目发送到页面的背面。在广告画布上打开购买页面，并单击购买对象以选择它。右键单击并选择发送到背面。现在菜单按钮应该出现了。

7. 如果您在上一个章节中为菜单项保存了样式，请务必从样式预设列表中选择该样式。

8. 不幸的是，我们的菜单项的位置干扰了购买对象的内容，如以下截图所示。让我们重新构建页面以适应它：

9. 通过调整购买对象的大小，我们可以在 iAd 的底部创建一个专用区域，包含返回按钮。点击购买对象，并拖动底部的拖动手柄，使其位于菜单按钮上方。

10. 现在通过拖动将其移到屏幕中间以居中菜单按钮。考虑更新文本为返回菜单，并调整按钮大小，使其占据广告底部更多的空间。

11. 将页面背景改为颜色填充并设置为白色；这将使可滚动的购买对象和返回菜单按钮分开。

12. 重新选择购买对象，并添加一个阴影以进一步分隔页面的两个部分。

13. 最后，给按钮和购买对象添加进入和退出动画。购买视图在进入时从顶部移动进入，在退出时向顶部移动退出。菜单按钮在进入时从底部移动进入，在退出时向底部移动退出。当你选择一个对象时，你可以在动画面板中找到进入和退出部分。

14. 在 iOS 模拟器或你的设备上的 iAd 测试器中打开你的 iAd，检查我们是否能够按照预期进行交互。你的最终购买页面应该看起来像这样：

刚才发生了什么？

由于给我们的 iAd 项目添加一个额外的页面在主菜单上造成了一些样式问题，并阻止了我们的应用导航按预期工作，我们重新应用了按钮样式到单元格，并重新设计了购买页面，以包含一个返回菜单按钮。

突击测验 — 数字下载

你可以从你的 iAds 中的可下载内容中产生巨大的认知度或收入，所以让我们检查你是否做对了：

1. 如何获取 iAd Producer 中购买模板所需的数字项目的商店 ID？

   • a. 只使用项目的名称。

   • b. 发送电子邮件给苹果，请求你的项目 ID。

   • c. 打开 iTunes 并使用商店中的复制链接菜单项。

   • d. 购买该项目，查看我们的收据；ID 就在价格旁边。

2. 这首歌的链接的商店 ID 是多少—http://itunes.apple.com/gb/album/a-beautiful-mine/id148031770?i=148032644?

   • a. a-beautiful-mine

   • b. id148031770

   • c. 148031770

   • d. 148032644

正如你所见，无论是音乐、电影还是应用，销售数字内容都极其简单。只需三下操作，用户就能购买你的产品，并且它将出现在他们的 iOS 设备上。你也可以为你的公司创建一个免费应用，提供比 iAd 更丰富的体验，并持续出现在用户的主屏幕上，让他们可以持续与你的品牌互动。

高级商店搜索器

并非所有产品都是数字的；有时您想增加实体店铺的客流量。之前，我们将基本的商店搜索器整合到了 iAd 中；现在，我们将扩展这一功能，以提供出色的体验，吸引用户到您的店铺。

行动时间 — 添加商店搜索器

我们将在Coffee Beans iAd 中添加一个商店搜索器，以便用户可以找到当地商店并购买一些优质的咖啡：

1. 打开我们在 iAd Producer 中一直在工作的Coffee Beans项目。我们将首先为我们的 iAd 添加一个额外的页面。从广告概览中，使用加号图标向项目添加一个额外的页面。双击新页面以打开模板选择器并选择地图。双击新页面以在广告画布上打开它。

2. 我们首先要做的是添加一个自定义标记；这将显示在我们用户附近的每个商店的地图上。打开检查器面板并展开属性部分；从自定义标记下拉菜单中选择标记图像，例如，coffee-cup-pin.jpg。我们将调整偏移量以使图像居中在蓝色位置十字准线上——更改 X 和 Y 偏移量，直到您的标记位于十字准线上。大约 8px 的 X 偏移量和 5px 的 Y 偏移量应该与这张图片很好地配合。您的对齐标记应该类似于以下：

3. 如果您有一个网站 ID，现在请输入它；如果没有，只需使用显示最近苹果商店的演示 ID。

   注意

   在您将 iAd 提交给苹果之前，您需要联系他们以设置您自己的网站 ID 以显示您的商店位置。

4. 现在，双击页面标题，即位置标签，并将文本更新为更友好的内容，例如，查找您最近的杯子..。您应该更新背景以匹配您的广告其余部分，在这种情况下，到一个白色的填充色。

5. 调整地图区域的大小以填充屏幕宽度，并可能添加您选择的阴影和边框。

6. 预览您的 iAd；您会看到我们现在在广告中有一个基本的商店搜索器。然而，点击一个标记会显示一个简单、默认样式的详情页面。返回到 iAd Producer 并切换到地图详情视图，使用画布顶部的切换按钮：

7. 通过将此页面风格与我们的广告其余部分保持一致，我们将创建一个一致的经验。将背景设置为颜色填充，并将颜色设置为白色。在标题旁边的图像占位符对象中添加一个图像；coffee-cup-small.jpg在这里效果很好。

8. 将图像beans 3-dark-roast.jpg从资产库拖动到画布上。将其发送到页面后面的所有其他对象之后，并将其移动到屏幕底部。

9. 信息区域的全白色背景与我们的白色背景或图像不太搭配。我们可以更改背景、边框、不透明度和阴影，以改善它们的样式。点击包含电话号码的第一个信息区域。然后，从检查器中展开背景、边框、不透明度和阴影部分。将背景颜色填充设置为浅灰色，例如来自蜡笔选择器的Mercury颜色。将边框设置为 2px 宽，并将其颜色改为比背景稍暗，如蜡笔选择器的Silver。将检查器底部的不透明度设置为，比如说，90%。这将允许图像稍微透过我们的信息区域：

10. 在第一个信息区域样式化后，让我们使用样式预设将其样式复制到其他区域。在样式标题下，点击齿轮按钮并选择保存。为样式输入一个名称，例如“地图详情信息区域”，然后点击确定。现在，选择其他信息区域并将该样式预设应用到它们上。

    注意

    我们不需要更新地图详情视图中的标题文本区域中的文本，因为当用户点击打开商店时，iAd 框架会自动设置。

    • 您的最终页面可能看起来像这样：

    

11. 保存您的广告并在 iOS 模拟器或您的设备上测试它。

刚才发生了什么？

我们添加了一个基本的商店查找器，使用了地图模板，然后对其进行了样式化和定制。在地图页面样式化后，我们通过添加几张图片并重新设计信息框来改变原始的默认商店详情页面。现在，找到您的商店将几乎和在其中一样好！

随着我们的广告内容变得更加丰富，包含许多页面，我们可能想要隐藏某些页面，并从广告的其他部分以子页面的形式访问它们。现在我们将看看如何在我们的广告中包含隐藏页面。

行动时间 — 隐藏页面

如您所见，我们的菜单中项目太多，第一页看起来杂乱无章。让我们制作自己的自定义菜单，并使商店查找器页面作为广告的隐藏子页面可访问。

1. 我们将继续使用我们的咖啡豆示例；如果它还没有打开，请在 iAd Producer 中打开您的“咖啡豆”项目。从概览中，在画布上打开菜单页面。您将看到我们的最后一个菜单项；商店查找器从页面中裁剪出来，如下面的截图所示：

2. 我们可以将菜单向上移动，但这会产生一个杂乱无章且令人不知所措的初始屏幕来展示给用户。相反，我们将创建自己的导航菜单，使用按钮对象，并将地图页面按钮放置在Steamy Savings页面中，使其从主菜单中隐藏。

3. 返回到广告概览，并在画布上打开蒸汽储蓄页面。在我们能够向此页面添加任何内容之前，我们需要暂时将Wipe Clear对象从画布上移开，以便访问页面对象。单击Wipe Clear对象并将其拖离主画布，到页面左侧或右侧。我们将在编辑完页面后将其移回原位。

4. 在移除Wipe Clear后，选择并拖动优惠券代码和优惠券区域向上移动到咖啡杯附近；这将为我们地图按钮腾出一些额外空间。如果您之前已经添加了它，请选择在店内展示优惠券代码文本标签并删除它，使用键盘上的删除或退格键；我们将用商店查找按钮替换它。

5. 打开对象库并选择按钮。这将向画布添加一个空按钮；调整大小并移动此按钮，使其适合广告底部。双击按钮以编辑文本，并将其更新为例如现在找一家商店。

6. 选择按钮后，在检查器中展开事件部分。将Touched Up Inside下拉菜单更改为转到页面，然后选择地图；这将导致当用户点击按钮时打开地图页面：

7. 预览您的广告并测试按钮是否按预期工作。

8. 我们现在需要更新我们的主菜单，以移除地图按钮。不幸的是，由于菜单对象在我们添加新页面时会自动更新，移除地图按钮只会导致它在下次修改页面时被重新生成。这意味着我们需要自己构建一个由按钮组成的菜单。尽管如此，我们仍然可以使用一些技巧来简化我们自己的菜单管理。回到广告概览，并在画布上打开菜单页面。

9. 首先，我们将保存菜单按钮的样式作为一个预设，这样我们就可以快速将其应用到所有自己的按钮上。单击菜单对象以选择它，然后双击进入菜单项编辑模式；最后，单击菜单中的一个按钮以选择它。现在，使用齿轮按钮保存样式作为预设，然后选择保存。将预设命名为例如主菜单按钮，这样你就可以知道稍后选择哪种样式。按钮样式保存后，我们可以安全地删除菜单对象。点击菜单对象外部以退出菜单项编辑模式，然后单击菜单对象以选择它。按删除或退格键从画布上删除整个对象。

   小贴士

   如果保存和另存为…项被禁用，请尝试再次选择单个按钮；通常很难选择正确的项！

10. 由于我们的Menu页面不再有任何形式的导航，打开Objects库并点击按钮对象以将新按钮添加到画布上。从样式预设选择器中，更新样式为你的菜单按钮样式，例如Main Menu Button。按钮现在应该看起来像我们删除的菜单中的按钮；如果不一致，请确保你选择了正确的样式。

11. 让我们更改按钮的Touch Up Inside事件为Go To Page。然后，选择要跳转到的页面为Bean Blender，即我们 iAd 的第一页，使用与为我们的store finder按钮添加跳转目标相同的技巧。双击按钮，将文本替换为Bean Blender，使其与跳转目标匹配。

12. 接下来，我们将复制此按钮以节省我们从头创建新按钮的时间。选择按钮对象后，右键点击它并选择Copy，或者使用键盘快捷键cmd + C。现在，右键点击画布并从菜单中选择Paste，或者使用键盘上的cmd + V。再粘贴两次按钮，这样屏幕上就有四个按钮了：

13. 调整每个项目，使它们在页面上均匀分布。使用拖动项目时出现的黄色辅助线来确保间距正确，如下面的截图所示：

14. 将每个项目的Touch Up Inside事件更改为跳转到正确的页面和文本，这样我们的广告的每一页都可以像以前一样访问。然而，不要为Maps页面添加按钮。

    注意

    你可能已经注意到在广告概览中，iAd Producer 仍然显示Map页面与Menu页面相连。这是可以的；iAd Producer 假设所有页面都从核心菜单页面链接，即使你已经更改了它。

15. 在完成自定义菜单后，返回到广告概览并打开Maps页面。目前，我们Map页面上的按钮说Menu并返回到菜单。然而，由于这个页面现在是从Voucher页面访问的，我们将更新按钮使其返回那里。点击Menu按钮以选择它，然后将其更改为跳转到Steamy Savings。更新按钮文本为Back，告诉用户他们将返回到之前访问的页面，而不是菜单。

16. 打开Steamy Savings页面，并将Wipe Clear对象移至页面上方。你可能需要右键点击Wipe Clear对象并选择Bring to Front，以确保它是画布上最前面的对象。保存并预览你的 iAd。

刚才发生了什么？

通过自己构建菜单，我们可以更多地控制广告的页面结构，但会失去自动更新菜单对象的便利性。

记住：如果你在你的广告中添加任何额外的页面，你需要去添加指向该页面的另一个按钮到菜单中；同样，当删除页面时，你也必须删除菜单项。

尝试英雄式操作

我们对我们的广告做了一些改动，为什么不尝试整理一下呢？例如，你可以做以下事情：

• 为我们的新页面添加过渡效果，以简化用户在广告中的浏览体验

• 尝试添加回我们替换菜单时丢失的内置和退出动作动画。

• 确保所有按钮都应用了正确的样式，并且点击它们可以跳转到正确的页面。

• 尝试添加另一个页面，并为它创建一个菜单项。

• 仔细测试广告，理想情况下在多个设备上进行。尝试修复你可能发现的所有问题。

一旦你的广告看起来很棒，就保存它并向你的团队、朋友和家人展示。在开发过程中定期进行全面审查并整理你的广告是一个好主意，尤其是在你接近 iAd 完成时。

发送消息

为了在我们的 iAd 内部生成额外的推广，我们可以启用预编写的 SMS 文本消息和电子邮件功能，而无需用户离开广告或应用。鼓励你的用户通过几次简单的点击与朋友分享他们对你的品牌或产品的热情，这可以显著增加广告潜在受众的范围。

行动时间 — 发送消息

默认情况下，iAd Producer 没有支持发送 SMS 的对象或模板；然而，我们可以通过iAd JS 库（我们的 iAd 的动力框架）来实现这一点。我们只需用四行代码就能发送 SMS；别担心，添加到你的广告中非常简单。

注意

记住：iAd Producer 是一个编辑器，它为我们管理了大部分 iAd JS 库，尽管它目前不支持所有可用功能，所以我们偶尔需要修改和添加一些自定义代码。

1. 我们将继续我们的“咖啡豆”项目；如果它还没有打开，现在就打开它。

2. 让我们在菜单页面上创建一个按钮，以便我们的用户可以与他们的朋友分享我们的品牌。在编辑画布上打开菜单页面，并从对象库中添加一个按钮对象。将按钮文本更改为类似“告诉朋友”的内容，然后将按钮放置在屏幕的右下角。更改按钮的样式。例如，尝试：

   • 将背景设置为从浅到深的线性红色渐变

   • 将文字颜色改为白色

   • 给按钮添加圆角，使其边缘圆润

   • 在按钮上添加阴影以增加光晕效果

   • 调整不同的按钮状态，例如高亮状态，以便按钮在被点击时改变

   • 你可能需要重新定位页面上的其他对象以适应新的按钮

3. 你可能想让你的按钮看起来像以下这样：

4. 当你对按钮的样式满意时，是时候添加一小段代码来添加广告的短信发送功能了。选中按钮后，右键点击它并选择 对象事件 | 触摸内部 | 执行 JavaScript。你可以看到以下截图中的菜单：

5. 你会在屏幕上看到一个文本窗口出现，其中预先填充了一些代码；这仅仅是当此事件被触发时运行的动作集。在 function(event) { 和 } 之间的空行中，准确输入以下几行：

   window.ad.smsComposer.listener =function(){};
   window.ad.smsComposer.toRecipients = [" "];
   window.ad.smsComposer.body = "We should have a drink at Coffee Beans!";
   window.ad.smsComposer.presentComposer();
   
   

   注意

   下载示例代码

   你可以从你购买的所有 Packt 书籍的账户中下载示例代码文件。www.PacktPub.com。如果你在其他地方购买了这本书，你可以访问www.PacktPub.com/support并注册，以便直接将文件通过电子邮件发送给你。

6. 通过点击菜单栏上的 文件 | 保存 或使用键盘上的 cmd + S 来保存此代码文件。

7. 通过关闭代码窗口返回到 iAd Producer 主窗口。在你的 iOS 设备上预览你的广告；你不能使用 iOS 模拟器，因为它没有短信功能。如果你在点击按钮时没有看到消息窗口出现，请尝试重复这些步骤并确保代码完全匹配。

8. 保存你的 iAd 项目。

刚才发生了什么？

我们设计了一个按钮并添加了一段简短的定制代码。这段代码是用 JavaScript 编写的，并在某些事件发生时调用。对象事件是在对象上发生的行为；我们使用 触摸内部 作为当用户将手指从对象上抬起时触发的事件。这随后导致我们的代码被执行，进而打开短信窗口。

使用这种强大的脚本语言，我们能够将电子邮件、短信、电话和社交网络集成到我们的广告中。

摘要

动作和目的地是直接对你的品牌有益的目标，无论是用户与朋友社交分享内容，还是使用丰富的地图定位他们最近的商店。我们探讨了使用一些这些引人入胜的技术来吸引用户：

• 在我们的广告中推广和购买 iTunes 商店的内容，如应用和媒体，从而产生额外的收入来源或推广

• 定制商店查找体验

• 将广告的某些页面从主导航中隐藏，以提供补充内容

• 使用我们第一段 JavaScript 代码发送短信安排与朋友见面！

我们将在稍后学习如何使用高级代码创建更进一步的交互，但首先，让我们看看如何为大型屏幕 iPad 的 iAds 制作广告。

第七章。为大屏幕构建

从 iOS 4.2 开始，运行在 iPhone 和 iPad 上的操作系统允许你为 iPad 创建丰富的全屏 iAd。iPad 的 9.7 英寸大屏幕为我们提供了更大的画布来创建沉浸式和亲密的 iAd。

在本章中，我们将探讨以下内容：

• iPad iAd 的不同之处

• 创建丰富的全屏横幅

• 在你的广告中包含多个横幅，以保持一系列应用中内容的新鲜度

• 使用对象库中不可用的对象来创建自定义页面

创建 iPad iAd

你在 iPhone 上熟悉的模板和对象在 iPad 上也是可用的；然而，为了创建 iPad 的 iAd，你需要开始一个新的项目。iPad 的屏幕尺寸更大，苹果要求你重新设计和规划你的广告以充分利用这一点；但我们能够共享许多相同的资源和资产。

如果你在本章中使用自己的资产，你需要以下内容：

• 用于菜单屏幕的大标志图片

• 用于横幅的背景图片，宽度为 1024 像素，高度为 66 像素

• 用于横幅的小图标或标志

• 一张背景图片，宽度为 1024 像素，高度为 768 像素，用于广告的每一页

• 用于启动屏幕的图片，大约宽度为 300 像素，高度为 200 像素

• 几张用于相册的照片

• 用户将在屏幕上平移的宽度为 2000 像素，高度为 768 像素的图片

• 用于横幅图片的背景

• 一部简短的全屏电影，宽度为 512 像素，高度为 384 像素

• 一张海报图片和你的电影快照

• 一个定制的地图图标，大约宽度为 100 像素，高度为 100 像素

• 每一页广告的菜单图标，包括返回按钮

回顾一下，当我们查看 iAd 的大小限制时，iPad iAd 的限制更为宽松，因为通常有更多的资源比小屏幕的 iPhone 广告要大。在创建资源时请记住这些限制：

• 横幅大小限制为 65 KB。

• 全屏横幅（仅在 iPad 上可用）可达 350 KB。

• 启动页面的大小限制为 300 KB。

• 与其他广告一样，剩余的页面没有最大大小限制，但包括过多的资源会增加广告的加载时间。尽量将每个 iAd 页面中的媒体元素数量控制在 20 个以下。

当构建你的 iAd 时，你可以使用项目警告窗口来查看广告中的任何问题，包括你是否已达到文件大小限制。要查看项目警告，请从 iAd Producer 的菜单栏中选择导出 | 显示项目警告。以下是一个显示项目警告的项目报告窗口示例：

如果你的资产太大，可以考虑使用第二章中介绍的优化技术，为移动设备准备内容。

目前，iPad 没有像 iPhone 那样的视网膜显示屏，因此你不需要以双倍分辨率创建你的资产；然而，记住在创建 iAd 资源时尽可能使用高分辨率。确保你使用高分辨率意味着，如果苹果公司将来发布带有视网膜显示屏的 iPad，你就不必重新制作所有资产以更高的分辨率。

Time for action — 设置 iPad 项目

创建 iPad 项目就像设置一个新的 iPhone 项目一样简单。让我们创建一个占位符广告，我们将在本章中使用它：

1. 如果你还没有做，请打开 iAd Producer。

2. 在项目设备选择屏幕上，点击iPad然后选择：

3. 你会看到你习惯在 iPhone 项目中工作的相同的广告概览。唯一明显的区别是广告中的更大、更方形的占位符页面。如果你需要确定现有项目是 iPhone 还是 iPad，请从菜单栏中选择查看。它将在菜单下拉列表中显示 iPad 或 iPhone。

4. 如果你正在使用本项目的示例资产，请现在将它们添加到你的资产库中。

5. 从菜单栏中选择文件 | 另存为，给你的项目起一个容易记住的名字。如果你将使用本章的示例资产，请使用Cloud 9 - iPad作为文件名。点击保存。

注意

在命名文件时，建议将项目类型添加到文件名末尾，例如，在 iPad 项目中添加- iPad以区分它们与 iPhone 版本。

刚才发生了什么？

就像你之前做的那样，我们在 iAd Producer 中创建了一个新的项目，但这次我们选择的是 iPad，而不是创建 iPhone 项目。

iPad 广告几乎与它们的 iPhone 版本相同，除了额外的屏幕空间；然而，在 iPad 上，我们能够创建全屏 HTML5 横幅。

Time for action — 向你的 iPad 广告添加横幅

iPad 横幅分为两类：动态横幅，如 iPhone 上找到的，以及仅在 iPad 上可用的全屏 HTML5 横幅。我们将首先查看全屏横幅，但首先让我们创建一个在纵向和横向模式下都工作的动态横幅：

1. 在 iAd Producer 中打开你的项目；如果你正在使用示例项目，请打开Cloud 9 - iPad项目。从广告概览中，双击横幅以打开模板选择器。你会注意到模板被分为两个类别；目前，选择图片和文本横幅类型。再次双击横幅以在编辑画布上打开它。

2. 默认情况下，iAd Producer 将横幅缩放至 50%；然而，这种缩小的视图可能会使预测我们的广告在设备上的外观变得困难。从 iAd Producer 右上角选择视图，然后选择iPad (100%)。你现在会看到画布在正确的尺寸；如果你的 Mac 屏幕不够大以显示完整的画布，你可以滚动查看整个横幅。你可能想要调整 iAd Producer 窗口的大小以增加画布的空间。你可以通过点击并拖动窗口的右下角向外扩展来实现这一点：

3. 现在我们有了占位符横幅，我们可以像在 iPhone 项目中一样自定义元素。让我们将横幅的背景改为云朵的图片。打开检查器并展开背景部分；现在将类型改为图片，并使用文件选择器下拉菜单选择clouds-banner.jpg作为背景图片。你会看到画布更新以显示背景。如果你想关闭检查器使画布适合整个横幅，那么再次点击检查器图标以隐藏它。

   注意

   我们使用的是宽度为 1024px、高度为 66px 的背景图片，因此当横幅在竖屏（宽度为 768px）查看时，背景会在边缘被裁剪。创建适用于两种方向的图片对于保持横幅的大小和轻量至关重要。

4. 从资产库中，将图片banner-plane.png拖动到画布上的图片占位符。你会看到一架带有阴影的战斗机出现在画布上。

5. 默认情况下，图片和文本模板仅出现在横幅上，这并不很有吸引力。让我们改变图片的动画，使其从屏幕左侧飞入。选择图片后，展开动作面板并添加一个新动作，使用滑动进入动画。将延迟设置为0.5s，将持续时间设置为3.5s。我们将缓动更改为线性，因为这将防止动画在结束时减速。你的动作设置应该类似于这些：

6. 将图片移动到画布之外，横幅的右侧。这意味着滑动动画将从屏幕左侧将图片移动到这个点，使其看起来像是从屏幕飞过。

7. 使用光滑的飞机动画吸引用户的注意力，让我们更改标签文本，让他们点击了解更多。双击占位符标签进入文本编辑模式，并将文本更改为类似Ever wanted to learn to fly..?的内容。你可能需要调整标签大小，以便将所有文本都显示在视图中。将标签移动到横幅的中心。这样，一旦飞机动画结束，我们的横幅就不会看起来不平衡。黄色的网格线应该看起来会将标签吸附到横幅的中间。

8. 保持标签选中状态，打开检查器，将文本颜色更改为白色。这应该会使标签在云背景上更加突出。

9. 保持标签选中状态，打开动作面板。添加一个滑动进入动作，就像我们为飞机做的。这次，将方向更改为从底部，并将延迟更新为4.2s。这将导致文本在主要的飞行飞机动画结束后出现。

10. 您的横幅应该看起来像以下截图所示：

11. 由于我们的横幅在竖屏视图中看起来很棒，让我们调整它，使其在横屏模式下也能同样出色。单击 iAd Producer 右上角的视图下拉菜单旁边的箭头，在两种方向之间切换，或从菜单栏中选择视图 | 横屏。您可能想要隐藏检查器面板，以便显示更多画布区域。

    注意

    在 iPad 上处理方向性甚至更为重要，因为该设备没有默认的方向。鼓励应用开发者支持竖屏和横屏两种模式。

12. 现在您处于横幅的景观视图中，重新定位标签，使其位于画布的中心。您会注意到背景图像已经自动扩展到更宽横幅的全宽。

13. 保存您的 iAd。

刚才发生了什么？

我们刚刚创建了一个大型的 iPad 横幅，它可以在竖屏和横屏模式下工作。通过使用内置的进出动画，我们模拟了一架飞机在画布上飞行的效果。

现在预览您的 iAd（最好在设备上），查看动画，并测试其在竖屏和横屏下的外观。如果您需要在 iPad 上安装 iAd Tester 或想知道如何缩放和旋转模拟器，请参阅第四章，确保它工作。

尝试一下

一旦动画结束，我们的横幅略显静态；如果您愿意，为什么不尝试添加一些调整和润色，以保持横幅在初始动画之后对用户的吸引力。您可以尝试以下操作：

• 通过用多标签单元格替换标签，并为每个单元格添加不同的文本，使横幅更加有趣。

• 给文本添加阴影，使其在云层中更加突出。

• 将图像 clouds-banner-transparent.png 添加到画布上。从右到左，线性地动画化它，持续 15 秒。这将给你的横幅动画增加更多的深度。

现在我们已经有一个很棒的动态横幅了，让我们来看看如何包含一个大型、沉浸式、全屏的 HTML5 横幅。

使用 HTML5 全屏横幅填充屏幕

从 2011 年 3 月发布的 iOS 4.3 开始，iPad 能够显示全屏横幅。与你的启动画面类似，全屏横幅只能显示元素。用户无法与之交互，因为任何在横幅上的触摸都会加载你核心广告单元的丰富内容。

HTML5 全屏横幅通常出现在杂志和游戏等应用中，它们会在页面之间显示或帮助用户在游戏级别之间过渡。我们可以在一个 iAd 项目中包含多个横幅创意。这意味着在用户的设备上，iAd 框架将加载与用户当前体验最相关的横幅。

行动时间 — 提供多个横幅创意

任何项目，无论是 iPhone 还是 iPad，都可以有多个横幅创意。这是适应你 iAd 将出现的各种情况和应用的绝佳方式：

1. 在 iAd Producer 中打开项目 Cloud 9，双击横幅以在编辑画布上打开它。你应该能看到我们之前添加到广告中的横幅。

2. 在 iAd Producer 的右上角，紧邻 概览 按钮，点击小箭头按钮，以展开 横幅绘制。这个绘制显示了目前在 iAd Producer 中可用的所有横幅创意。

3. 在横幅绘制底部，点击 + 按钮，打开模板选择器，选择任何模板，然后点击 选择。这将向你的项目添加一个新的横幅创意：

4. 要在横幅之间切换，只需点击你想要查看的横幅创意缩略图，画布将更新。

5. 删除你刚刚添加的模板；我们将在下一个步骤中添加一个合适的全屏横幅。点击横幅绘制中的横幅以选择它，然后在键盘上按 delete 或 backspace 键来移除它。

发生了什么？

使用多个横幅意味着更多的应用能够展示你的广告。当应用开发者将 iAds 添加到他们的应用中时，他们会决定使用动态横幅还是 HTML5 全屏横幅。通过在你的 iAd 项目中提供全屏和动态横幅，你的广告能够在更多的应用中显示。

你可能会想知道为什么这会在只有一种横幅类型（动态横幅）的 iPhone 广告中带来好处。如果你创建了一个包含多个创意横幅的广告，iAd 框架将自动在这些横幅之间循环。这意味着看到你的广告横幅多次的用户将看到不同的横幅，保持你的创意新鲜。

注意

你的广告可以包含全屏横幅和动态横幅的组合，以及相同类型的多个横幅。如果你包含了多个类似的横幅，请确保在检查器面板中为每个横幅更新名称，使其可识别。

创建沉浸式视频体验的时间

使用全屏 HTML5 横幅，我们能够通过填充整个屏幕来捕获用户的全部注意力，这为我们提供了一个将用户沉浸在我们品牌中的绝佳方式。结合全屏横幅和预滚动视频将使用户过渡到我们的广告，并兴奋地了解我们的产品：

1. 如果它还没有打开，请在 iAd Producer 中打开 Cloud 9 演示。双击横幅以在画布上打开横幅。使用横幅抽屉，打开模板选择器并选择空白全屏模板。如果你不确定哪个模板是标准横幅，哪个是全屏横幅，将鼠标悬停在每一个上，全屏将出现在正确的模板上。

   注意

   你可能需要将画布视图更改为 50%，这样你就可以看到整个横幅。

2. 打开检查器并将名称属性设置为可识别的内容，例如 Fullscreen Banner。现在，我们将设置页面的背景图像并展开背景部分。将背景更改为图像并选择文件 launch-movie-placeholder.jpg。通过使用背景图像，我们的横幅将根据方向自动裁剪。

3. 就像动态横幅一样，我们的全屏横幅需要在两种方向上都能工作。在 iAd Producer 的右上角单击方向切换按钮，或从菜单栏中选择视图|横向，以切换到横向视图。

4. 占位符图像设计为 1024 像素宽和 1024 像素高；这意味着它可以在任何方向上填充屏幕，某些部分可能被你的 iAd 裁剪或隐藏。

5. 以下截图显示了安全区域，始终可用的中间正方形区域——仅在纵向或横向可见的区域，以及永远不会可见的角落：

6. 通过使用一个图像作为我们的占位符，它在所有方向上都有效，当设备旋转时不会有闪烁。这是因为我们能够将文件大小和加载时间保持在较低水平。

7. 返回广告概览并双击启动页面。从模板选择器中选择马赛克。在广告画布上打开启动页面。选择马赛克对象并更新图像属性为视频占位符 launch-movie-placeholder.jpg。

8. 你可能已经注意到图像的倾斜比例不正确。展开马赛克对象的布局部分并单击原始大小以将图像的正确比例恢复到正确比例。

9. 通过使用画布上方的切换按钮切换到预播放页面。展开检查器面板，将视频设置为launch-movie - iPhone.mov，将海报帧设置为launch-movie-placeholder.jpg。

10. 你将看到画布更新为包含我们的视频占位符图像。默认情况下，iAd Producer 将我们的视频设置为全屏模式播放。

11. 保存你的 iAd，并准备好进行测试。

刚才发生了什么？

我们创建了一个可以适应不同屏幕尺寸和方向的横幅，并在广告中添加了一个引人入胜的沉浸式视频预播放。全屏广告可以比动态横幅更具吸引力，因为它可以捕获整个屏幕，确保用户的注意力。

请记住，如果你选择使用全屏 HTML5 横幅，你将无法在运行比 iOS 4.3 更旧操作系统的设备上显示你的广告。然而，所有 iPad 都可以升级到这个操作系统，所以你不应该错过大量受众。

苹果之前允许在全屏横幅中使用视频，但由于自动播放视频的用户体验不佳，因此取消了这一功能。你可以在全屏横幅上构建动画，以诱使用户点击它。

尽管是全屏横幅，但你的横幅可能并不总是充分利用屏幕，这取决于它出现的应用程序。例如，一些应用可能会在标签栏和导航栏内显示你的广告，而一些全屏游戏可能仍然会在屏幕顶部显示 20px 的状态栏。你的 iAd 将始终填充整个屏幕宽度；只有高度可以改变。你的全屏横幅应该在这些尺寸范围内进行测试和调整，以确保其正常工作：

1. 在竖屏布局中，你的横幅可能看起来如下所示：

   • 高度在 911px 到 1024px 之间

   • 总宽度为 768px

2. 在横幅布局中，你的横幅可能看起来如下所示：

   • 高度在 655px 到 768px 之间

   • 总宽度为 1024px

幸运的是，iAd 测试器提供了模拟广告可能出现的各种潜在情况的能力。

测试全屏横幅情况的时间

当你的 iAd 项目包含多个横幅或全屏横幅时，iAd 测试器提供了不同的选项来测试每个横幅，以及它可能出现的各种情况。让我们预览一下到目前为止的Cloud 9广告，并检查我们的每个横幅的外观：

1. 确保 iAd Producer 已打开，并且Cloud 9 - iPad项目处于活动状态。

   注意

   如果你正在使用 iPad 进行测试，请确保你在本地网络上共享你的广告，或者使用 iTunes 导出并复制你的广告到 iPad。如果你忘记了如何使用 iAd Producer 测试你的广告，我们已经在第四章中介绍了如何共享你的 iAd，测试和调试。

2. 在你的 iPad 上打开 iAd 测试器或点击 iAd Producer 中的模拟按钮以打开 iOS 模拟器。

3. 如果您在设备上使用 iAd 测试器，您现在将看到所有可用的项目；轻触您的项目名称。由于我们为这个广告提供了多个横幅，因此会出现一个包含您的横幅或创意的列表。让我们测试全屏横幅；从列表中轻触全屏横幅。

4. 您现在可以选择模拟横幅可能出现的各种布局的模拟，分为杂志和游戏风格的应用程序：

5. 在列表中轻触第一个全屏条目以预览全屏的视频。尝试旋转 iPad 以查看横幅在每个方向上的表现。一旦视频播放完成，您将看到占位符图像出现。

6. 在横幅的任何地方轻触都会打开您的核心广告。

7. 要关闭横幅，请随时在屏幕左上角轻触关闭图标。

8. 关闭广告和横幅，并测试您广告的其他配置。

   注意

   导航栏和标签栏布局为您的 iAd 横幅提供了最少的空间，在横幅模式下只有 655px 的高度可用。请确保您使用这种样式测试您的横幅。

9. 通过关闭当前广告（如果已打开）并在导航栏左上角轻触创意菜单项来返回您的创意列表。打开图片和文本横幅以查看如何从您的 iAd 项目中访问一个或多个横幅。

刚才发生了什么？

使用 iAd 测试器，无论是在设备上还是在 iOS 模拟器中，我们测试了我们的 iAd 全屏横幅。您现在知道如何在广告中选择多个横幅创意，并且可以在各种模拟情况下测试您的全屏横幅。

确保您使用可识别的页面名称，这样您就可以找到您想要的横幅。您可以从检查器面板更改横幅名称。您应该尝试使用静音的 iPad 测试您的广告。这样，您就可以确保您的视频在视觉上是有意义的，而不需要音频。

快速问答——横幅

1. 当创建一个 iAd 时，为什么我们应该包含多个横幅？

   • a. 制作很多横幅很有趣

   • b. 横幅易于创建

   • c. 如果用户不喜欢某个横幅，他们可以滑动以显示不同的横幅

   • d. 多个横幅意味着看到我们横幅的用户会看到多种不同的横幅

2. 当测试全屏横幅时，哪种布局为您的横幅提供了最少的空间？

   • a. 全屏

   • b. 带状态栏的全屏

   • c. 导航栏和标签栏

   • d. 导航栏

挑战英雄——改进您的横幅

配有出色的动态横幅和丰富的全屏沉浸式视频，我们的横幅看起来很棒；考虑以下这些小调整，让它们变得更好：

• 在您的广告中添加一个额外的动态横幅，以便循环显示多个横幅

• 使用 QuickTime 中的保存为网页功能创建多个视频版本，以便根据无线网络的质量和加载大小进行调整

• 尝试通过叠加更多对象和使用动作来动画化它们来改进您的全屏横幅

• 使用 iAd Tester 测试和调整全屏横幅在各种可能出现的场景中的效果

制作大型菜单

与 iPhone 不同，在 iPhone 中菜单填充了页面的相当一部分，我们可以在 iPad 广告中包含更深层次的菜单交互。

行动时间 — 将对象组合以创建独特的菜单

我们可以将 3D 旋转木马与按钮结合使用，因为它不仅限于图片；这意味着我们可以使用按钮，使它们在广告中的菜单看起来像飞行的飞机。为了将对象组合以创建独特的菜单，请按照以下步骤操作：

1. 我们将继续使用Cloud 9 - iPad项目，所以如果它还没有打开，请在 iAd Producer 中打开它。

2. 在我们制作菜单之前，让我们设置 iAd 的占位符页面。从广告概览中双击第一个页面项，以打开模板选择器。选择第二个空白模板，一个空白横幅页面，然后点击选择：

3. 在广告概览中单击新的空白页面。打开检查器并将名称更改为Test Flight。

4. 对其他两个页面重复此操作，为下一个页面选择第一个网格视图模板，在横幅模式下，并将名称更改为Making Memories。对于最后一页，选择地图并将名称更新为Book a flight。

5. 在我们的页面设置完成后，双击菜单页面并选择一个宽的、横幅的空白页面。再次双击页面，以在画布上打开它。从检查器中，将背景类型更改为图片，并选择menu-background.jpg作为您的背景图片。这将有背景图片和标志的组合，以节省请求并减少对透明图片的需求（透明图片文件大小更大）。

6. 从 iAd Producer 的左下角打开对象库，并将旋转木马对象添加到画布上。

7. 在选择新的旋转木马对象后，打开检查器面板。展开属性部分，将方向更改为水平，并勾选吸附到单元格框。这将使我们的旋转木马左右滚动而不是上下滚动，并确保它始终停在单元格上，不会卡在两个单元格之间。

8. 调整旋转木马的大小，使其位于标志下方并跨越页面的宽度。它应该看起来有点像以下截图：

9. 双击中心单元格以进入单元格编辑模式。画布的其余部分应该淡出，单元格导航器将出现。再次单击以选择单元格内的图像占位符。我们将在这个单元格中添加一个按钮而不是图像，所以，在图像被选中时，按键盘上的退格或删除键来删除图像。

10. 打开对象库，并将按钮添加到单元格中。我们想使用图像作为按钮，因此打开检查器面板，并将背景类型更改为图像。选择test-flight-button.png作为图像；你会看到按钮更新为这个图形。目前，图形被裁剪，并且按钮文本与之重叠。尝试调整按钮的大小以适应整个图像。

11. 你可能会发现单元格不够大，无法容纳整个按钮图像。如果是这种情况，点击单元格外部以退出单元格编辑模式，然后再次点击轮播图以选择它。从检查器面板的度量部分，将单元格长度更改为更大的数字，例如500px，并将填充减少到30px。这将增加单元格的大小，这样你就可以调整按钮的大小以适应整个图像。

12. iAd Producer 自动为按钮应用边框；然而，由于我们的按钮边缘是透明的，边框在图像周围添加了一个不必要的框架。在单元格编辑模式下，并且选中按钮对象，取消选中边框选项。

13. 我们的形象文本与按钮重叠，因此双击按钮对象进入文本编辑模式；通过删除它来删除所有文本。

14. 最后，我们需要更新我们的按钮，以便在点击时打开我们广告的正确页面。将检查器面板的事件部分的转到页面更改为测试飞行。

15. 我们将使用这个按钮作为其他单元格的模板。复制按钮，以便我们可以将其粘贴到另一个单元格中。

    注意

    要复制对象，右键单击对象并从上下文菜单中选择复制，或者按键盘上的cmd + C，以复制选定的对象或项目。

16. 使用单元格导航器，点击右边的箭头以移动到下一个单元格。再次点击它，这样你就在我们刚刚创建的按钮单元格的两侧两个单元格。我们稍后会更新这两个单元格。

17. 删除单元格中当前存在的图像占位符对象，然后粘贴我们刚刚复制的按钮。

    注意

    要粘贴对象，在画布上右键单击并从上下文菜单中选择粘贴，或者使用键盘快捷键cmd + V。

18. 我们现在已经有了我们设置的按钮的副本；通过复制和粘贴元素，我们节省了时间，因为不需要为每个单元格重新制作按钮。将按钮的背景图像更改为memories-button.png。你可能需要更改按钮的大小以防止图像被裁剪。更新转到页面为制作回忆，这样按钮就能将用户带到正确的页面。

19. 再次向前移动，通过点击单元格导航器的右箭头两次，移动两个单元格。删除占位符图像，然后再次粘贴按钮，这次将按钮的背景图像替换为book-a-flight-button.png，并将按钮的转到页面更改为预订航班。

20. 在构建我们的轮播图时，我们省略了一些单元格；现在让我们向它们添加一些内容。为了让轮播图运行良好，它需要一定数量的单元格，否则每个单元格之间的角度太紧。围绕剩余的单元格，并更新每个图像占位符为cartoon-clouds.png。如果你想更快地完成，可以尝试复制和粘贴图像。

21. 在设备或模拟器上测试你的 iAd。你可以用酷炫的 3D 飞行效果翻动菜单。尝试轻触菜单项以打开相关页面。你的最终菜单页面应该看起来像以下截图：

刚才发生了什么？

使用轮播图对象，我们在单元格中添加了带有图片的按钮，以创建一个符合我们广告背景的交互式 3D 菜单。在 iAd Producer 中的大多数对象一样，你可以移除占位符内容，并调整对象以创建一些有趣且独特的内容。

使用这种技术，菜单可以轻松扩展，向广告中添加更多页面，而不会让用户感到不知所措。

尝试一下英雄

我们菜单看起来很棒；改变这些事情让它更加出色：

• 为按钮添加按钮状态，考虑使用相同的图像，并将按钮的不透明度设置为 80%，以使用户对状态的变化有反馈

• 在轮播图元素上设置动画，使菜单从页面底部移动进和出

创建一个宏伟的画廊

为 iPad 创建相册与为 iPhone 创建相册相同，只是你不必担心双分辨率图形，因为目前 iPad 还没有配备视网膜显示屏。然而，你将需要创建比标准分辨率的 iPhone 更大的图像。在这个例子中，我们使用的是宽度为 640px、高度为 478px 的图像。

行动时间 — 在画廊中创造回忆

让我们在广告中添加一个图像画廊，使用网格模板，这将展示与Cloud 9典型一天的情况：

1. 在 iAd Producer 中打开Cloud 9 - iPad项目，双击创造回忆页面以在画布上打开它。选择图像cloud-9-example-day-1.jpg到cloud-9-example-day-7.jpg，并将它们拖到画布上的网格画廊对象中。

2. 网格画廊现在将更新以显示图像。将页面的背景类型更改为图像，并选择blue-starburst.jpg，使用检查器面板的背景部分。

3. 将当前标题为网格视图的标签更改为，例如创造回忆。将文字颜色更新为白色，以便在丰富的蓝色背景上突出显示。

4. 目前，用户没有返回主菜单的方法，所以让我们添加一个返回按钮。从对象库中选择一个按钮并将其添加到画布上。将背景类型更改为图片并使用图片back-button.png。你需要调整按钮对象的大小并移除文本，以便你的按钮看起来正确。更新转到页面属性以打开空白菜单景观页面。

   注意

   你可能想更新你的菜单页面名称；空白菜单景观不是很清晰。

5. 将返回按钮复制并粘贴到广告的其他两个页面上，这样你就有了一种通用的方法来离开每个页面。

6. 返回你的制作回忆页面并测试你的 iAd。点击一个缩略图以打开带有整洁 3D 动画的全尺寸图片。完成后的页面应该看起来像以下截图：

刚才发生了什么？

我们定制了我们的网格模板以匹配我们广告的主题，并将我们的图片添加到其中。网格模板提供了一个高冲击力的交互式画廊；你所需要做的只是将你的图片拖放到它上面。

使用滚动视图滚动内容

与我们广告的其他页面不同，让我们只使用对象和空白模板创建一个交互式广告部分。

行动时间——在广告中滚动内容

让我们为我们的广告的第一页，空白的测试飞行页面进行样式设计：

1. 确保在 iAd Producer 中打开了Cloud 9 - iPad项目。双击第一页，测试飞行，以在画布上打开它。

2. 将背景更新为图片blue-starburst.jpg，以便它与你的其余 iAd 相匹配。

3. 从对象库中添加一个滚动视图到画布上。滚动视图是一个包含用户可以滑动以滚动的大视图的对象。它是平移查看页面模板的核心组件。使用拖动手柄，调整滚动视图的大小，使其适合页面的整个高度和宽度。

4. 打开资产库，并将图片cloud-scene.jpg拖动到滚动视图中。这将自动将滚动视图的背景设置为云的图片。点击滚动视图对象以选择它并展开检查器面板的布局部分。在布局部分，将内容视图的宽度更改为2000px；这将允许滚动视图左右滚动，以显示更多背景图片：

   注意

   在你的 iAd 项目中，图片的最大尺寸是 2000px x 2000px。在设计可滚动区域的大图形时请记住这一点。苹果实施这个限制是因为低功耗设备上的性能限制。

5. 双击滚动视图以打开视图编辑模式。这允许你添加元素到滚动视图中，当用户滚动时，这些元素会随着视图移动。在编辑模式中，你可以通过选择箭头/指针图标或抓取/手图标来更改选择对象和滚动视图之间的交互方法：

6. 仍然在编辑模式中，从对象库中向视图中添加一个新的标签。更新标签文本为“想学习飞行？通过我们的测试飞行套餐，你可以获得 60 分钟的空中体验。无需经验！”。为了使整个文本适合视图，调整标签大小以适应滚动视图的宽度。你可能需要滚动视图以保持拖动标签到滚动视图的隐藏区域。将交互方法更改为滚动和拖动滚动视图以显示当前不在页面上的区域。切换回指针选择方法，然后继续调整标签大小。将标签重新定位，使其从滚动视图的左下角开始。

7. 更新文本样式以匹配广告的设计，并调整字体大小以填充提供的可用宽度。考虑使用Chalkboard SE字体，大小为34px，并添加深蓝色阴影。

8. 现在我们给我们的页面添加一个额外的对象，一个上下弹跳的飞机图片。由于 iAd Producer 的对象库中没有提供持续动画的对象，我们不得不使用一个小技巧，从浮动的Splash模板中复制图片对象。既然我们已经在这个广告中设置了并配置了我们的Splash页面，让我们打开一个新的项目，复制动画图片对象，并将其粘贴回我们的主要Cloud 9项目中。在继续之前，建议保存你的项目，以防在下一步中出现问题。

9. 从 iAd Producer 的菜单栏中选择文件 | 新建，或者使用键盘快捷键cmd + N。这将打开一个新的 iAd Producer 窗口。选择 iPad 作为项目类型。从概览中双击Splash页面，选择弹跳模板。再次双击页面，以在编辑画布上打开它。选择并复制页面画布上的占位符图片对象。

10. 复制对象后，使用窗口左上角的红色关闭点关闭此 iAd Producer 项目。如果被问及是否要保存未命名的项目，请选择不保存。你的Cloud 9项目应该重新回到视图中；如果它没有，从菜单栏中选择窗口 | Cloud 9。

11. 通过点击主画布外部来确保你不在滚动视图编辑模式中。将你刚刚复制的对象粘贴到画布上。

    注意

    复制和粘贴并不特定于你当前选定的项目，因此你可以用它来在项目之间共享对象。

12. 你现在会看到图像占位符出现。虽然它看起来像标准的图像对象，但它应用了特殊的属性，使其弹跳或上下浮动。这应该适用于大多数模板，所以你可以在模板有你想使用的对象但不在对象库中时使用它。

13. 选择airplane.png文件作为图像。在检查器面板的度量部分中单击原始大小按钮，以便图像对象是正确的图像大小。重新定位飞机，使其位于页面中央。

14. 测试你的 iAd；你会看到你可以滚动滚动视图来阅读文本，同时飞机图像保持在屏幕中央上下动画。如果你看不到返回按钮，你的滚动视图对象可能与之重叠；右键单击滚动视图并选择发送到后台。

15. 希望你的最终页面看起来类似于以下截图：

刚才发生了什么？

我们向滚动视图中添加了内容，这样我们就可以包含更多适合在一屏上显示的内容，用户可以通过滚动来查看它们。使用模板中可用的对象，但不在对象库中，我们将它从启动页复制并粘贴到我们的测试飞行页。共享对象对于创建共享相同资源的 iPad 和 iPhone 广告很有用，因为您可以复制并粘贴对象，并根据不同的设备进行调整，而不是从头开始重新创建整个广告。

使用商店查找器增加客流量

尽管大多数 iPad 中没有内置 GPS 位置感知芯片，但它们仍然能够在有网络连接时估算其位置。我们可以利用这一点在我们的大屏幕 iPad 广告中包含商店查找器页面。

是时候添加商店查找器了

没有商店查找器的广告是不完整的。让我们快速将商店查找器样式调整为与我们的广告保持一致，通过更改背景并使用自定义标记图像：

1. 从Cloud 9 - iPad项目，在 iAd Producer 的编辑画布上打开位置页面。

2. 将页面背景更改为图像blue-starburst.jpg，并更新页面标题标签为找到您最近的中心..。更改字体和颜色以匹配广告的其余部分；您可以将制作回忆标题标签的样式保存并应用于整个广告，以保持一致的样式。

3. 点击地图对象以选择它，然后将自定义标记设置为图像cloud-9-map-pin.png。

刚才发生了什么？

就像我们对 iPhone 所做的那样，我们使用自定义的标记样式对地图进行了设计，并将页面的其余部分样式与我们的广告保持一致。我们的 iPad 地图与 iPhone 地图之间没有太大的区别，只是我们使用了更大的标记图像。例如，这个图像是 100 像素乘以 100 像素，而标准分辨率的 iPhone 图像大约是 30 像素乘以 30 像素。

尝试一下英雄功能

我们完成的广告看起来相当棒，但考虑以下调整以使其更加出色：

• 设计商店查找器地图详情页面。

• 在广告中添加动画，以构建页面元素并让用户平滑地过渡到你的 iAd。

• 向测试飞行页面添加一条消息，建议用户滚动，并添加额外内容以使页面更加吸引人。

• 如果你感到好奇，为什么不尝试为较小的 iPhone 屏幕重新设计这个广告？创建一个新的项目，并调整这些练习以适应较小的屏幕。你将能够复制和粘贴许多对象以加快迁移速度。别忘了：全屏 HTML5 横幅在 iPhone 上不可用，但你仍然可以有多个动态横幅创意。

摘要

通过大屏幕的航空广告，我们创建了一个大胆、高影响力的广告，在 iPad 的 9.7 英寸大屏幕上看起来很棒。在本章中，你学习了以下内容：

• 为 iPad 创建全屏 HTML5 横幅

• 在你的 iAd 中包含多个横幅创意

• 使用 iAd 测试器测试包含多个横幅和全屏 HTML5 横幅的广告

• 从对象库中不可用的模板中窃取对象

• iPad 和 iPhone 广告之间没有太多技术差异，但体验应该根据 iPad 丰富的、大型的多点触控屏幕进行定制

现在，你能够为 iPhone 和 iPad 创建令人惊叹的广告。在下一章中，我们将看看如何通过一些简单的 JavaScript 代码来扩展它们的功能。

第八章. 使用代码增强我们的应用

iAd Producer 管理着驱动我们的 iAd 的 HTML、CSS 和 JavaScript，这意味着我们可以在不了解这些网络技术的情况下制作出视觉冲击力强的广告。我们可以通过修改和添加 iAd Producer 生成的 JavaScript 源代码来扩展我们广告的交互性。我们将回顾你一直在工作的项目，并通过简单的有效调整来增强它们的交互性。

在本章中，你将了解以下内容：

• 什么是 JavaScript

• iAd Producer 的代码编辑器

• 处理事件

• 访问对象

• 发送电子邮件和短信

• 保存日历事件

尽管本章不会让你成为 JavaScript 大师，但你将了解正在发生的事情，并能够将这些片段和示例应用到自己的精彩 iAd 项目中。

JavaScript

JavaScript，通常简称为 JS，是由 Netscape 的 Brendan Eich 于 1995 年创建的一种轻量级语言，用于通过增强网络交互性。JavaScript 使用对象，一个可以包含一个或多个函数和属性的项目。函数是一系列在用户或代码调用时发生的操作，而属性或变量是存储在对象中的值。

如果你已经熟悉编程，你会发现 JavaScript 受到了 C 语言的高度影响。JavaScript 在浏览器以外的应用中越来越受欢迎，学习它是一种强大且有用的语言。

注意

与普遍的误解相反，JavaScript 与 Java 语言没有关系。它最初被命名为 Mocha，然后是 LiveScript，最后改为 JavaScript——Sun Microsystems 的商标。

如果你之前没有使用过 JavaScript，不要担心，我们将逐步讲解每个练习，并解释代码是如何与我们的广告及其组件交互的。

代码编辑器

iAd Producer 内置了一个代码编辑器，我们将用它来编辑我们的 JavaScript 代码。它本质上是一个基本的文本编辑器，带有一些实用的工具，例如为我们的代码着色以提高可读性，以及基本的错误检查。

每次你在项目中创建一个新页面时，iAd Producer 都会自动生成一个隐藏的 JavaScript 文件，你可以通过从 iAd Producer 菜单栏中选择代码 | 显示代码编辑器来查看它。每个对象也有自己的 JavaScript 文件，用于在发生事件（如触摸或滑动）时调用函数。要查看对象的代码，请选择对象后打开编辑器。你可以在以下屏幕截图中看到一个代码编辑器的示例：

访问页面对象

每当我们向页面画布添加一个对象时，我们都能使用一些 JavaScript 代码访问和编辑它的某些属性。这允许你编辑在 iAd Producer 界面中不可用的属性，或者改变你的广告中的对象以响应用户的输入。

行动时间——访问对象

让我们继续使用上一章中创建的Cloud 9 - iPad广告。我们将对我们的Test Flight页面的滚动视图对象进行一些调整，这些调整在 iAd Producer 界面中是不可能的：

1. 在 iAd Producer 中打开项目Cloud 9 - iPad。如果您没有完成此项目，请在Cloud 9文件夹中打开8. Store Finder.iadproj文件，然后进入Exercises文件夹。此文件中已为您完成了之前的练习。

2. 双击广告概览中的第一页Test Flight，在画布上打开它。在画布外的网格背景上右键单击，展开菜单项页面事件 | 视图加载完成 | 执行 JavaScript。这将自动创建此事件所需的功能，并打开此页面的代码编辑器：

3. 在代码编辑器窗口中，iAd Producer 为该页面创建了一个新函数，当视图出现时将调用并运行。//Code goes here占位符注释显示了您放置自定义代码的位置。删除占位符注释并添加以下内容：

   //get the scrollView from the canvas
   var scrollView = this.outlets.scrollView;
   
   

   注意

   在 JavaScript 中，任何在//之后的行都是注释，在运行时将被忽略。如果您想有多行注释，请使用/* comment goes here */。注释很有用，因为它们可以用来提醒您（或告知正在您代码上工作的其他开发者）为什么以某种方式做事。代码编辑器会将注释变为绿色，以区分 JavaScript 代码。

4. 第一行是一个注释，说明我们在做什么，即从页面中检索滚动视图对象并将其引用存储在变量中，变量用var表示，命名为scrollView。页面上的每个对象都被分配了一个唯一的出口名称。要查找或修改对象的出口值，请从画布上点击并选择它，然后打开检查器面板。展开属性部分，您会看到一个带有出口名称的文本框。如果您在页面上有多个相同类型的对象，您可以将其更改为一个更容易记住的名称：

5. 现在我们已经通过scrollView变量轻松访问了出口，我们可以通过调整其属性来操作它。在代码编辑器中添加以下行到您的函数中：

   //prevent up & down vertical scrolling
   scrollView.verticalScrollEnabled = false;
   
   

   注意

   要禁用属性，我们使用false值，而使用true值来启用它。

6. 这将禁用我们的滚动视图的垂直滚动，使其只能由用户左右滚动。由于我们阻止了垂直滚动，我们还应该防止垂直滚动条出现：

   //remove vertical scrollbar
   scrollView.showsVerticalScrollIndicator = false;
   
   

7. 通过将我们的滚动视图对象的showsVerticalScrollIndicator属性设置为false，我们禁用了垂直滚动条的出现。

8. 您的完整代码应该类似于代码编辑器中的以下图片：

9. 保存您的项目，并在 iOS 模拟器或使用 iAd Tester 的设备上测试广告。您会注意到滚动视图不能再上下滚动，只能左右滚动，并且不会出现垂直滚动条。

刚才发生了什么？

我们使用了onViewControllerViewDidLoad事件函数，该函数在页面完成加载后调用，并修改了一些我们的滚动视图对象的一些属性。iAd Producer 不允许访问某些属性，因此它可以保持其用户界面干净、易懂。通过从初学者那里隐藏高级功能，他们使开始创建 iAd 的过程不那么令人不知所措。既然你现在已经是 iAd 专家，我们可以深入 JavaScript 来创建更好的广告。

处理用户事件

无论是由用户还是系统触发的我们的广告上的任何操作，都会调用一个事件。我们能够将 JavaScript 函数添加到广告中的各种事件中，例如按钮的点击、设备的摇晃和方向变化。

事件分为三组：

• 全球事件: 这些事件发生在整个广告中

• 页面事件: 这些与特定页面相关

• 对象事件: 这些事件特定于页面上的一个对象

例如，用户摇晃设备或广告完成加载是一个全局事件，页面加载或出现是一个页面事件，按钮被触摸则是一个对象事件。您可以在以下位置查看事件层次结构：

发送短信和电子邮件

iAd Producer 没有提供用于发送电子邮件或短信的对象或模板，但为我们 iAd 提供动力的 iAd JS 框架有一个简单的方法向用户展示电子邮件对话框。

你可能记得我们在第六章“广告目的地和动作”中简要提到了这一点，当时我们添加了使用短信分享广告的功能。这次，我们将更深入地查看代码以及每个步骤中发生的事情，并改为发送电子邮件。

行动时间——检测点击并发送电子邮件

继续增强我们的Cloud 9广告，我们将在预订航班页面上添加一个按钮，该按钮将预先填充我们的预订中心的电子邮件地址。

1. 如果还没有，请在 iAd Producer 中打开Cloud 9 - iPad项目。双击预订航班页面以在广告画布上打开它。使用画布上方的页面切换器，切换到地图详情视图。

2. 从对象库中，将一个按钮添加到画布上。打开检查器，将出口名称更改为emailButton。

   注意

   当命名出口时，你应该以小写字母开始，然后使用驼峰式命名法；这意味着第一个单词之后的每个后续单词都应该大写。例如，youShouldCapitalizeEveryFirstLetterOfEachWord。这样做使得阅读和理解每个出口的功能更容易。

3. 将按钮文本更新为“现在预订航班！”

4. 在按钮选中后，展开检查器面板并找到事件部分。Touched Up Inside事件已经选中，但没有动作。我们使用Touched Up Inside事件来检测用户从对象上的点击中释放手指。我们使用Touched Up Inside而不是Touched Down Inside，因为Touch Down事件在用户触摸对象时立即被调用。这可能会给用户带来令人不适的体验，因为意外点击在触摸下更可能发生。将事件的动作更改为执行 JavaScript：

5. 代码编辑器将出现；删除// Code here占位符注释并添加以下内容：

   // Set the mail composer listener to an empty function
   window.ad.mailComposer.listener = function(){ };
   
   

6. 这将我们的广告的mailComposer对象的监听器属性设置为空函数。监听器是当另一个动作完成时被调用的函数；例如，当电子邮件成功发送或由于任何原因失败时，我们的监听器会被调用。目前，我们只是使用一个空函数，因为我们不需要以不同的方式处理发送错误或成功。如果没有空函数，我们的广告会崩溃，因为它会尝试找到不存在的东西。

7. 让我们设置我们的收件人电子邮件地址，这是将接收任何预订的电子邮件账户。在我们的监听器之后添加以下代码，并将your@emailaddress.com更新为您的电子邮件地址，以便您稍后能够测试它是否工作：

   // Set our recipient email address for the mail composer window.ad.mailComposer.toRecipients = ["you@emailaddress.com"];
   
   

8. 注意到方括号吗？它们表示方括号内的内容是否为数组。把它想象成一个包含在方括号内的项目列表。数组中的每个项目都由逗号分隔，所以如果你想包括多个收件人，你会使用["recipientOne@email.com", "recipientTwo@email.com"]等等。

   注意

   尽管我们只传递了一个项目给收件人，但我们仍然必须使用数组，因为toRecipients属性期望的是数组。

9. 在设置收件人列表后，我们可以设置电子邮件的subject属性，同时在编辑器中继续构建代码，添加以下内容：

   // Set the email subject property
   window.ad.mailComposer.subject = "I'd like to book a flight!";
   
   

10. 这只是将我们的广告的邮件编写器的subject属性设置为字符串——一个包含引号的文本块。我们将预先填充正文——电子邮件的主要内容：

    //Set the message body using the mailComposer function
    window.ad.mailComposer.setMessageBody( "I'd like to book a flight..", false );
    
    

11. 与我们的其他属性不同，正文文本不是使用=赋值来设置，而是通过添加两个括号内的值来设置。这些括号内的项目被传递到邮件编写器的setMessageBody函数。它接受两个参数，该函数所需的项目，在这种情况下，一个用于正文文本的字符串，以及一个表示正文文本是否为 HTML 字符串的布尔值。布尔值是一个简单的是或否开关，分别使用true或false。如果我们想在电子邮件中添加 HTML 网页内容，我们可以使用<img src='http://awebsite.com/animage.png' />作为字符串，并将布尔值设置为true。这将在我们的电子邮件中显示一个图片。

    注意

    要调用或调用一个函数，你使用函数名后跟()。JavaScript 函数也可以是属性，这就是为什么window.ad.mailComposer.setMessageBody需要使用括号(和)包裹的值来设置。

12. 当我们为mailComposer属性设置了所有必需的信息后，现在可以向用户展示邮件编辑器视图。将以下代码行添加到编辑器中：

    // Show the user the mail composer window
    window.ad.mailComposer.presentComposer();
    
    

这只是调用了邮件编辑器的presentComposer函数，它告诉 iOS 设备显示电子邮件窗口，并将其预先填充为我们设置的值。

注意

注意代码是如何从屏幕左侧缩进的；函数内的每一行代码都应该缩进四个空格以提高可读性。你可以通过按键盘上的制表符键一次来使用这个快捷键。

发生了什么？

由于所有这些代码都发生在我们按钮的onTouchUpInside事件函数中，所以每行代码都是逐步执行的，最后一步调用一个显示带有预填属性的电子邮件编辑器的函数。

在创建我们的电子邮件时，我们使用了数组、字符串和布尔值来定制消息编辑器，以包含我们自己的所需内容。

iOS 模拟器通常不会发送电子邮件。当你点击发送时，消息会被静默丢弃，并显示成功消息。为了测试你的电子邮件能否送达收件人，你需要在配置了电子邮件账户的设备上进行测试：

尝试一下英雄

现在用户无需离开我们的广告就能联系我们，真是太好了，为什么不尝试以下方法：

• 在我们的电子邮件中发送一张图片；你需要有一个托管在网上的图片的 URL。

• 将邮件编辑器改为发送短信。如果你需要一些提示，可以查看第六章的最后练习，广告目的地和操作。

• 确保函数内的所有代码行都缩进四个空格/一个制表符。

• 如同往常，我们的广告需要一些样式来更新我们添加的库存对象。

行动时间——给我们的电子邮件添加一些额外内容

虽然我们的电子邮件联系表单已经符合用途，但我们仍然可以添加一些额外的润色和整洁的功能（就像我们一直在做广告的视觉方面一样）。由于立即预订按钮位于商店详情页上，让我们让电子邮件正文包含所选商店的名称：

1. 在 iAd Producer 中打开Cloud 9 - iPad项目，并在画布上打开预订航班页面的地图详情视图。

2. 我们需要回到代码编辑器，找到我们在上一个练习中添加的代码。在 预订航班 按钮被选中时，从菜单栏点击 代码 | 显示代码编辑器。这将打开代码编辑器，您可以向下滚动以找到函数 this.onViewTouchUpInside。当一个控件只有一个函数或事件添加到它上面时，这个技术很简单。然而，如果我们的控件有多个事件，我们的文件可能会很快变得拥挤。要直接在函数中打开代码编辑器并聚焦，请选择按钮对象，然后右键单击并选择对象事件，然后 触摸内部，最后 执行 JavaScript。您会看到已经分配了函数的事件旁边有一个实心点，而空事件旁边有一个空圆圈，如下截图所示：

3. 在打开代码编辑器并将位置定位在事件函数上时，我们可以修改一些代码，将商店名称添加到电子邮件消息正文中。在设置电子邮件主题后直接添加以下代码：

   //create our message variable
   var message = "I'd like to book a flight at " + this.viewController.annotation.title;
   
   

4. 这创建了一个名为 message 的变量，其中包含文本 我想预订航班 与地图引脚注释的文本相结合。我们使用 + 来连接两个字符串，并访问地图引脚的 title 属性来构建我们的消息。现在我们有了包含组合字符串的 message 变量，我们需要将其传递到我们的电子邮件正文中。

5. 要在我们的电子邮件正文中设置新的动态文本，我们需要从 .setMessageBody 中移除字符串，并用我们的 message 变量替换它。您应该更新您的消息正文函数以匹配以下行：

   //Set the message body using the mailComposer function
   window.ad.mailComposer.setMessageBody(message, false);
   
   

6. 在更新此消息正文函数后，此代码将消息正文设置为我们在 message 变量中创建并存储的字符串。

   注意

   确保您也从 .setMessageBody 函数中移除引号 ""。引号内的变量名将导致变量名出现，而不是变量值。

7. 您最终更新的触摸事件函数应如下截图所示：

8. 现在测试广告。打开商店详情查看页面，点击 预订航班！ 按钮。您会看到主要电子邮件正文文本是动态设置为商店的标题。

注意

在模拟器中测试时，请确保您从广告概览中点击 模拟 按钮，而不是商店查找画布。直接从画布打开会导致广告崩溃，因为它不会加载用于注释标题的正确引脚数据。

刚才发生了什么？

我们通过将用户正在查看的当前航班中心添加到消息正文中，使我们的电子邮件更加动态；这应该允许更好地管理用户收到的电子邮件。

通过触发按钮的 Touch Up Inside 事件，我们将消息字符串与动态的 pin 注释属性结合在一起，这意味着我们的电子邮件正文文本会更新为用户当前查看的商店名称。

尝试一下英雄

如果您对到目前为止我们使用的 JavaScript 代码感到舒适，您可以尝试通过以下方式进一步扩展它：

• 将地址添加到消息字符串中。提示：您可以使用 this.viewController.annotation.address 访问注释的地址。

• 留空收件人数组并创建一个 分享给朋友 按钮，以便可以将特定商店与朋友分享。要创建一个空数组，只需不要在 [] 中添加任何属性即可。

• 在收件人数组中包含一个额外的电子邮件地址，以便电子邮件分发到您公司中的两个人。

突击测验 — 变量

变量是存储 JavaScript 中的值的好方法，可以帮助保持我们的代码可读和清晰。看看您是否能够识别这些不同的变量类型和用途：

1. 以下哪种方式是声明变量名 cyril 并赋予字符串 the squirrel has lost his nuts 的正确方法？

   • a. var cyril = "the squirrel has lost his nuts";

   • b. 变量 cyril = "the squirrel has lost his nuts";

   • c. cyril = "the squirrel has lost his nuts";

   • d. "cyril" = the squirrel has lost his nuts;

2. 以下哪种方式是显示布尔值的正确方法？

   • a. 是/否

   • b. 是/否

   • c. 开/关

   • d. 是/真

添加日历条目

iAd JavaScript 库允许我们向用户的日历添加事件；这可以让我们留下某些时间敏感的折扣或促销活动的提醒。

使用日历的行动时间

使用我们的 Cloud 9 - iPad 项目，我们将添加一个事件页面，其中包含一个按钮，该按钮会将事件添加到用户的 iPad 内置日历中：

1. 打开 Cloud 9 - iPad 项目，并在广告中添加一个空白页面。将一个按钮添加到主菜单轮播图中，该按钮指向此页面。如果您需要提醒如何操作，请回到第七章，为大屏幕构建。将页面命名为 Events。使用按钮图像 events-button.png 并将其放置在占位符云单元格之一，例如 Cell 4，如图所示：

2. 在广告画布上打开新的 Events 页面，并从对象库中将一个按钮添加到画布中。将按钮中的文本更改为 添加到日历。

3. 在选择按钮后，为当对象被 Touched Up Inside 时添加一个 Execute JavaScript 事件。删除占位符注释并添加以下代码行：

   //Convert readable date into milliseconds
   var startDate = Date.parse("Tue, 16 Aug 2011 13:30:00 GMT");
   
   

4. 使用 Date.parse 函数，我们将可读日期转换为 JavaScript 可以理解的格式。JavaScript 使用自 1970 年 1 月 1 日 00:00:00 UTC 以来的毫秒数来计算其日期和时间。

5. 我们需要将 JavaScript 时间转换为 iAd 和 iOS 可以理解的形式。我们将使用Date函数来完成这项工作。直接在最后两条语句之后添加以下代码：

   // Convert milliseconds to a date object
   startDate = new Date(startDate);
   
   

6. 这将从 JavaScript 理解的毫秒时间创建一个新的date对象。date对象有一系列我们可以使用的函数，可以将日期转换为各种格式。

   注意

   注意，这次我们在startTime变量名之前没有包含var。这是因为你只需要在第一次创建变量时声明var。

7. 使用我们刚刚创建的date对象，我们可以访问 iAd 日历所需的日期的 ISO 日期字符串。继续将以下代码添加到我们的代码中：

   //Get the ISO string for the date
   var startDateISO = startDate.toISOString();
   
   

8. 这访问我们的startDate日期对象并调用其toISOString函数；然后我们将此值保存在变量startDateISO中。ISO 日期字符串是一个国际化标准，由我们的 iAd 用于创建日历日期。我们本可以直接跳过这些步骤并直接创建 ISO 日期字符串。然而，与更易于管理的可读日期一起工作会更好。例如，我们开始时间的 ISO 日期是2011-08-16T13:30:00.000Z。

9. 在我们的开始日期以正确格式的情况下，我们还需要为我们的活动创建一个结束日期和时间。我们将以与开始时间完全相同的方式执行此操作，但使用未来的不同时间。添加以下代码块：

   // Convert readable date into milliseconds
   var endDate = Date.parse("Tue, 16 Aug 2011 20:30:00 GMT");
   // Convert milliseconds to a date object
   endDate = new Date(endDate);
   // Get the ISO string for the date
   var endDateISO = endDate.toISOString();
   
   

10. 正如我们对开始时间所做的那样，我们现在有了事件结束时间的 ISO 日期字符串。

    注意

    要更新您自己的事件，您需要在Date.parse()函数中调整开始时间和结束时间。使用前面的示例作为模板来设置时间。要指定不同的时区，您可以在GMT之后添加偏移量。例如，GMT+0430将使时间比格林尼治子午线东四小时半，而GMT-400将使时间比 GMT 西四小时，并给您美国东部时间。

11. 我们的日期已经准备好了，现在我们可以创建 iAd 框架所需的事件对象。将以下代码添加到您的touch Up Inside事件函数的末尾：

    // Setup the event object
    var theEvent = {
    "description": "Aviation Awards 2011",
    "location": "Brighton, UK",
    "summary": "Acrobatics and airplanes!",
    "start": startDateISO,
    "end": endDateISO
    };
    
    

12. 此对象包含创建事件所需的属性和值列表。我们可以将startDateISO和endDateISO值添加到我们的对象的start和end属性中。

13. 在我们能够显示日历窗口之前，我们需要告诉广告在哪里定位日历弹出视图。弹出视图是一个仅在 iPad 上使用的元素，它覆盖在其他用户界面对象之上，通常出现在激活它的按钮旁边。我们需要获取按钮的位置并稍作调整，以便在正确的位置显示日历弹出视图。假设您的按钮位于屏幕中央，请返回到 iAd Producer 画布并选择按钮对象。打开检查器面板并展开布局部分：

14. 我们可以使用这些布局指标来计算我们的弹出窗口的 X 和 Y 位置。X 位置是指我们的弹出窗口应该从左侧显示多远，Y 是指从设备屏幕顶部应该有多少距离。为了计算 X 位置并使我们的弹出窗口看起来在按钮的右侧，我们取左值，在这个例子中是394，然后加上宽度，在这个例子中是236，得到最终的 X 值为630。我们希望弹出窗口出现在按钮的右中心，所以我们的 Y 值是通过取顶值，在这个例子中是360，然后加上按钮高度的一半，在这个例子中是24，得到最终的 Y 值为384。有了这些值，我们可以创建我们的位置对象，并将以下内容添加到函数中：

    // On iPad so set the position for the popover
    var calPosition = {
    'x':630,
    'y':384
    };
    
    

15. 因为我们使用的是整数——数值，而不是字符串，所以我们不需要用引号将我们的位置值括起来。

    注意

    由于这仅在 iPad 上必要，因此对于 iPhone 广告，我们会将calPosition留空，因为添加日历事件时它使用整个屏幕。记住，如果你移动你的按钮，你也必须更新这些值。

16. 我们将快速创建一个空监听器，就像我们为电子邮件编辑器所做的那样。我们不需要任何关于成功或失败日历事件的反馈，所以我们只需使用以下内容：

    // Empty listener
    var listener = {};
    
    

17. 这将防止日历不显示，因为它找不到监听器。

18. 在设置好所有对象之后，我们最终可以告诉 iAd 框架显示弹出窗口。将以下代码行添加到函数的末尾：

    //show the popover
    ad.calendar.presentComposer(theEvent, listener, calPosition);
    
    

19. 这告诉我们的广告日历显示事件弹出窗口，并传递我们创建的事件对象、空监听器和弹出窗口在屏幕上的位置对象。

20. 保存项目，然后测试你的新按钮！你的最终代码应该看起来像以下截图：

发生了什么？

使用 JavaScript 中的 Date 对象，我们将可读的日期转换为我们的 iAd 和 iOS 设备可以转换成机器可读格式的格式。通过创建两个日期，用于事件的开始和结束时间，然后设置一个事件对象，我们可以将其传递给设备。这个事件对象包含了事件的详细信息以及我们转换的开始和结束时间。最后，由于我们的广告是为 iPad 设计的，我们必须设置一个对象，定义弹出窗口在屏幕上的 X 和 Y 位置。我们的弹出窗口日历将看起来像以下截图：

弹出窗口给用户提供了编辑事件、使事件重复或添加闹钟以提醒他们的机会。一旦用户点击，事件就会被添加到他们设备内置的日历应用中，确保我们在用户关闭我们的广告后仍然与他们保持联系。

在 iPhone 上，我们不需要设置弹出视图的坐标并留空位置对象，因为 iPhone 会自动用我们的日历视图填满整个屏幕。

尝试一下英雄

在空白页面的中间放置一个按钮并不很有吸引力，也不太可能激发用户将事件添加到他们的日历中。用一些关于事件的图片和信息让你的页面更有趣，例如，为什么不尝试以下方法：

• 添加一个或多个过去事件的图片

• 使用包含事件详细信息的标签

• 更新页面背景，使其与我们的广告其余部分相匹配

• 不要忘记包括一个返回按钮，以便用户可以返回主菜单！

播放音频

iAd Producer 有一个音频对象，用户可以点击播放按钮来听我们广告中包含的音频文件。这对于歌曲和声音剪辑非常有效，但我们也可以从 JavaScript 触发音频剪辑。由于我们使用 JavaScript 播放音频文件，因此我们可以使用广告中的任何事件来启动音频。

行动时间 — 控制音频播放器

让我们结合对象库中的音频对象和一些 JavaScript 代码，以便每次用户摇动设备时播放音频剪辑：

1. 我们将使用本书开头构建的示例项目 Dino Stores，并在每次摇动我们的 Shake to Change 展览时让恐龙咆哮。现在在 iAd Producer 中打开项目。如果您尚未完成项目，可以使用 Dino Stores 练习文件夹中的 6.Dino Stores - Store Finder。

2. 在画布上打开 Shake to Change 页面。从对象库中添加一个音频对象到画布，并将其放置在屏幕之外，以便用户看不到它。

3. 选择对象后，展开检查器面板并选择 roar-noise.m4a 作为音频剪辑的文件，如图所示：

4. 通过点击恐龙图像选择摇动视图对象。右键单击它并选择 对象事件 | Did Shake | 执行 JavaScript。这将打开代码编辑器并为该事件添加一个占位符函数。

5. 当摇动事件发生时，我们希望我们的音频对象播放，因此将以下 JavaScript 添加到函数中：

   this.viewController.outlets.audio.play();
   
   

6. 这只是从我们的页面获取音频对象并调用其 play 函数，令人惊讶的是，这将使我们的音频剪辑播放！请确保对象检查器中的输出值设置为 audio。如果它是页面上唯一的音频对象，则默认情况下应该是这样的。

7. 关闭代码编辑器并测试广告。导航到 Shake to Change 页面然后摇动设备。当页面改变时，你会听到恐龙咆哮。

刚才发生了什么？

通过在我们的页面上添加音频对象，我们可以通过其outlet属性使用 JavaScript 访问它。我们将音频对象从画布上移除，因此它包含在页面中但不可见给用户，当我们的摇动视图的摇动事件发生时，我们调用了音频对象的play函数。你可能会注意到第一次摇动设备时会有延迟，因为音频正在加载，但随后的摇动将使音频立即播放，因为设备会将其缓存。为了最小化延迟，请保持音频短小并优化，因为显然，较小的文件比较大的文件播放得更快。

使用 Twitter 发推文

当苹果公司在 2011 年秋季发布 iOS 5 时，他们包括了从操作系统的各个部分直接推文文本、链接和图像的支持。这种Twitter支持已扩展到我们的 iAds，并且由于其分享范围，它是一个伟大的营销工具。

Twitter 是一个流行的微博服务，用户可以向关注或订阅他们的人发送简短、及时更新，这些更新限制在 140 个字符以内。

行动时间 — 发推文

由于并非每个设备都一定运行 iOS 5，我们将创建一个检查以确保设备支持 Twitter，然后让用户发推文并分享关于我们品牌的更新：

1. 打开我们在上一个练习中使用的Dino Stores项目。我们将在菜单屏幕上添加一个按钮，该按钮将打开 Twitter 对话框。在画布上打开菜单页面，然后从对象库中拖动按钮。

2. 将菜单放置在页面底部附近，并扩展以填充宽度。更新文本，例如使用行动号召，如推一个恐龙事实！。你的按钮可能看起来像以下截图：

3. 点击并选择按钮，然后选择执行 JavaScript作为内部触摸动作以创建事件并自动打开代码编辑器。

4. 删除占位符注释//Code here，并用以下代码替换：

   if(window.ad.twitterComposer) {
   window.ad.twitterComposer.text = 'The longest dinosaur was Seismosaurus, was as long as five double-decker buses - Dino Stores';
   window.ad.twitterComposer.URLs = ['http://www.bencollier.net/'];
   window.ad.twitterComposer.present();
   }
   
   

5. 这将检查 Twitter 作曲家是否可用，然后添加将要发推文的文本和 URL。在if(window.ad.twitterComposer)之后的括号内的任何内容，只有在 Twitter 作曲家对象存在时才会运行。现在我们可以添加一个else代码块，如果 Twitter 作曲家不可用，它将运行。

6. 在我们刚刚添加的代码之后立即插入以下内容：

   else {
   alert('You need iOS 5 with a Twitter account to send this tweet');
   }
   
   

7. 这只会在之前的检查没有找到 Twitter 作曲家可用时运行；并将向用户显示一个警告。

8. 我们可以在 iOS 模拟器或设备上测试我们的广告。你需要确保你的 iPhone 或 iPod 运行 iOS 5，并且你已经配置了你的 Twitter 账户。当使用模拟器时，你可以通过 iAd Producer 更改其运行的 iOS 版本。从菜单栏选择导出 | 模拟器 iOS 版本 | iOS 5.x。保存你的项目并点击模拟按钮。

   注意

   要在 iOS 设备或模拟器上登录 Twitter，请打开设置应用，然后选择Twitter。您将被提示输入用户名和密码，如果您还没有，您还有机会创建账户。

9. 点击推文按钮现在将打开我们配置的Twitter 编辑器窗口：

10. 如果您看到我们的错误警报信息出现，请确保您正在使用 iOS 5，并且您的账户配置正确！您可以使用 iTunes 升级您的设备。

刚才发生了什么？

使用 iOS 5 中引入的 Twitter 编辑器，我们发布了一条带有链接的基本文本推文。如果我们尝试在用户不在 Twitter 支持设备上时访问 Twitter 编辑器，我们的广告可能会崩溃。因此，当针对较旧的 iOS 版本时，检查其可用性是至关重要的。

尝试一下英雄

如果您对您的 Twitter 代码有信心，考虑如下改进：

• 将模拟器版本更改为 iOS 5 之前的版本，以便您可以测试回退消息。

• 对于更高级的用户，考虑在 Twitter 编辑器不可用时隐藏按钮。我们可以使用页面事件viewControllerViewDidAppear，我们之前使用的if语句，并将按钮输出端的hidden属性设置为true。

调试器

我们并不都是完美的，有时我们在编写 JavaScript 代码时会犯错；幸运的是，iAd Producer 有两个内置工具，用于突出显示和发现您代码中的错误。

错误检查语法

如果您的代码语法有错误——定义您代码结构的规则，当您尝试保存该 JavaScript 文件时，iAd Producer 会提示您。iAd Producer 会识别出错误发生的行，并允许您保存文件（不推荐）或编辑它。

您应该检查的一般语法错误包括：

• 忘记在行末加上分号。

• 没有使用逗号分隔对象或数组值。

• 在数组或对象中的最后一个项目后包含一个逗号。例如，['item one', 'item two', last item',] 将是不正确的，因为末尾有一个多余的逗号。

• 使用错误的案例。JavaScript 及其变量是区分大小写的，所以thisVariable和ThisVARIABLE被认为是两个不同的值。

• 忘记关闭括号或大括号。

使用调试器

如果您的代码在语法上是正确的，但在运行时出现错误，调试器窗口将出现并突出显示发生错误的代码行。例如，如果我们尝试访问一个尚未分配值的变量，我们可能会发现调试器显示访问未定义函数或值的警告。

如果你熟悉开发，你可以在代码的特定部分设置断点以暂停广告。要设置这些断点，只需双击你想要暂停的行号。然后，你可以在 iAd Producer 中使用继续按钮来恢复 JavaScript 的执行。

编码规范

当你编写 JavaScript 代码时，你应该确保它符合开发者使用的某些基本规则和最佳实践：

• 使用我们之前在本章中讨论的驼峰命名法，用小写字母命名起始变量。变量名应该是详尽的，并且与它们所持有的数据相关。

• 注释你的代码，以便你在重新访问代码时能理解，并对未来可能查看它的其他开发者来说清晰易懂。

• 每个语句都以分号结束。

• 使用Tab键或四个空格将函数内的代码缩进。注意第二个示例如何更易于阅读和清晰：

尝试一下英雄

学习了一些示例代码片段、代码应有的风格以及如何识别和修复代码中的错误后，你可以为我们迄今为止创建的其他示例项目添加一些增强功能。你可以：

• 在Coffee Beans项目中为摇动视图添加音频片段

• 在Cloud 9 - iPad项目中添加多个事件按钮到即将到来的事件页面，每个按钮创建具有不同时间和详细信息的日历事件

• 这应该展示了如何在单个页面的 JavaScript 文件中存在多个事件函数

注意

当你在屏幕上有多按钮时，可能需要考虑重命名你的按钮输出。这将使在 JavaScript 文件中的函数之间导航更容易。

• 阅读 Apple 文档以了解 JavaScript 在您的 iAd 中的其他可能性，可在developer.apple.com找到

• 使用你迄今为止学到的各种技术，为你的产品或品牌创建一个全新的广告

摘要

JavaScript 是一种非常强大且灵活的语言，与 iAd JS 框架结合使用，可以创建一些令人惊叹的动态和丰富的广告。在本章中，我们只简要介绍了通过简单的代码片段扩展我们的 iAds 的潜力，这些代码片段允许我们：

• 编辑在 iAd Producer 检查器面板中未向我们暴露的对象的值

• 将事件添加到用户的日历中，并在他们离开我们的广告后继续提醒他们

• 使用动态内容发送电子邮件，让用户联系我们

• 使用代码编辑器和调试器来捕获常见错误

当我们的广告看起来很棒，具有丰富的交互性，并为我们的用户提供难忘的体验时，让我们来看看管理成功的 iAd 活动的后勤工作。

第九章. 管理成功的 iAd 宣传活动

您能够制作出令人惊叹的 iAd，在 iPhone 和 iPad 上令您的受众惊叹。现在您需要了解如何管理一个成功的宣传活动，该活动能够触及目标人口统计，符合预算，并且有可衡量的成功衡量方式。

在本章中，我们将探讨确保您从 iAd 活动中获得最大收益所需的技能，例如以下内容：

• 针对特定受众定位您的广告

• 理解定价模型和成本

• 在您的广告中关于用户互动的报告和分析

• 启动广告并完成最终提交前的检查

寻找您的受众

使用 iAd，我们能够运行需要用户或广告出现的上下文满足特定标准以针对您的理想受众的宣传活动。

寻找您的目标受众可能很复杂，因为有许多影响因素可能会对您的产品或品牌感兴趣。

注意

您的目标市场可能并不一定是您预期的或希望它成为的那样！因此，在启动您的活动之前，请确保您了解您应该针对哪些受众。

如果您有现有的客户群，您可以对他们进行画像以识别趋势和共同兴趣；考虑进行简短的客户调查并询问他们问题，或者举行焦点小组。尽管找到目标市场很重要，但请确保在尝试从他们那里获取信息时不要惹恼您的现有客户群！

当您知道可用的定位选项时，您可能需要调整您的市场研究。让我们看看不同的定位类型。

定位

当市场定位明确后，您将能够定制和调整您的活动以最大化其效率。这将通过获得更多有用的用户参与，并针对可能对您的广告和品牌感兴趣的相关人口统计来增加您的 iAd 曝光价值。广告可以通过情境或行为数据来定位，以触及最有可能对您的 iAd 感兴趣并参与的用户群体。

情境广告

情境广告假设广告的相关性是因为它出现的上下文必须对用户在查看或使用时具有吸引力。情境广告的最佳例子是网站上的赞助链接。它们通常分析页面内容，并通过寻找共同的关键词来捕捉一般主题或上下文。

以下截图显示了使用情境定位放置广告的示例网站。当页面加载时，它会检查页面的主要内容，并挑选出常见的单词和主题，并从广告网络中获取它认为可能相关的任何广告：

您会发现它们通常并不完美；例如，一个提到摇滚乐多次的网站可能会生成关于 AC/DC 和下一个关于在南达科他州意外发现的火山岩形成的公共会议的广告。

行为定位

行为定位根据用户的行为分析和建立用户档案，这些行为是广告网络可以访问的。用户的网络之旅可以在他们访问不同网站或进行搜索以寻找趋势时进行跟踪，然后广告网络可以汇总这些趋势并据此对用户的人口统计和兴趣做出明智的猜测。

广告网络特别使用行为定位，因为它们能够跟踪用户在他们广告网络中的网站之间导航时的行为。例如，如果用户访问了一个关于潜水网站的页面，然后是酒店网站，最后是航空公司预订页面——他很可能要去度假。广告提供商然后基于这个假设开始在非假日相关网站上展示关于旅行的广告。它使用与上下文定位类似的技术来突出页面上的关键词并衡量一个共同的主题。

注意

广告网络使用有争议的跟踪 cookies——一种保存在您电脑上的小文件，用于保存匿名会话和状态数据。Cookies 通常用于保持您登录到网站或记住购物车中的内容，但广告商可以使用相同的技巧匿名识别从网站到网站的访客。

iAd 定位

iAd 结合了上下文广告和行为定位，以帮助您找到最适合您的 iAd 的相关和有价值的目标受众。您的广告可以指定它将在哪些应用类别中显示，或针对用户对应用类别的普遍偏好。

多亏了苹果通过 iTunes 商店账户和设备信息对用户进行用户画像，我们能够根据以下用户行为和信息来定位我们的活动：

• 人口统计

• 应用偏好

• 音乐兴趣

• 电影、电视和有声书兴趣类别

• 位置

• 设备（iPhone、iPad 和 iPod touch）

• 网络（Wi-Fi 和 3G）

通过人口统计，您可以根据人群进行定位，能够通过年龄、性别和其他信息匿名过滤用户，这些信息可在他们的 iTunes 个人资料中找到。位置在您没有全球品牌存在时是理想的，因为您能够按国家或地区进行定位。如果您在您的应用内销售数字商品，您应该只针对您的应用或内容可用的国家进行定位。

应用偏好使用用户的下载历史来估计他们感兴趣的应用类别。这，结合音乐、电影、电视兴趣和一些假设，可以是一种找到符合您理想客户用户的好方法。

您将需要与您的 iAd 代理协商以设置和调整您的活动，并尽早与他们联系，讨论并获取他们对将为您的活动提供的标准定位的反馈。

定价模型

在电视和广播广告中，我们不确定观众或听众对我们活动的参与程度；他们的注意力可能（并且经常是）在其他地方。在 iAd 中，我们几乎可以保证用户沉浸在内容中，因为他们已经选择与之互动。这使得 iAd 的每次互动成本更有价值。通常，你会发现你为针对更受欢迎的受众群体的广告支付的费用更高，但如何衡量和向你收费取决于所使用的定价模式。

移动广告遵循的定价模式与您可能熟悉的互联网频道类似。如果您不熟悉，或者想要复习一下，我们将探讨当前的模型和一系列缩写词。

每千次展示费用（CPM）

每千次展示费用（CPM）是指你为广告展示付费。千是拉丁语中的“一千”，因此 CPM 是指向 1000 名观众展示你的广告横幅或链接的费用。

注意

CPM 经常与每百万费用混淆。确保你不会混淆它们，否则你的活动看起来会比实际便宜得多！有时 CPM 被称为 CPI 或每次展示费用。

CPM 是广告中最常见的定价模式，因为它可以轻松地映射到传统的印刷或电视广告，其中销售的副本或收视率将用于确定观看广告的有效观众数量。“观众”是广告行业为他们的广告观众创造的术语。在 iAd 中，我们称与我们的广告互动的人为用户，因为他们比基本观众更重要和投入，这要归功于 iAd 引人入胜的广告。使用 CPM，你支付的是向观众展示你的横幅的费用，无论他们是否决定点击或轻触它。

我们可以通过将 CPM 价格除以 1000 来计算我们广告的每次展示费用。例如，一个 CPM 价格为 20 美元的活动将代表每次用户查看你的广告横幅时支付 0.02 美元的费用。

按点击付费（PPC）

我相信随着时间的推移，我们会称之为按轻触付费，但在这个模型中，你每次用户点击你的网站链接或轻触你的广告横幅时都要付费。每点击费用（CPC）是每次点击（或轻触）的平均费用。无论你的横幅收到多少次展示，你只需在横幅被轻触且广告打开时付费。按点击付费可能比 CPM 更有价值，因为你只需在用户表现出兴趣并轻触你的横幅开始与你的品牌互动时付费。

按点击付费有两种子定价模式，即固定费率或基于出价。

固定费率 PPC

固定费率按点击付费是在广告商（你）和发布商（比如，苹果）之间预先约定的费率。在固定费率下，你将确切知道每次轻触你的横幅将花费你多少钱。

例如，如果你的 PPC 费率是 1.50 美元，并且 1000 名用户轻触你的横幅，你将不得不支付 1500 美元，无论你的横幅收到多少次展示。

按点击出价（Bid PPC）

在按点击付费的出价中，您与其他广告商进行横幅位置的竞价战。您决定愿意为每次点击支付的最高金额，发布网络在显示横幅时更频繁地选择最高出价者。您仍然只需在用户点击您的横幅时付费，而不是每次展示时付费。

如果您愿意为每次点击支付更多费用，那么广告网络更有可能展示您的横幅而不是竞争对手的横幅。您通常只需支付比您低一位的出价者略高的费用，而不是您的最高出价。

每次点击的最高出价为 2 美元，如果收到 1000 次点击，费用可能从 10 美元到 2000 美元不等。

当您针对具有少量竞争广告商的利基市场时，按点击付费的出价可能具有成本效益。

每次行动成本 (CPA)

每次行动成本(CPA)与 PPC 类似，但这次您是为用户的转化或行动付费。这可能包括支付以在 Facebook 上获得更多粉丝、在 Twitter 上获得更多关注者或注册您的邮件列表。

例如，如果您愿意为每次用户通过您的广告下载售价 2.99 美元的应用程序支付 0.50 美元，那么实现 1000 次销售将花费您 500 美元。

iAd 的定价模式

iAd 采用混合模式，您需要为一定数量的展示次数付费，并且为打开广告的每次点击/触摸额外付费。这实际上是一种固定费率的 PPC 与 CPM 的结合。

您可以预期支付大约 10 美元的 CPM，即每次横幅展示 0.01 美元，以及大约 2.00 美元的 PPC。要了解定价和最低活动承诺的详细信息，请联系苹果公司advertising.apple.com，因为价格会根据活动以及品牌规模的不同而有很大差异。

在 iAd for Developers 中，苹果公司提供的基本 iAd 用于在 App Store 上推广应用程序的方案，苹果公司通常运营一个独家 CPC 模型。只需为点击付费，而不是展示次数，这降低了进入门槛，CPC 大约为 0.25 美元。然而，您无法修改 iAd 开发者广告模板除横幅之外的部分，因此您的广告与 iAd Producer 广告相比将缺乏如此吸引人的体验。

衡量成功

iAd Producer 内置了分析日志系统，默认情况下，它会监控和捕获匿名用户数据。这些数据被发送到 iAd 网络，苹果公司将其汇总以生成丰富的报告，您可以通过这些报告来监控广告的参与度和成功率。

默认情况下，iAd Producer 启用了实时广告的日志记录功能，但我们能够查看开发广告的原始数据，并对其进行调整以提供对 iAd 项目的更深入分析。

行动时间 — 查看日志

在我们开发广告时，我们可以使用几行 JavaScript 查看将发送到 iAd 网络的日志。要查看日志，请按照以下步骤操作：

1. 在 iAd Producer 中打开现有项目。在这个例子中，我们将使用本书前面已经讨论过的Dino Stores iPhone iAd。

2. 我们需要启用某些对象和页面以进行分析事件。这意味着我们的分析只包含我们选择的有意义的数据。打开广告画布上的菜单页面，并展开检查器面板。点击分析以展开它，并勾选记录分析事件框。日志 ID会自动从页面名称生成。所以，如果你给你的页面起了有意义的名称，你可能不需要更改它。你可以在以下截图中看到分析部分：

3. 当你选择单个对象时，检查器面板的分析部分也会出现，这样你就可以在页面中激活某些对象以生成日志事件。

4. 返回广告概览，从菜单栏中选择代码 | 项目事件，然后选择执行 JavaScript，最后选择adDidFinishLaunching。这将打开带有占位符函数的代码编辑器。将//code here注释替换为以下行：

   iAd.Analytics.sharedObject.logsToConsole = true;
   
   

5. 这告诉 iAd 的内置分析在调试控制台中显示，这样我们就可以预览正在记录的数据类型。

6. 通过从菜单栏中选择代码 | 显示调试器来打开调试器窗口。

7. 在 iOS 模拟器中打开广告，通过在主 iAd Producer 窗口中点击模拟按钮。

8. 将 iAd Producer 调试器窗口置于焦点，并查看你与广告交互时的运行日志面板。你可能需要重新定位 iOS 模拟器和调试器窗口，以便同时看到它们，如以下截图所示：

9. 我们可以在这里看到日志；例如，看看以下日志片段：

   iAd Content: [ANALYTICS]: {"v":"1.4.1","1324329243506":{"an":"transition","at":"view","as":"Menu"}}
   
   

10. 这显示了菜单视图控制器出现的事件。不用担心这不太容易阅读。这是发送给苹果的数据，苹果将对其进行处理和汇总，使其更易于理解。

11. 现在，继续处理你的 iAd 项目，为任何剩余的对象和所有你想要跟踪的页面启用分析。通常，你希望记录尽可能多的事件。尝试与不同的对象交互，查看它们生成的事件。

注意

确保在发布广告之前禁用此日志记录。一旦发布，你的广告将始终提交此日志数据。这个标志仅会导致日志出现在调试器中。每次日志出现在调试器中，都会有一定的性能成本，这就是为什么我们应该在提交之前删除不必要的日志。要禁用日志记录，可以删除我们添加的代码或将true更改为false。

刚才发生了什么？

使用 iAd Producer 中的默认日志记录，我们预览了苹果记录并发送给 iAd 网络供我们稍后查看的信息。这种高级的事件记录意味着我们可以深入了解广告和品牌中最有趣和最受欢迎的部分。

定制日志

虽然 iAd Producer 提供的默认日志记录功能全面且有用，但我们能够修改其行为以更好地适应我们的广告。例如，默认情况下，iAd Producer 不会记录我们的自定义事件函数，但这很容易解决。

操作时间 — 定制日志

我们将定制我们的日志消息，以确保我们在稍后分析它们时它们是逻辑上可理解和有用的。为了定制日志，请按照以下步骤操作：

1. 我们需要一个包含自定义事件的 iAd Producer 项目。对于这个练习，让我们使用我们之前制作的Coffee Beans广告。

2. 选择一个设置了自定义事件的对象，例如，我们Coffee Beans项目菜单页面上的告诉朋友按钮。打开检查器面板，展开属性和分析部分。将出口名称更新为有意义的名称，例如tellAFriend。

   注意

   注意我们使用的是驼峰命名法来命名出口名称。因为出口在 JavaScript 中是公开的，所以我们应遵循与直接编写 JavaScript 相同的约定。

3. 现在，勾选日志事件复选框，以启用此对象的日志记录：

4. 您需要为每个希望跟踪数据的自定义对象执行此操作。开启日志记录到控制台分析选项（就像我们在上一个练习中所做的那样），您将在调试器中看到按钮的事件：

   [ANALYTICS]: {"v":1.4,"1310344477450":{"s":"12","n":"controlTouchUpInside","t":"iAd.Button","as":"tellAFriend","an":"tap","at":"gesture"}}
   
   

5. 在这里，我们可以看到controlTouchUpInside事件被调用。

注意

由于 iOS 模拟器不支持smsComposer函数，我们可能需要在touchUpInside事件中添加以下行：

//特征检测以在模拟器和 iPod touch 中停止广告崩溃

If (window.ad.smsComposer === undefined) return;

刚才发生了什么？

我们启用了我们添加到画布中的自定义对象的日志记录分析功能。iAd Producer 默认不会这样做，因此请确保您检查每个希望生成日志的交互对象是否已勾选。我们修改了日志中使用的 ID，使其在达到 iAd 网络并在报告中出现时更具可理解性和实用性。

随着收集和处理的庞大数据量，区分和识别常见区域可能会变得困难。幸运的是，我们可以将我们的 iAd 分析数据分组到不同的部分。

操作时间 — 使用部分

iAd Producer 允许我们将分析数据分段，以便更容易地分离结果。您无需修改任何 JavaScript 即可做到这一点：

1. 打开您想在 iAd Producer 中设置部分的工程。我们将继续使用上一个练习中使用的Coffee Beans广告。

2. 从广告概览中，点击一个页面，例如壁纸选择器，然后展开检查器面板的分析部分。点击部分下拉菜单，然后选择管理部分。

3. 点击弹出菜单底部左边的+按钮，并输入你的章节文本，例如可下载内容。

4. 选择应用以关闭菜单。现在，重新选择章节下拉菜单，将章节设置为可下载内容，对于所选页面。

5. 从广告概览中选择另一个相关页面，例如获取应用，并将它的章节设置为可下载内容。

   备注

   你不需要将章节应用于每个页面，只需应用于你希望在报告中分析的页面。

6. 打开日志记录（参见最后一个练习）并在 iOS 模拟器中打开你的页面。你会注意到页面生成的任何日志，包括对象特定事件，都将分组在你设置的章节中：

   [ANALYTICS]: {"v":1.4,"1310510020556":{"s":"8","n":"viewControllerViewDidAppear","t":"iAP.ViewController","as":"GetTheApp","an":"transition","at":"view","k":"Downloadable Content"}}
   
   

7. 注意到可下载内容部分现在出现在发送给 iAd 网络的请求中。

发生了什么？

在 iAd Producer 的分析选项中的章节字段中，我们在我们广告的两个页面上为我们的可下载内容设置了一个章节。这意味着由这些页面生成的任何分析日志，例如页面进入视图或用户与内容交互，都可以在 iAd 报告界面中进行筛选。虽然章节在较小的广告中可能看起来不是必需的或功能强大，但当你开始使用隐藏导航和高级页面结构来扩展 iAd Producer 的边界时，它将迅速变得至关重要。

这些数据由苹果公司收集和整理，并在报告中可用。你需要联系你的 iAd 账户经理以获取有关如何访问这些信息的说明。通过将数据分组到章节中，分析广告中受欢迎和吸引人的部分可以变得更加容易。你可以绘制趋势图，调整并更新你的广告和活动以匹配这些响应。例如，如果你注意到使用你的商店搜索的人比使用你的电子邮件分享功能的人多，你可以在商店搜索上投入更多精力，甚至考虑在热门地区开设更多商店。

快速问答——给你的广告章节命名

选择一个好的分析命名约定至关重要，因为一旦你决定了模式，更改它可能会出现问题，因为你将无法将其与现有数据映射。看看你是否能决定最佳的命名约定。记住，这些只是建议，并没有严格正确的答案！

1. 你在广告中有一个商店搜索页面和一个画廊；你会：

   • a. 不做任何事情；广告中只有两页，所以不需要章节。

   • b. 将商店搜索部分命名为联系我们，将画廊命名为画廊。

   • c. 将两个页面都归类到子页面章节下。

   • d. 添加一个商店和一个图片章节。

2. 以我们之前工作的咖啡豆示例项目为例。它有一个关于咖啡的信息页面，一个壁纸选择器，一个互动优惠券，一个商店搜索，以及在广告中的应用下载。你如何将这些内容分组到章节中？

   • a. 给每个页面一个部分，这样它们就容易被分离和识别。

   • b. 页面太多，尝试将它们分组将毫无意义。

   • c. 对于用户在产品上执行操作的页面，如商店查找或下载内嵌应用，使用User Actions，而对于如咖啡豆烘焙过程这样的信息页面，使用Information。

   • d. 根据内容类型分离页面；例如，将咖啡豆处理和壁纸选择器组合到Image Rich部分，将地图组合到Mapping部分。

尝试一下英雄——分析

分析对于衡量你的 iAd 活动成功至关重要，所以请确保你将其作为策略的一部分。你应该：

• 尝试分析你制作的其它广告。

• 查看为你的广告每个页面产生的分析。你可能需要重命名对象和页面，以便在以后处理时更有意义。你会发现 iAd Producer 提供的默认名称并不非常有用。

注意

确保对象和页面名称在广告之外也能理解；例如，将分享广告的按钮命名为tellAFriend而不是button1。

• 在你的广告页面中添加custom部分，以便将相似的数据分组在一起。花点时间考虑你的部分，因为这个功能可以成为一个有价值的工具。

上线

当你的广告看起来很棒，并且你对定价模型以及广告运行成本有清晰的理解时，我们就能采取最后一步，将我们的 iAd 在 iAd 网络上发布。

当你使用 iAd Producer 的本地共享测试广告时，你正在预览开发代码，这与 iAd 网络提供的广告使用的优化代码不同。在罕见的情况下，优化代码可能会引入错误，所以在将广告上传到 iAd 测试服务器之前，使用优化导出选项作为最终测试是个好主意。

注意

要导出广告的优化版本，从 iAd Producer 菜单栏中选择导出 | 导出到磁盘（优化）。如果你不记得如何导出并将优化广告传输到你的设备，请参阅第四章，确保它工作。

这里，我们可以看到我们项目的一个地图视图的未优化、导出的源代码：

当你导出你的广告 iAd Producer 的优化版本时，它使用几种技术来减小广告的大小并提高 iAd 的效率，例如：

• 移除不必要的空白：虽然你的代码中的空格使其更易读，但在无线传输广告到用户时，它们会浪费带宽。

• 将变量名更改为单个字符：同样，就像空白一样，可读的名称对机器来说不是必需的，所以我们可以通过用更短的名字替换它们来减少发送给用户的字节数。例如，myLongVariableName将被重命名为a，每次你的广告传输时可以节省大约 17 字节。

• 合并文件： 从 iAd 网络获取每个文件都有额外的开销，而设备和服务器之间相互通信。您的优化广告将多个文件合并为一个，以减少这种开销。

注意

您可能记得，在早期章节中，我们使用了一个图像精灵，将许多图像合并成一个大的图像，然后在任何时候只显示所需的部件，以减少对服务器的请求。

• 创建清单文件： 清单文件是 HTML5 规范的一部分，它告诉设备哪些文件需要预取和缓存，以确保您的广告在页面之间平稳过渡，用户无需等待额外内容加载。对于间歇性连接的用户，缓存应该会改善他们的体验，因为 iAd 框架将在有连接可用时尝试下载资源。

在应用了这些技术之后，我们可以看到我们项目地图页面的优化源代码：

在提交之前验证您的广告非常重要。这将突出显示您 iAd 中资产或内容的问题。要验证您的广告，您需要选择导出 | 显示项目警告。我们在第四章中查看了解决任何问题；如果您的项目有任何您不确定的警告，请回那里查看。

在您测试并验证了您的广告之后，下一步是将广告提交给 iAd 网络以供批准和发布。要将您的广告提交给 iAd 网络，您需要联系您的 iAd 代理以激活您的账户进行实时提交，并为您提供提交说明。

一旦您对 iAd 活动做出承诺，您应该联系苹果公司开始设置您的 iAd 账户，并获取有关成本、预估展示次数和点击次数的更多信息，这些是您的活动预期产生的。

尝试英雄式测试提交

拿一个您现有的项目并模拟将其上线。您可以：

• 修复并验证警告。

• 再次运行您的图像通过优化过程，以防在您开发广告时遗漏了任何图像。

• 多次优化图像，而不会降低质量，因为我们使用的是无损优化技术。

• 导出并测试您广告的优化版本

• 在尽可能多的设备和不同的 iOS 版本上测试，以检查性能。

• 与您的 iAd 代理联系，以启用您的账户进行 iAd 测试服务器。

• 您应该使用各种网络连接进行测试，以确保您的媒体内容能够根据可用带宽正确适应。

注意

iAd 测试服务器为您提供了一个真实世界的测试环境，它模拟了苹果将用于分发您最终广告的实时服务器。

• 让您的管理层签署广告，以突出他们可能对活动存在的问题。

跟踪活动

一旦你的广告上线，你需要分析由分析工具生成的报告，以及你广告活动的成本。广告成本包括你的广告中的综合 CPC 和 CPM。苹果公司会按日分解显示这些数据。

这里是一个为期三天运行的广告活动的示例报告：

广告支出是一天的综合 CPC 和 CPM 成本。你可以设定一个你愿意每天花费的最大金额限制。一旦达到每日限制，你的广告将在下一个日历日之前不会由网络投放。

展示次数和点击次数分别代表你的横幅在应用中出现的次数以及点击横幅以探索核心广告体验的用户数量。

点击率（CTR）可以通过计算用户点击你的横幅并查看你的广告的展示次数的百分比来得出。如果你的 CTR 较低，比如低于 5%，你应该考虑使你的横幅更具吸引力，以吸引更多用户点击，或者调整你的广告定位以吸引对市场更感兴趣的受众。

就像你直播活动的多数方面一样，你的 iAd 账户代理是你主要的联系人，负责提供咨询并帮助你调整广告策略，以在 iAd 网络中实现最佳成功。

摘要

现在，你不仅能够制作出令人惊叹的广告，还可以通过以下方式确保它们的成功：

• 寻找和定位正确的受众

• 跟踪你的广告用户并突出热门部分

• 确保你的广告针对 iAd 网络进行了优化

• 评估成本和最大化广告活动效率

通过掌握制作、管理和监控成功广告活动的技能，你现在已经成为 iAd 大师！祝你好运！既然你已经了解了 iAds 丰富的交互特性，它们可以在应用中创造不引人注目的收入流，那么让我们来看看如何将它们添加到你的应用中。

第十章。将 iAd 添加到您的应用程序中

现在我们已经看到了 iAd 对您的品牌是多么的神奇，我们将看看如何将它们添加到您现有的应用程序中，以增加额外的收入来源。

在本章中，您将学习如何：

• 设置一个空的 iPhone 占位符应用程序，以防您目前没有应用程序及其源代码

• 将 iAd 横幅视图添加到应用程序中

• 更新横幅以处理设备旋转

• 当没有广告可用时隐藏横幅

如果您之前没有创建过 iPhone 应用程序或者没有 iOS 开发经验，不要担心；我们将为您提供添加此功能所需的所有代码。实际上，您甚至可以在没有任何编程经验的情况下将基本的 iAd 横幅添加到应用程序中。话虽如此，不太冒险的人可能更喜欢将此信息传递给他们的应用程序开发团队。

设置基本项目

如果您还没有应用程序但仍然想尝试将 iAd 添加到应用程序中，我们可以快速创建一个单屏幕的 iPhone 占位符项目，以便将其添加横幅。

注意

我们将使用 Xcode；我们在第四章中安装了它，即确保它工作，当时我们设置了 iOS 模拟器，所以您应该有它可用（如果没有，那么请返回并现在设置它）。

如果您不想设置演示应用程序，您可以在iAd Demo App文件夹中找到带有书籍资源的完成占位符项目。

行动时间——一个占位符应用程序

使用 Xcode 及其内置的界面构建器和拖放 UI 设计器，我们将创建一个带有一些模拟组件的单屏幕 iPhone 应用程序来模拟应用程序：

1. 打开 Xcode。如果您之前没有使用过它，您可以在 Mac 根目录下的Developer文件夹中的Applications文件夹中找到它。

   注意

   这与 iAd Producer 所在的Applications文件夹不同。如果您找不到 Xcode，请使用 finder 中的搜索功能来定位它。

2. Xcode 将打开欢迎使用 Xcode窗口。从这里，选择创建一个新的 Xcode 项目。当被要求选择项目类型时，点击基于视图的应用程序|继续。

3. 您需要输入产品名称（这是您想要给应用程序取的名字）和公司标识符（这通常是您的网站 URL 的反转）。例如，使用Demo iAd App作为名称，使用com.examplecompany作为标识符。

4. 确保选择设备系列为iPhone，并取消选择包含单元测试。当您的 Xcode 窗口看起来类似于以下截图时，点击下一步按钮：

5. 选择一个位置来保存您的项目和关联文件，然后点击创建。

6. 请等待 Xcode 设置您的项目。它将在您选择保存项目的目录中创建几个文件和文件夹。一旦 Xcode 窗口加载完毕，从 Xcode 项目导航器中定位文件iAd_Demo_AppViewController.xib。项目导航器位于 Xcode 左侧的一个面板。如果您看不到它，请从 Xcode 菜单栏中选择视图 | 导航 | 显示项目导航器。

7. 这将打开 XIB 文件——将这个文件想象成您 iAd 中的一个页面。它将在 Xcode 界面构建器中打开。界面构建器就像 iAd Producer 中的画布；您可以从库中拖放对象来构建页面。要向我们的画布（称为视图）添加对象，请通过选择视图 | 活动 | 对象库打开对象库。Xcode 右侧将展开一个面板，您将在其底部找到对象库：

8. 在这里，我们可以看到可用用户界面组件的列表，我们可以将其添加到视图中。找到一个标签并将其拖放到视图中。

   注意

   您会注意到许多这些控件与 iAd Producer 非常相似。这是因为苹果公司试图在 iOS 上的许多对象之间保持一致性，以降低入门门槛和学习曲线。

9. 双击标签以编辑其文本。将文本更改为类似Apps With iAd Rock!的内容，然后单击标签外部以退出编辑模式。如果您想更改标签的样式，可以使用属性检查器，其行为类似于 iAd Producer 中的属性和样式。您可以在对象库上方找到属性检查器。添加一些更多对象，例如按钮、开关、滑块和文本字段。将这些对象放置在视图中，但靠近底部留出空间。这就是我们的横幅稍后会出现的地方。

10. 您的视图可能看起来像这样：

11. 实际上，页面的外观并不重要；这只是为了让我们在下一个练习中添加横幅时有上下文。

12. 最后，我们可以在模拟器中运行我们的应用程序。从 Xcode 左上角选择运行按钮（带有播放图标），模拟器应该会打开。您应该能够切换开关并移动滑块。每次运行项目时，Xcode 都会构建应用程序并自动保存所有文件。

刚才发生了什么？

我们从 Xcode 模板中创建了一个基于视图的应用程序，它给我们提供了一个带有空白视图的单视图应用程序，我们可以向其中添加对象。我们向视图中添加了一些对象，以便在运行应用程序时有一些内容可用。在 Xcode 的界面构建器中完成视图布局后，我们模拟了应用程序以查看其行为。

在设备上测试 iAd 需要您将其注册给 Apple 以进行配置和启用开发。这需要一个有效的付费开发者会员资格，我们在 第一章 的 开始使用 iAd 中注册了，以获取访问 iAd Producer 的权限。

行动时间 — 在设备上运行

如果您尚未为开发配置设备，我们可以使用 Xcode 的组织者工具登录到 Apple 配置文件门户并设置所需的证书并注册您的设备：

1. 打开 Xcode，如果尚未打开。从菜单栏中选择 窗口 | 组织者。这将打开组织者，允许我们管理我们的 iOS 设备、它们的配置文件和应用程序提交。

2. 现在插入一个 iOS 设备，例如 iPhone 或 iPad。如果它与 iTunes 同步，请等待其完成。确保组织者的 设备 选项卡已选中，并在左侧列表中找到您的设备。

3. 选择设备，然后单击 用于开发 按钮以允许其设置为开发配置。

4. 一旦设备在本地配置完成，选择 + 添加到门户 按钮以联系 Apple 开发者门户，该门户将设置您的设备。输入您的 Apple ID/开发者帐户的 用户名 和 密码：

5. 组织者现在将与 Apple 通信并启用 Xcode 在您的设备上交互。一旦完成，您的 Mac 将能够向设备发送构建。

6. 关闭组织者窗口，并将设备 方案 从 运行 和 停止 按钮旁边的下拉选择器中的 Your Device Name 更改为。Xcode 将构建您的应用程序，您应该会在不久后看到它在设备上运行。

发生了什么？

Xcode 自动将您的设备添加到配置文件门户中，您可以在 developer.apple.com 查看和管理。当将设备添加到门户时，Xcode 会执行以下步骤：

• 将 唯一设备标识符 (UDID) 提交到 Apple 配置文件门户。

• 将设备添加到您的注册设备列表中，该列表与您的开发者帐户相关联。每个帐户最多可以添加 100 台设备。

• 代表您创建并安装证书，这些证书用于保护构建，以确保只有您才能创建它们。

• 代表您生成并设置开发 配置文件—这告诉设备是否允许运行应用程序。配置文件包含每个设备的 UDID 列表，有权运行相关应用程序。

注意

您需要为每个想要测试的设备重复此过程，并且这特定于 Mac 用户帐户。如果您切换了机器，您需要重新配置 Xcode 并再次执行这些步骤。

在我们的演示应用程序已安装并运行在模拟器和设备上后，我们可以向其中添加第一个 iAd 横幅！

将横幅添加到视图中

我们可以使用界面构建器将 iAd 横幅添加到您的应用视图中。这是一个简单的拖放操作，以获得基本的横幅功能。

添加横幅的行动时间

我们将在上一练习中构建的占位符应用中添加 iAd 横幅。如果您想使用自己的应用，请确保您熟悉 Xcode 中的界面构建器。按照以下步骤添加横幅：

1. 打开您的项目，或 Xcode 中的我们的演示项目。

2. 从文件列表中打开文件iAd_Demo_AppViewController.xib，如果尚未打开。这将启动界面构建器。从对象库中，将Ad BannerView对象拖动到主视图中。对象库包含大量项目，可能会使导航变得困难。您可以使用其下方的搜索文本区域来过滤结果。搜索横幅会显示任何与横幅相关的对象。在以下屏幕截图中，您可以看到对banner:的搜索。![添加横幅的行动时间]

3. 重新定位横幅视图，使其在屏幕底部中央对齐。

4. 苹果建议将横幅放置在应用的顶部或底部，并确保它是静态的；将其放入可滚动的视图或列表中会限制横幅在屏幕上的显示时间，这将严重影响您活动的收入。尝试使用运行按钮或键盘快捷键cmd + r来运行您的应用。您会发现应用在启动前崩溃。这是由于存在我们需要包含的横幅视图的依赖项。iAd 横幅需要将 iAd 框架包含在我们的应用程序中。

5. 要添加 iAd 框架，点击 Xcode 左侧的项目导航器面板中您的项目名称。如果您使用的是演示项目，这将显示为iAd Demo Project，可以在项目导航器的最顶部找到。这将打开 Xcode 主窗口中您项目的信息。在TARGETS下选择您的项目名称，然后切换到构建阶段。

6. 展开链接二进制文件与库部分，然后在该部分的底部点击+按钮以打开库/框架选择器。搜索iAd并选择iAd.framework。然后点击添加。

7. 从项目导航器文件列表中，将iAd.framework文件拖动到Frameworks文件夹。您不必执行此步骤，但这有助于保持项目整洁。

8. 运行您的应用。您应该在几秒钟后看到测试横幅出现。尝试点击它以打开演示广告。

9. 干得好！您的项目现在成功添加了 iAd！

刚才发生了什么？

我们刚刚将 Ad BannerView 对象添加到应用视图中，并将其定位在屏幕底部中央。使用构建阶段，即构建和运行应用时调用的步骤列表，我们添加了 iAd 框架以确保它在我们的应用中可用。我们必须将iAd.framework添加到我们的应用项目中，否则横幅视图将无法访问正确的组件并导致应用崩溃。

当应用处于调试或开发模式时，iAd 网络会自动提供测试广告。这是为了防止点击欺诈，即通过生成人工点击（或轻触）来欺骗系统并虚假增加收入：

在你将应用提交到 App Store 之前，我们需要启用我们的广告以供生产。我们将在下一章中这样做，但首先让我们看看如何改进应用内的横幅体验。

处理方向变化

你可能记得，当我们使用 iAd Producer 构建横幅时，我们检查了它们在纵向和横向是否都工作；然而，目前我们的演示应用只支持纵向。确保你的应用可以在任何方向上显示横幅，这将确保你从 iAd 网络中获得最大的曝光和收入。

行动时间——你让我旋转得如此之快

如果你正在使用演示应用，那么让我们启用所有可能的方向。确保我们的横幅能够相应地调整：

1. 在 Xcode 中打开演示应用。如果你正在使用已经支持多方向的自己的应用，请跳到步骤 4。

2. 为了使我们的应用知道当设备旋转时应该旋转视图，我们需要修改一点 Objective C 代码。从项目导航器打开文件iAd_Demo_AppViewController.m；你会在屏幕上看到代码。找到方法(BOOL)shouldAutorotateToInterfaceOrientation，它应该位于函数的末尾附近。当设备旋转并且我们能够告诉它何时应该和不应该更新视图时，会调用这个方法。找到以下行：

   return (interfaceOrientation == UIInterfaceOrientationPortrait);
   
   

3. 目前，它检查旋转方向是否为纵向，如果是，则返回YES，如果不是，则返回NO。我们能够覆盖这个检查并始终说YES；将行更改为读取：

   return YES;
   
   

4. 这意味着应用将允许视图旋转到任何可能的方向。

5. 运行应用并尝试旋转它；你会看到视图旋转，但在横向时会被裁剪，横幅视图不可见。现在，我们将忽略其余被裁剪的内容，但调整横幅使其始终可见。

6. 在界面构建器中打开你的视图的 XIB 文件。如果你正在继续使用演示应用，它将是iAd_Demo_AppViewController.xib。点击视图底部的广告横幅视图以选择它。从菜单栏中选择视图 | 实用工具 | 显示大小检查器。

7. 这将打开大小检查器，允许我们修改横幅视图的布局信息。大小检查器位于 Xcode 右侧，位于对象库上方。

8. 找到Autosizing框，并单击顶部的红色双倍横梁形状以禁用它。然后单击底部的一个以启用它。你的自动调整大小设置应如下截图所示：

9. 这意味着横幅的位置将从屏幕底部设置，而不是顶部，因此无论高度如何，它始终附着在视图的底部。

10. 再次测试广告。无论方向如何，横幅现在都位于屏幕底部，但它并没有动态更新以正确填充屏幕。我们需要使横幅视图可访问，以便我们可以在旋转发生时通知它。这与 iAd Producer 中的出口类似工作。

11. 从项目导航器中打开文件iAd_Demo_AppViewController.h。这将打开 Xcode 中的代码编辑器。在#import <UIKit/UIKit.h>之后，添加以下代码：

    #import <iAd/iAd.h>
    
    

12. 这告诉文件我们将使用 iAd 框架，因此它应该导入它。现在在@interface iAd_Demo_AppViewController : UIViewController和@end之间，添加以下代码：

    {
    ADBannerView *bannerView;
    }
    @property(nonatomic, strong) IBOutlet ADBannerView *bannerView;
    
    

13. 这创建了一个名为bannerView的变量，它将可以从我们的代码中访问。IBOutlet告诉界面构建器bannerView可以作为出口使用。

14. 将代码编辑器切换到文件iAd_Demo_AppViewController.m，在@implementation iAd_Demo_AppViewController之后，在新行上添加以下代码：

    @synthesize bannerView;
    
    

15. 这将使我们能够访问bannerView的属性。

    注意

    你可能会发现 Xcode 尝试通过自动完成和建议来帮助你编写代码。为了确认你想要使用建议，请按tab键。

16. 在我们的出口就位后，我们可以在界面构建器中连接到它。打开iAd_Demo_AppViewController.xib，在界面构建器左侧的File's Owner图标（一个立方体线框）上右键单击。点击并拖动圆圈，在覆盖列表中的bannerView出口之后，将其拖到主视图上的AdBannerView，如图所示：

17. 这将我们在代码中创建的出口与界面构建器视图上的横幅链接起来。现在我们可以在代码中访问我们的横幅，并可以在旋转发生时通知横幅。在文件底部的@end行附近，添加以下代码块：

    (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
    {
    if(UIInterfaceOrientationIsLandscape(toInterfaceOrientation))
    bannerView.currentContentSizeIdentifier =ADBannerContentSizeIdentifierLandscape;
    else
    bannerView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
    }
    
    

18. 当添加此代码时，你可能发现自动完成很有用。我们正在使用设备在旋转发生之前调用的willRotateToInterfaceOrientation方法。然后我们检查它将要旋转到的方向，并更新我们横幅的contentSizeIdentifier属性。

19. 运行应用并旋转设备进行测试；横幅现在将更新以填充屏幕并显示横幅广告。

刚才发生了什么？

我们通过调整横幅视图以使其工作，提高了我们应用的体验和潜在收入。无论设备处于何种方向，你的横幅都应该动态更新横幅创意：

通过使横幅视图可以从代码中访问，我们现在能够为我们的应用添加更多增强功能，例如，在没有广告可用时隐藏视图或提供备用内容。

突击测验

Xcode 和 Objective-C 一开始可能会有些令人不知所措，但一旦你掌握了基础知识，你会注意到它与 iAd Producer 的相似之处。通过尝试这些问题来检验你学到了什么：

1. 要在界面构建器中使一个对象可以从代码中访问，你会怎么做？

   • a. 在你的代码中声明一个 IBOutlet，然后在界面构建器中连接该出口

   • b. 在界面构建器中重命名该项，然后在代码中使用它

   • c. 只需编写代码，界面构建器就会添加该项

   • d. 通过[UIView objectAtIndex:0]访问视图项，根据它们在页面上的位置

2. 如果 iAd 横幅导致我们的应用崩溃，最常见的原因是什么？

   • a. 没有广告可用

   • b. 下载的广告对于操作系统来说太大，无法处理

   • c. 没有互联网连接

   • d. 项目缺少 iAd 框架

处理无可用广告

你的应用可能会遇到 iAd 网络无法提供广告的情况。这可能是因为网络覆盖差或 iAd 尚未在用户所在的国家可用。我们应该优雅地处理这种情况，确保我们不显示空横幅，并在有广告可用时将其重新显示在视图中。

是时候行动起来——禁止横幅广告

通过对我们的视图和代码进行一些小的调整，我们可以根据广告的可用性来动画化横幅的显示和隐藏：

1. 在 Xcode 中打开示例项目，或打开包含广告横幅视图的自己的项目。打开你的视图的主控制器文件，例如，iAd_Demo_AppViewController.m。

2. 假设广告总是会失败，并在应用进入视图时立即将横幅移出视图。然后我们将等待 iAd 网络的成功消息，并将其重新显示在视图中。在约第 30 行添加以下代码：

   - (void)viewWillAppear:(BOOL)animated
   {
   CGRect frame = self.view.bounds;
   CGPoint bannerOrigin =CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
   bannerView.frame = CGRectMake(bannerView.bounds.origin.x, bannerOrigin.y, bannerView.frame.size.width, bannerView.frame.size.height);
   }
   
   

3. 这将横幅的框架设置为将y值设置为当前视图的高度，从而将其移出屏幕。尝试运行你的应用；你会发现横幅从未出现，即使它可能是已加载的，因为当广告成功加载时，横幅永远不会回到原来的位置。

4. 我们现在将使用 iAd 横幅的 delegate 方法来处理广告的成功和失败响应。委托是一种与对象交互并接收事件或消息的方式；在我们的案例中，我们可以在代码中实现横幅的委托，以便它通知我们变化。让我们更新代码，让横幅知道它应该使用什么作为其委托。在上次修改的 viewWillAppear 方法中，将以下内容添加到方法末尾：

   bannerView.delegate = self;
   
   

5. 添加此方法后，您应该会在行号旁边看到一个黄色警告图标。单击此图标以显示警告：

6. 这个警告告诉我们，尽管我们已经将横幅视图的委托设置为当前文件（通过说 self），但它目前无法处理其角色。切换到 iAd_Demo_AppViewController.h 文件，它被称为头文件，并找到 UIViewController。将其更新为以下内容：

   UIViewController<ADBannerViewDelegate>
   
   

7. 这告诉我们的视图控制器类它可以响应来自 Ad Banner View 的委托请求。有了我们的委托和能够响应它的视图控制器，我们现在可以添加处理广告的成功和失败方法。在您的 iAd_Demo_AppViewController.m 文件中的 @end 之前，添加以下内容：

   #pragma mark ADBannerViewDelegate methods
   
   

8. 这不是必需的，但它有助于分离我们的代码部分，并突出显示 delegate 方法开始的地方。

9. 在我们的 pragma mark 行之后，我们可以添加委托方法。从在广告成功加载后使横幅回到视图中的代码开始。在您的 pragma mark 行后立即添加此方法：

   -(void)bannerViewDidLoadAd:(ADBannerView *)banner
   {
   CGRect frame = self.view.bounds;
   CGPoint bannerOrigin =CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
   bannerOrigin.y -= bannerView.bounds.size.height; 
   // Animate into view
   [UIView animateWithDuration:2.0f
   animations:^{
   bannerView.frame = CGRectMake(bannerView.bounds.origin.x, bannerOrigin.y, bannerView.frame.size.width, bannerView.frame.size.height);
   }];
   }
   
   

10. 在这里，我们添加了 bannerViewDidLoadAd 方法，这是横幅的委托方法。当 iAd 网络成功交付广告时，它会调用此代码。然后我们取横幅的框架并调整它，使其回到视图中，并添加了动画变化，使横幅从视图底部移动进来。运行广告，您将看到横幅出现。

    注意

    有时 iAd 网络不会交付广告来模拟失败。如果您发现横幅没有出现，请尝试关闭并重新打开您的应用程序以触发另一个广告。

11. 当下载广告出现问题，横幅正在动画显示时，让我们确保它也可以动画退出。一旦横幅可见，它将在各种创意之间循环，因此我们不应该假设一旦我们有一个广告，我们就会继续收到一系列的广告。类似于 bannerViewDidLoadAd 委托方法，当我们无法获取广告时，我们可以使用 didFailToReceiveAdWithError 方法。使用以下代码，将其放置在上一步添加的代码下方：

    (void)bannerView:(ADBannerView *)banner didFailToReceiveAdWithError:(NSError *)error
    {
    CGRect frame = self.view.bounds;
    CGPoint bannerOrigin =CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
    // Animate into view
    [UIView animateWithDuration:2.0f
    animations:^{
    bannerView.frame = CGRectMake(bannerView.bounds.origin.x, bannerOrigin.y, bannerView.frame.size.width, bannerView.frame.size.height);
    }];
    }
    
    

12. 您可能会注意到，此代码几乎与我们收到广告时的代码相同；只是现在我们不是从框架中减去横幅的高度，因此它处于屏幕外。在下一个练习中，我们将通过不重复代码来优化我们的代码。

13. 如果你耐心地观察你的应用，它最终会失败下载横幅，你应该看到当前的横幅从视图中滑出。

刚才发生了什么？

我们在 viewWillAppear 方法中添加了一些代码，这个方法会在视图即将变得可见时被调用。这段代码将空横幅隐藏在屏幕之外，以便为额外的组件腾出更多空间。使用代理，我们设置了视图以响应来自 iAd 网络的短信，并根据广告的可用性在屏幕上动画横幅的显示和隐藏。

尝试一下英雄

我们的 app 看起来很棒，横幅出现在我们的应用中，并在旋转时正确调整大小，当广告可用时显示或隐藏自己。如果你觉得这些步骤很简单，那么尝试这些更高级的任务：

• 更新占位符应用中项目的 自动调整大小 属性，以便在横幅中不会裁剪。

• 如果你熟悉 iPhone 开发，考虑将所有内容组合到一个与横幅分开的视图中。这样，它就可以成为横幅视图的兄弟视图，并且它的布局可以根据横幅的可用性进行调整。

• 如果你有自己的应用，尝试在应用的所有页面之间共享一个横幅对象以提高效率。

• 创建一个 iPad 项目，并在其中添加一个全屏横幅。作为参考，使用：developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/iAd_Guide/Full-ScreenAdvertisements/Full-ScreenAdvertisements.html。

• 尝试下一个 行动时间 部分，在那里，对于更有冒险精神的开发者，我们将整理代码！

• 在developer.apple.com/library/mac/#documentation/Cocoa/Conceptual/CocoaFundamentals/CommunicatingWithObjects/CommunicateWithObjects.html了解更多关于 Objective C 基础的知识。

行动时间 — 清理代码

当你开始复制代码时，你正在增加维护你的应用所需的努力，因为你必须遍历每一个实例并对其进行更改。在我们的上一个练习中，我们有三个相似的代码块，我们可以将它们合并成一个智能处理这些情况的方法。这个函数将根据横幅的可用性来处理我们广告的隐藏和显示。继续使用我们的演示应用，完成以下步骤以清理代码：

1. 在横幅的代理方法和 pragma mark 之前创建一个空方法，添加以下代码：

   -(void) adjustBannerVisibility
   {
   }
   
   

2. 我们需要在文件 iAd_Demo_AppViewController.h 的 @end 语句之前添加以下内容，以便在头文件中：

   -(void) adjustBannerVisibility;
   
   

3. 这将抑制 Xcode 关于未知方法的任何警告。现在返回到主文件——iAd_Demo_AppViewController.m。

4. 我们现在可以构建这个方法的功能。它将替换并管理横幅的显示和隐藏。在方法内部添加以下内容：

   CGRect frame = self.view.bounds;
   CGPoint bannerOrigin =CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
   // check if the banner is loaded
   if(bannerView.bannerLoaded) {
   // bring banner into view
   bannerOrigin.y -= bannerView.bounds.size.height;
   }
   // Animate into view
   [UIView animateWithDuration:2.0
   animations:^{
   bannerView.frame = CGRectMake(bannerView.bounds.origin.x, bannerOrigin.y, bannerView.frame.size.width, bannerView.frame.size.height);
   }];
   
   

5. 这与之前的横幅代码工作方式相同，但都在一个方法中。bannerView.bannerLoaded检查我们是否已加载横幅，然后相应地调整偏移量。

6. 目前，我们正在调整viewWillAppear、didFailToReceiveAdWithError和bannerViewDidLoadAd方法中的横幅。逐个查看这些方法，并将横幅框架代码替换为我们新的方法。您可以通过以下代码行调用我们的方法：

   [self adjustBannerVisibility];
   
   

   注意

   确保您不要从viewWillAppear方法中移除banner.delegate = self；这将阻止您的横幅永远显示出来！

• 例如，您的bannerViewDidLoad方法现在应该看起来像以下这样：

  -(void)bannerViewDidLoadAd:(ADBannerView *)banner
  {
  [self adjustBannerVisibility];
  }
  
  

• 与任何更改一样，测试您的应用并确保新代码按预期工作！

刚才发生了什么？

通过将多个方法合并为一个方法，我们减少了因错误而导致的代码失败风险，并且可以在一个中心位置更新我们的代码，而无需重复任何更改。应用现在变得更加整洁。删除代码真的很令人满意，因为这意味着未来工作量更少！

摘要

在本章中，我们使用了 iAd 为您的应用用户提供了一个简单、广为人知且沉浸式的横幅和广告体验。为了使横幅在我们的应用中优雅地工作并最大化收入机会，我们：

• 创建了一个占位符应用来测试 iAd 功能

• 使用界面构建器将横幅放置在静态位置

• 仅在横幅有内容时处理横幅的显示

• 优化了代码以提高其可维护性

通过提高我们广告的可见性并处理没有广告可用的情况，我们应该能够从我们的应用中生成健康的最优收入流。在我们开始兑现支票之前，我们需要激活我们的应用以投放实时广告，并查看我们如何跟踪收入；所有这些内容将在最后一章中介绍！

第十一章。跟踪收入和回退

当 iAd 横幅出现在您的应用中时，您将想知道如何跟踪它们产生的收入，以及当用户离线或 iAd 网络不可用时如何显示替代横幅。

在本章的最后部分，我们将涵盖以下主题：

• 接受 iAd 网络合同

• 在提交的应用中激活您的实时广告

• 测量您的收入和移动展示广告中使用的术语

• 当 iAd 不可用时，回退到其他广告网络

通过这组关键技能的最后一批，您很快将成为移动广告大师。

启用实时广告

默认情况下，当您在您的某个视图中添加了 iAd 横幅时，iAd 网络会将测试广告发送到您的应用。苹果要求您在 iTunes Connect 中激活您的应用，然后他们才会向您的应用提供产生收入的实时广告。

接受合同

首次启用实时广告需要您设置并接受 iAd 网络合同；您可能已经启用了此功能，但如果您尚未启用或不确定，请按照下一个练习检查并注册。

行动时间 — 签署虚线

如果您目前没有任何使用 iAd 的应用，那么您可能尚未请求并激活与苹果的 iAd 网络合同。请求此合同只需几个简单步骤，只要您接受条款和条件，您就可以开始通过 iAd 网络生成收入。

1. 通过在浏览器中打开itunesconnect.apple.com登录 iTunes Connect。您的用户名和密码将与我们在第一章中使用的 Apple ID 相同，即开始使用 iAd，当您注册 Apple iOS 开发者计划时。

2. 登录后，从页面下半部分的选项列表中选择管理我的应用。如果您尚未在 iTunes Connect 中创建应用，请选择添加新应用并按照步骤操作。

   注意

   如果您不确定应用提交流程，苹果为开发者提供了一个可在http://itunesconnect.apple.com/docs/iTunesConnect_DeveloperGuide.pdf找到的指南，该指南涵盖了提交应用的流程。您可以从 iTunes Connect 中的合同、税务和银行部分手动接受 iAd 网络合同。

3. 当应用在 iTunes Connect 中可用时，通过点击其图标来选择它。这将打开应用摘要页面；从这里，选择设置 iAd 网络。如果您尚未同意 iAd 网络合同，您将在继续之前被提示签署。

4. 点击iAd 网络合同的链接以打开可用的合同页面。找到以下截图中的iAd 网络合同，并选择请求：

5. 阅读并接受条款和条件。苹果将以 PDF 格式通过电子邮件向您发送合同，但合同将立即生效。在您能够开始为您的广告收取付款之前，您需要设置您的联系信息、银行信息和税务信息——您可以在进行中的合同部分找到这些信息。

6. 您现在已接受 iAd 合同，iAd 网络可以开始向您的 iAd 启用应用发送盈利横幅！

发生了什么？

苹果不会允许我们在与他们签订合同之前在我们的应用中显示实时广告。请确保您阅读了条款和条件，因为它们概述了协议的规则，包括付款条款和苹果公司撤销访问 iAd 网络的权利，如果您的应用不符合某些指南。如前所述，一旦您提交了 iAd 启用应用，您的应用将开始盈利，但您无法收集您的收入，直到您设置了您的联系信息、银行信息和税务信息。

启用您的广告

虽然您已在您的应用中添加了 iAd 横幅并接受了 iAd 合同，但您可能希望在每个应用上显示实时广告并产生收入；这需要单独激活并启用 iAd。

行动时间 — 启用广告

与苹果公司签订有效的 iAd 合同后，我们能够开始为每个应用提供实时 iAd 活动。要启用广告，请按照以下步骤操作：

1. 使用您的 Apple ID 登录到 iTunes Connect。选择管理您的应用。找到并打开您想要启用广告的应用。

2. 从右侧菜单中选择设置 iAd 网络，如图所示：

3. 选择您的目标受众是否为 17 岁以下。苹果目前不会向针对未成年人的应用发送广告。点击启用 iAd开关，然后点击保存。

   注意

   要查看此屏幕，您的应用必须处于可编辑状态。这意味着您已在 iTunes Connect 中为更新或新应用准备了详细信息，但尚未上传应用二进制文件或点击准备上传按钮。

4. 您的应用现在已启用 iAd！任何未来提交给此应用的二进制文件都将显示实时广告，一旦在 App Store 中可用。

发生了什么？

由于真正的 iAd 只出现在提交给 App Store 的非开发应用中，您必须在提交之前启用您的应用，因为仅为 iAd 激活您的应用只会使其适用于未来的上传。这意味着您可能会在您的实时应用中收到测试广告，而根据其本质，这些广告不会产生任何收入！一旦启用，停止向您的应用程序发送广告的唯一方法是提交一个没有任何横幅查看的应用更新。您无法从 iTunes Connect 中移除您的应用从 iAd 网络。

苹果公司限制在开发应用中显示实时横幅，以防止在测试应用时虚假赚取收入，并阻止通过点击欺诈利用点击。点击欺诈是指人为生成点击或点击以虚假增加 iAd 网络的收入。

监控您的收入

与跟踪您自己的 iAd 广告活动类似，显示和监控您应用中的广告需要您了解指标和术语。在监控收入时，我们将关注的术语包括：

• 收入

• 展示量

• 请求

• 填充率

• eCPM

• 点击率

收入

这是关键指标——您的应用能赚多少钱！苹果公司将广告收入的 60%分给您；因此，对于他们产生的每一百美元，您将收到其中的六十美元。显示的收入是您的实际到手收入。收入是根据您的应用中横幅广告的展示量和点击量来计算的。

当您的累积收入达到一定阈值时，苹果公司将通过支票或银行转账将您生成的收入转给您。

展示量

展示量是指横幅加载并出现在您的应用中。因此，显示的展示量是在特定时间段内出现在您的应用中的横幅总数。

请求

每次您的应用从 iAd 网络请求新的横幅以在应用中显示时，苹果公司都会将其记录为请求。用户每次使用您的应用通常会导致许多请求，因为应用中的横幅在显示一段时间后会被新鲜内容循环替换。

填充率

填充率是指从您的应用发送的请求中成功填充并返回广告以显示的百分比。填充率越高，越好，因为这意味着您的应用正在尽可能多地显示广告。当您的应用在尚未加入 iAd 网络的市场中大量使用时，可能会出现低填充率。

注意

要了解目前由 iAd 网络服务的国家和地区，请访问developer.apple.com/iad/。

如果您的填充率是零，请考虑联系苹果公司；偶尔他们可能会因为对您应用的内容有顾虑或者目前没有广告商为您的应用类别提供广告而禁用广告投放。

eCPM

eCPM，或有效每千次展示成本（每千次展示的成本），是指您的收入除以您的应用显示的横幅广告的千次展示量。这允许您预测如果您的应用使用量（因此展示量）增加，您的收入会如何增长。

如果您的展示量和点击量的总收入为 2000 美元，并且您的应用横幅展示量为 10 万次，那么您的 eCPM 将是 20 美元。这意味着对于每 1000 次展示，您的平均收入将是 20 美元。然后您可以估计您的收入；比如说，您的应用接收了 20 万次展示，那么您可能会赚取 200 乘以 20，即 4000 美元。

点击率

点击通过率是导致用户点击或轻触以显示核心广告单元的横幅查看百分比。点击比简单展示产生更多收入，因此拥有高点击通过率是理想的。如果您的点击通过率低，可能是由于您的横幅位置不易被您的应用用户访问。确保您的横幅视图已添加并在整个应用中可见，无论是在屏幕顶部还是底部。

行动时间 — 分析收入

iAd 网络提供了一个丰富的视觉界面，包含数据和图表，供您跟踪您的应用收入。您需要一个活跃的应用，该应用已在商店上线并产生收入，才能继续。

1. 通过访问itunesconnect.apple.com并使用您的 Apple ID 登录到 iTunes Connect。从可用选项中选择iAd 网络。

   注意

   这只能在您有一个使用 iAd 网络的实际应用后才能使用；遵循最后一个练习中的步骤来启用应用以进行实时 iAd。

2. 登录成功后，您将看到过去七天和 24 小时内所有您的 iAd 启用应用的收入摘要。例如，查看以下截图：

3. 在摘要下方，您将找到一个条形图，显示了您应用在过去 14 天内的收入；您可以通过点击图表上方显示的指标名称来在各种性能指标之间切换。您可以使用这些图表来查找您的收入中的模式和趋势，例如突出显示哪些天带来最佳收入或将收入映射到外部促销活动，吸引人们使用您的应用：

4. 通过调整图表下方直接找到的控制，尝试更改您收入图表的持续时间和日期。

5. 要查看您单个应用的细分，滚动到窗口底部的以下截图所示区域。从这里，您可以选择一个应用程序并查看为其过滤的数据。

刚才发生了什么？

通过登录到 iTunes Connect 管理门户并查看我们的 iAd 收入，我们能够查看摘要、图表和累积或按应用的收入。这些数据通常每 24 小时更新一次，因此在跟踪您的收入时请记住这一点。

快速问答 — 收入学习

能够跟踪您的收入并预测未来的收入对于确定您的 iAd 启用应用的长期性和盈利能力至关重要。尝试回答以下问题：

1. 如果您的应用点击通过率低，您应该做什么？

   • a. 检查您是否已为所有带有横幅的应用启用了实时横幅

   • b. 在您的应用中添加两个横幅，以便更可能发生意外点击

   • c. 在 iAd 网络列表中的国家推广您的应用

   • d. 确保你的横幅在你的应用中始终显示，在视图顶部或底部的推荐位置

2. 请求是什么？

   • a. 在点击横幅后加载核心广告单元时

   • b. 当你的应用首次加载并缓冲所有广告时发生请求

   • c. 当你的应用请求 iAd 网络显示横幅时

   • d. 横幅显示的次数

3. 由于填充率是应用程序请求中显示广告的百分比，你将如何计算它？

   • a. 展示次数除以请求次数

   • b. 100 除以请求次数，乘以展示次数

   • c. 100 除以展示次数，乘以总请求次数

   • d. 点击通过率乘以 100

降级方案

有时候，iAd 网络将不可用或无法向你的应用程序提供广告。广告可能因许多原因而不可用，包括：

• 用户没有活跃的互联网连接

• iAd 网络目前在一些用户的国家的不可用

• 针对用户或你的应用人口统计的 iAd 库存中没有可用的横幅和广告创意

在这种情况下，你的应用中不会显示任何横幅或广告。如果你的应用程序的收入主要来自广告，你将想要提供一个降级广告或收入来源。

行动时间 — 添加另一个广告

当 iAd 框架通知我们没有可用的广告时，我们可以使用这个代理方法来显示一个替代横幅，即一个简单的图片。

1. 我们将继续使用我们在上一章中创建的演示 iAd 应用程序；现在在 Xcode 中打开它。对于我们的横幅，我们将使用与 iAd 横幅相同大小的图像，宽度为 320px，高度为 50px，但我们还需要一个高分辨率的双倍大小图像用于视网膜显示屏。在本书资源中包含的iAd Demo App文件夹中，找到Banner@2x.png和Banner.png图像并将其拖到项目导航器中，即在 Xcode 的左侧。

   注意

   与 iAd Producer 不同，Xcode 不会自动从高分辨率版本生成我们的低分辨率图像。我们需要创建一个 640px 宽、100px 高的图像，然后保存另一个大小减半的版本。你可以使用预览来编辑、调整大小和保存每个横幅。在文件扩展名之前在文件名中使用@2x来命名高分辨率图像。

2. 在我们的项目中有了可用图像后，我们将它们添加到视图中。选择iAd_Demo_AppViewController.xib视图以在界面构建器中打开它。从对象库中找到图像视图对象。如果你找不到它，不要忘记对象库中的搜索功能。将一个图像视图拖到视图中，调整大小和位置，使其覆盖当前的 iAd 横幅视图。

3. 在属性检查器中，将图像视图的图像属性设置为Banner.png。它应该可以从显示项目中所有可用图像的下拉列表中找到。我们在这里不使用我们的@2x图像，因为当设备具有视网膜显示屏时，应用程序将自动加载此图像，前提是文件名相同：

4. 你会在视图中看到模拟横幅图片出现。有了这个，我们需要更新应用程序代码来隐藏和显示正确的横幅，这取决于 iAd 的可用性。

5. 在我们能够从代码中访问我们的备用横幅之前，我们需要将其添加为出口。在代码编辑器中选择并打开头文件iAd_Demo_AppViewController.h；我们必须添加一个引用到我们可以用作出口的图像视图。在第一个ADBannerView *bannerView之后，在新的一行中添加以下内容：

   UIImageView *imageView;
   
   

6. 在界面构建器中添加的图像视图用作参考，作为UIImageView，以 UI 开头，因为它是一个用户界面对象。

7. 在我们声明横幅视图为出口的@property之后，添加以下代码行：

   @property(nonatomic, strong) IBOutlet UIImageView *imageView;
   
   

   这将使我们能够将界面构建器中的图像视图与代码链接起来。

8. 最后，在我们能够连接我们的图像视图之前，打开主代码文件iAd_Demo_AppViewController.m。然后，在@synthesize bannerView之后，我们需要通过添加以下内容来合成我们的图像视图：

   @synthesize imageView;
   
   

9. 返回到界面构建器中的视图，并将来自文件所有者的出口imageView连接到视图上的图像视图，如下截图所示：

   注意

   如果需要提醒在 Xcode 中连接出口，请参考上一章。

10. 在将视图的出口连接后，我们能够根据 iAd 横幅的可用性重新定位模拟横幅。回到主视图文件，在代码编辑器中打开它。找到大约在第 71 行附近的adjustBannerVisibility方法。这个方法在需要调整横幅位置时被调用和执行，因此它是使用理想的方法。通过复制和粘贴来复制包含CGPoint bannerOrigin的行，并将bannerOrigin重命名为fallbackBannerOrigin，现在它如下所示：

    CGPoint bannerOrigin = CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
    CGPoint fallbackBannerOrigin = CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
    
    

11. 这将给我们两个框架进行调整，一个用于横幅，一个用于备用。

12. 找到检查横幅是否已加载的if语句，并在其后添加以下代码：

    else {
    fallbackBannerOrigin.y -= imageView.bounds.size.height;
    }
    
    

13. 当if语句为假时，此代码将执行，因此当横幅视图不可用时，此块将运行。类似于我们的横幅视图框架，我们通过其高度调整备用横幅框架，使其回到视图中。

14. 最后，我们在动画块中添加对框架的更改，并找到将横幅视图框架动画到视图中的行，并添加以下内容：

    imageView.frame = CGRectMake(imageView.bounds.origin.x, fallbackBannerOrigin.y, imageView.frame.size.width, imageView.frame.size.height);
    
    

15. 最终方法应如下代码片段所示：

    -(void) adjustBannerVisibility
    {
    CGRect frame = self.view.bounds;
    CGPoint bannerOrigin = CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
    CGPoint fallbackBannerOrigin = CGPointMake(CGRectGetMinX(frame), CGRectGetMaxY(frame));
    // check if the banner is loaded
    if (bannerView.bannerLoaded) {
    // bring banner into view
    bannerOrigin.y -= bannerView.bounds.size.height;
    }
    else {
    fallbackBannerOrigin.y -= imageView.bounds.size.height;
    }
    // Animate the frames view
    [UIView animateWithDuration:2.0f
    animations:^{
    bannerView.frame = CGRectMake(bannerView.bounds.origin.x, bannerOrigin.y, bannerView.frame.size.width, bannerView.frame.size.height);
    imageView.frame = CGRectMake(imageView.bounds.origin.x, fallbackBannerOrigin.y, imageView.frame.size.width, imageView.frame.size.height);
    }];
    }
    
    

16. 运行您的应用。您应该会看到备用横幅出现，然后如果可用，会与 iAd 网络的横幅进行交换。尝试关闭您的互联网连接以强制备用方案生效。

刚才发生了什么？

虽然这是一个非常基础的横幅系统，但它允许在 iAd 网络不可用的情况下继续产生一些收入。通过向应用的主要视图添加一个带有出口的图片视图，我们能够从我们的代码中引用它。有了可访问的备用图片，我们修改了adjustBannerVisibility方法，根据横幅视图的bannerLoaded属性来隐藏或显示我们的图片。

您可以使用这个横幅进行自己的推广，可能是其他应用，或者将空间出售给希望在您的应用内进行广告的人。您可以使用您的填充率和请求来估计此备用横幅出现的次数。然而，这不会包括用户离线的情况。

尝试一下英雄

我们的基于图片的横幅在 iAd 网络不可用时提供了一个合适的备用方案。如果您对 iOS 开发感到舒适，并希望提高横幅备用方案及其盈利能力，请考虑以下调整：

• 当设备切换到横屏方向时，用另一张图片替换图片视图。

• 使用图片视图出口和旋转方法来更新用于图片的文件。

• 从远程服务器下载您的横幅，以便您可以使用新的广告更新它们。

• 启用横幅可点击，并打开一个外部网页。

• 用替代广告网络的横幅视图替换我们的自定义图片。许多人使用来自谷歌的 AdMob—www.admob.com/。然而，还有许多较小的提供商可供选择。

摘要

通过跟踪收入和提供备用内容，您正在监控和提升您应用的财务成功。在本章的最后，您已经做了以下事情：

• 接受了在您的应用中显示实时广告所需的 Apple iAd 合同

• 在您的每个应用中激活了实时广告

• 学习了用于跟踪收入的术语

• 查看了您的应用产生的收入

• 在 iAd 网络不可用的情况下显示了备用横幅内容

拥有这些技能，您完全能够作为广告商和广告发布者接受 iAd。祝您好运！

附录 A. 快速问答 — 答案

第二章，准备您的内容

为什么我们要使用 ImageOptim 等软件优化我们的图像？	答案：C 由于图像通常可能包含不必要的数据，优化它们可以减少文件大小，从而使它们更快地下载到我们的 iAd 用户那里。
在预览中，您应该使用哪个工具来移除图像中的实色块以使部分图像透明？	答案：B“即时透明度”是正确的；之所以这样称呼，是因为 alpha 通常被用作表示图像透明度水平的术语。
在可能的情况下，您应该使用哪种图像格式？	答案：A 在可能的情况下，您应该使用 JPEG；它们能够被压缩以保持文件大小。
在什么情况下您需要使用 PNG 图像？	答案：B 当您有一个图像中的透明“透视”部分时，您会使用 PNG，因为 JPEG 不支持透明度。其他时候您也会使用 PNG，包括带有文本或清晰线条艺术的图像，以及带有大色块的图像。
您应该将声音文件转换成哪种音频格式？	答案：Bm4a 音频文件使用 AAC，iOS 设备能够快速有效地解码。
QuickTime 创建的“参考电影”做什么？	答案：C 参考电影根据用户的带宽选择视频的最佳版本。这确保了带宽较高的用户可以看到最佳质量的视频，而带宽较慢的网络用户不会浪费时间去等待内容加载。

第三章，制作您的 iAd

为什么我们应该调整我们的 iAd 横幅，使其在纵向和横向都看起来很好？	答案：B & D 这是一个陷阱问题！苹果要求每个 iAd 都能在纵向和横向工作，以便在任何方向上看起来都很好。支持这两种情况意味着我们的 iAd 可以出现在包含 iAd 横幅的任何应用中。
径向渐变是什么？	答案：C 径向渐变是两种或更多颜色圆之间的过渡；我们在 iAd Producer 中使用它们，因为它们可以在不使用任何图像的情况下生成一个轻量级的效果。
您在哪里可以找到您导入到 iAd 中的媒体？	答案：D 资产库包含您已导入到 iAd Producer 项目中的所有资产。要将媒体添加到资产库，只需将它们拖到资产库中，或者从菜单栏中选择文件然后导入资产。
一个在多个值之间变化的文本框叫什么名字？	答案：A 虽然其他名字更有趣，但多标签对象由几个单元格组成，这些单元格之间相互转换。

第四章，确保其工作

我们为什么要安装什么来使用 iOS 模拟器？	答案：A 同时安装了 Xcode 和 iOS SDK，以便我们能够访问模拟器。Xcode 是开发者用来构建可在 App Store 上找到的 iOS 和 Mac 应用的工具。
你如何在 iOS 模拟器中执行捏合手势？	答案：D 按住“ctrl”会在屏幕上显示两个触摸点；然后你可以点击并拖动来模拟两个手指捏合或展开屏幕。
如果你想测试你的 iAd 中的按钮，哪个是最好的选择？	答案：B 基于触摸的输入的不准确性只能通过真实的手指来测试，所以设备测试对于确保按钮和触摸区域足够大以便轻松点击是至关重要的。每次你触摸你的 iOS 设备的屏幕时，它都会执行数千次计算来确定触摸的中心，这是不能用鼠标点击来模拟的。
你已经更改了你其中一个元素的动画，并想看看它看起来如何；你会使用哪种方法？	答案：A，然后 B，然后 C。除了画布之外，所有这些都能显示动画将如何看起来；然而，在设备上进行测试是唯一知道它们将如何表现的方法。不应该使用 iAd 测试服务器进行此类测试；你应该只在发布你的 iAd 之前进行最终检查时使用它。
你已经导入了一些额外的资源，并想检查它们是否已正确缩放；你会使用以下哪个？	答案：A，B 和 D。在导入资源时，检查 iAd Producer 是否按你预期的分辨率缩放它们对于高分辨率视网膜和标准分辨率显示是有用的。在所有测试方法中，除了 Safari 之外，都可以在视网膜或标准分辨率中预览图形，尽管只有真正的视网膜设备才能显示图像的确切外观。

第五章，模板和对象

如果你想创建一个带有导航的空白菜单模板，你应该怎么做？	答案：D
在创建样式预设时，你知道保存了哪些样式？	答案：D 每次你保存样式预设时，都会显示一个可编辑的清单，其中列出了将随预设存储的样式。
你应该应用什么样式到一个高亮或被点击的按钮？	答案：A 你应该反转正常按钮的渐变，以创建一个按下、压入的感觉，模仿真实的按钮。
在正常或默认状态下，应该应用到按钮上的颜色是什么？	答案：B 你的正常按钮状态应该在上端较亮，在下端较暗。这会使按钮从屏幕中突出出来，使其看起来更真实。
为什么你可能想要防止你的启动页面和预播放视频之间的过渡？	答案：B 如果你的启动页面与你的视频的第一帧相匹配，那么你应该移除过渡以防止两者之间的闪烁。具体来说，预播放不应该将其过渡设置为无。
页面消失动作何时开始？	答案：C 构建出动画总是在页面消失过渡之前发生。

第六章，iAd 目的地

如何在 iAd Producer 的购买模板中获取数字商品所需的商店 ID？	答案：C 要获取商店 ID，我们使用 iTunes 应用中的 iTunes Store 搜索一个项目，然后点击价格旁边的菜单中的复制链接。然后我们可以从链接中获取 ID。
这个链接的商店 ID 是什么，用于一首歌曲 - itunes.apple.com/gb/album/a-beautiful-mine/id148031770?i=148032644?	答案：D 由于你只能在 iAds 中购买歌曲，而不是专辑，因此歌曲链接的商店 ID 是i=之后的部分。如果你尝试使用不正确的 ID，iAd Producer 将显示错误。

第七章，为大屏幕构建

在创建一个 iAd 时，为什么我们应该包含多个横幅？	答案：D 包含多个横幅创意意味着用户看到你的广告多次会看到一系列更新的横幅，使你的 iAd 看起来新鲜有趣。
页面消失动作何时开始？	答案：C 导航栏和标签栏布局类型将你的全屏横幅保持在横幅模式，有 655 像素的可用高度。因此，这是最有可能导致你的 iAd 出现问题的布局。

第八章，创建交互式广告

以下哪种方式是声明变量名cyril并使用字符串the squirrel has lost his nuts的正确方式？	答案：B 如果你的启动页面与你的视频的第一帧相匹配，那么你应该移除过渡，以防止两者之间出现闪烁。具体来说，预览不应该将其过渡设置为无。
以下哪一种是显示布尔值的正确方式？	答案：B 布尔值定义为 true 或 false，可以用来显示变量中的开/关状态，或者用来设置某些控件属性。

第九章，管理成功的 iAd 广告活动

你在广告中有一个商店搜索页面和一个画廊；你会怎么做？	答案：B 虽然在小广告上不包含部分可能很有吸引力，但请记住，你可能以后想修改和调整广告。比如说，你添加了另一个画廊或一个电子邮件联系表单；你现在可以使用从你广告的早期版本中捕获的分析数据。
给每一页一个部分，这样它们就容易被分离和识别。	答案：C 给每一页一个部分会违背使用部分作为页面和它们的事件已经分组和整理的目的。同样，忽略部分也会是一个错误，因为我们的页面之间有一些明显的相关性。最终，部分取决于你的整体分析策略和个人偏好——只要确保它们有意义。

第十章，将 iAd 添加到您的应用中

要使界面构建器中的对象在代码中可访问，您会怎么做：	答案：A 我们需要在我们的头文件和主文件中声明我们的出口，然后在界面构建器中将它连接到文件所有者。您可以从代码中以编程方式添加对象到您的视图中，但它们只会在运行时出现，不会在界面构建器中显示。
如果 iAd 横幅导致我们的应用崩溃，最常见的原因是什么：	答案：D 虽然不是崩溃的唯一原因，但很可能您忘记将 iAd 框架添加到项目的构建阶段。

第十一章：跟踪收入和回退

如果您的应用点击通过率低，您应该做什么：	答案：D 点击通过率是用户点击您的横幅视图的印象百分比，低值可能是由于横幅定位不佳造成的。您应该只显示一个横幅，增加横幅的数量不会提高点击通过率，甚至可能导致您的 iAd 合同被撤销。
什么是请求？	答案：C 只要用户在线，您应用内对 iAd 横幅的每个请求都将被 iAd 网络注册和跟踪。
由于填充率是您的应用请求中导致广告显示的百分比，您将如何计算它？	答案：B 填充率是通过计算返回横幅的网络请求的百分比来计算的。如果您的应用发送了 2000 个请求，并收到了 1000 个横幅，那么您的填充率是 50%，因为 100 除以 2000，再乘以 1000 等于 50。