设计出你最好的应用
本主题帮助你设计外观和感觉像集成到 Windows 和 Windows Phone 平台的应用。本主题以及其他设计流程主题中的设计原则和策略对于使你的应用在日益扩大的应用商店中脱颖而出十分关键。在设计阶段遵循它们还使你可以更轻松地解决迭代时可能会发现的可用性问题。优质设计可支持优良的客户体验和查看体验，这对于使你的应用胜出竞争对手非常重要。
有关集体讨论和规划的信息，请参阅应用概念化。
设计原型的关键特性
设计原型涉及将你目前所做的所有集体讨论的结果综合起来。在本部分，你将了解如何制作应用外观模型的草稿并使用它们测试设计的关键特性。
原型不仅有利于质量，还可以节省时间并避免挫败感。遵循本部分的建议可帮助你在更短的时间内生成更好的应用。
Blend for Visual Studio 对于快速制作真实的原型十分有用。通过 Blend，你可以制作模型草稿并创建交互原型。交互原型可帮助需要自定义 UI、动画或切换的应用区域，让用户可以看懂这些体验。该交互通常对应用的成功很重要，它允许用户在可用性测试时“感受”它。Blend 还使你可以直接通过原型创建真实有效的设计。要阅读关于 Blend 的详细信息，请访问 Microsoft Expression 主页。
PowerPoint Storyboarding 与 Microsoft Visual Studio 2012 一起提供，它是可用于制作草稿的另一款工具。采用该工具，你可以从预定义的情节提要形状集合构建情节提要，并捕获现有的用户界面。有关详细信息，请参阅使用 PowerPoint 为用户情景或要求制作情节提要。
草稿概念
在本节，你将了解如何创建应用的模型。
为你的设计制作原型的第一个阶段应该从纸和笔开始，然后快速转移到在电脑上制作草图。为移动设备制作应用草图不同于为桌面软件制作草图。情节提要在此用处较小，因为这些应用的导航层次结构较浅并且范围较窄。对于移动 UI 的挑战在于以直观和动态的方式呈现操作和数据。
如果你的应用涉及专家级的任务，请使用情节提要单独处理它们以确保它们具有尽可能少（并且尽可能简单）的步骤。以下是通用流式收音机应用的一系列原型草稿。
制作用户最常见和最常用的静态屏幕的草稿。例如，下图显示了流式收音机应用的初步图形。你将看到主屏幕、类别、艺术家信息视图和收藏夹电台列表的模型。
.png "主要屏幕")
主要屏幕
如果你的应用要向用户显示特定的暂时状态，请绘出其外观的草稿。在该示例中，如果你构建音乐播放器应用，绘制设置的视图以及初始屏幕。
.png "几个状态")
几个状态
制作你可能自定义的重要控件的草稿。思考如何使用自定义控件简化你的屏幕分类。该模型显示了详细的播放控件，以及带有控件的特殊横向视图。
.png "重要控件")
重要控件
现在，你可以将一些屏幕结合为用于完成任务的一系列步骤。计划用户需要用于完成重要任务或操作的步骤。按顺序绘制任务每个步骤中涉及的静态屏幕。下图显示了描绘从搜索操作到查看艺术家信息的完整的流的模型。
.png "常见搜索任务")
常见搜索任务
若要完成该步骤，首先需要列出用户使用你的应用完成的所有任务：例如，搜索音乐流派，或者将新电台添加到收藏夹列表。然后，为每个标识的任务绘制地图。这些地图显示通过屏幕完成给定任务的路径。
请尝试绘制应用所有部分的静态屏幕之间的完整关系。在用户进行任务的过程中，努力让相关的屏幕在外观和功能上营造一种正在处理进程的感觉。下图显示了简单的流式收音机应用的完整信息体系结构地图。
.png "总地图")
总地图
总地图不同于任务地图。在静态总地图上，你不会显示完成给定任务的流，但会简单地显示每个屏幕以及它们之间的分层关系。你可以在上个示例中看到，可以从主屏幕转到收藏夹、类别以及搜索结果屏幕。
在将一些图形固定到墙上之后，请通过在 Blend for Visual Studio 中打开新项目来开始制作原型。
当你通过 Blend 制作原型时，将在场景后为你写出随附 XAML 标记。这允许你在迭代时创建布局和样式。这些项目可能保真度较低，但它们采用与生产应用的项目相同的格式，因此它们可以兼容。
标识要制作原型或模拟的关键区域
可通过选择集中处理的特定区域快速制作移动应用的原型。没有必要为应用的每个方面制作具有高级别细节的原型。选择最重要或最有挑战性的部分并专注于为其制作原型。通常，设计人员应该优先处理新技术或功能或者开发团队常用专业知识之外的任何内容。
对于大部分应用，这意味着模拟可向用户提供价值的任务或操作。请考虑你用于为应用展望目标的语句。按照你对它们每一步运行过程的想象为其制作原型，并注意自定义控件可减少步骤或以其他方式加快速度的方面。
一般而言，将应用从 Web 或另一个平台转移的 Windows Phone 要求应用屏幕可以呈现更少的控件和图形并减少混乱。可能需要采用合理版式在多个屏幕上分布任务，而在 Web 上，控件更可能嵌套在较大的组中。请确保你意识到是否需要放大作为应用特色的图形、内容或照片。请确保使用本机控件制作原型，并尽量不使用 WebView 控件。
请提前决定多少次迭代较为实际。
决定原型细节级别
若要快速制作原型并进展到构建阶段，请决定应用的哪些元素应该在迭代时优先处理。这涉及到决定你为应用的以下部分制作原型的深度：
视觉细节的级别
如果该应用的项目负责人最优先处理艺术效果和外观，则确保创建一系列高度细节化的功能、屏幕或状态的图形。你还应该模拟自定义控件及其状态。
在 Blend for Visual Studio 中模拟自定义控件或用户控件将为你提供 XAML 标记，它将帮助你构建生产控件。
视觉细节模型应包括：
- 样式和主题
- 初始屏幕
- 应用磁贴
功能细节的级别
你的应用的核心是功能吗？如果是，你可能希望构建可交互并具有半数功能的原型。请从静态屏幕或静态屏幕组入手，并在它们之间依次构建交互。请考虑如何简化功能以及减少控件或输入的必要性。
内容细节的级别
如果应用的项目负责人主要考虑提供内容，你在构建 UI 时，可能要决定如何创建尽可能精确的占位符。如果你的内容是文本，请在模拟你的设计时密切注意版式并使用填充文本（而非块或其他让人分心的元素）来代表将放置内容的位置。
如果你的应用将提供视觉媒体，你可能要在制作原型的过程中添加纸和笔。绘制应用内容在播放时的细节化草稿，并在你的图形中包含横向和纵向。请记住要考虑自定义控件或在方向转变时更改其布局。
如果你计划本地化你的应用，应该在此阶段确保为需要该应用的语言留出足够的空间，还应该为全球化问题做准备。你可以阅读其他参考以了解自定义和全球化问题。
品牌细节的级别
如果你针对商业目的构建应用并且品牌得到管理，请制作全面的具有品牌视觉元素的原型并高度注意细节。这将确保你最后的产品不会偏离公司的标准颜色、布局和徽标。
遵循一致性的自定义
自定义视觉元素可能会提升应用的质量、原创性或品牌。请提前决定自定义应用中多少可视设计，并对这些元素进行相应的规划。在应用设计流程较后的阶段引入自定义艺术元素和品牌可能比较困难。
你应该自定义的一些元素包括：主题、模板、控件和样式。
无论何时自定义 Windows Phone 中的视觉元素，都遵循以下指南：
较之于现实主义，更倾向于实际操作。
总体而言，应用不应包含追求模仿现实生活的自定义控件。例如，收音机应用不应使用拨号盘、旋钮或一系列按钮来控制电台的选择。相反，它应该使用滑块控件调整频率、使用播放/暂停按钮切换收音机打开和关闭状态，并使用“收藏夹”按钮保存预设的电台。
.png "FM Radio 应用")
FM Radio 应用
为了实际使用，在应用以全屏模式显示内容或玩游戏时，将一些或所有控件、应用栏和状态栏淡出或删除是非常明智的。
较之于现实主义，更倾向于实际操作。
为了在应用中使用自定义控件实现一致性和可靠性，请注意确保应用包含基本设计样式，其中符号、形状、字词以及颜色都有一致的意义。
如果你计划呈现互相影响的不相关的自定义控件组，请注意确保所有可能的控件组合都合理并以预期方式运行。
如果可实际操作，请绘制自定义控件之间可能的交互以确保所有可能发生的操作都合理。如果某些组合强制让用户进入使人困惑的应用场景，请使用替代设计。
可用性测试
现在，你的原型已变得精简，请停止设计并检查它是否脱离了设计的参数。通过提出以下问题来检查你的设备是否充分利用了平台和 OS。
用于检查原型的问题
- 你的应用设计是否明显体现了它利用 Windows Phone 硬件的方式？
- 你的应用的任务是否便于操作？
- 你的应用是否提供了过多信息或功能？或许提供的信息过少？
- 你的应用是否允许用户执行他们认为有价值的任务或操作？
- 你是否来自另一个移动平台？Windows Phone 用户期待更少的点击次数、更清晰的视图、较大的版式以及对于对比度和颜色的使用。
- 你是否使用了两个滚动轴（X 和 Y 轴）和方向（纵向和横向）？用户可能期待两者都有，具体取决于应用的目的。
- 可以使用指尖轻松操作控件吗？控件文本是否易读？
- 你的 UI 是否针对触摸和进程提供反馈？
- 是否已说明硬件后退按钮的用法？
- 你是否谨慎地使用嵌入的 Web 内容（和 WebView 控件）？
- 在以全屏播放内容时，你的应用是否会淡出状态栏、控件和应用栏？
- 你是否正确有效地使用透视和中心控件？
测试自定义 UI 元素
模拟玩自定义 UI 元素后，请确保亲自测试它们。如果你使用 Blend for Visual Studio 工作，你可以模拟页面或控件（使用“行为”功能）以及它的视觉对象的行为。
咨询用户
一旦你开始制作原型，请在应用的目标受众之中寻找一小群受信任的人。在你可接受的程度下，开始向受信任的用户展示原型。不要解释它们预期的工作方式；相反，等待并观察用户是否能轻松理解应用的功能及其操作方式。
总体而言，请为早期用户测试使用具有视觉细节的模型，而非线框图形。线框图形不能创造对用户体验的精确模拟。
尽早与客户交流
如果你设计的是用于商务的应用，请确保在目标用户之外测试经理和非专业人员的需求和优先事项。例如，项目管理软件应该可用于项目工作人员，还应该可用于希望使用应用检查项目进度的上级。
不要成为用户对于越来越多功能的要求的牺牲品。虽然某些用户反馈可能会向你警报严重的 UI 问题，但大部分用户反馈一般都应该全盘吸收。使你的应用保持专注和简洁。请记住，用户通常更擅长阐明在应用中的目标，而不太擅长作出关于 UI 或交互的详细建议。
创建最终模型
在设计流程的该阶段，你的应用应该已符合上述可用性指南。在评测最终模型时，请按照以下步骤操作：
- 确定你的原型是否符合集体讨论时计划的需求和标准。
- 接下来，决定你的模型是否达到了最终应用审查流程要求的细节级别。在阅读“设计原型的关键特性”之后，回忆你确定原型需要的细节级别。
- 最终的模型应该包含以下对象的适当级别的细节：
- 视觉元素—是否清晰、明了并简洁地呈现了版式和内容？你的应用在视觉上有吸引力吗？
- 功能元素—任务是否在目标和操作方面都很直观？应用功能和操作方式是否明确？
- 控件元素—所有自定义控件是否都依照一致的内部设计语言运行？它们的大小和间距是否便于触摸操作？
- 品牌元素—你是否精确地再现了颜色和徽标？所有艺术元素是否都符合版权规定？
- 确保你已保留制作原型时绘制的交互。按你想要的方式检查最常见或最重要的任务和操作外观和流。
- 在完成设计并投入生产后，你可以开始准备使自己的应用符合设计要求，以便进行提交。