购物应用
购物应用的创意设计书介绍 Windows 8.1 的虚构购物应用。通过查看本主题中的方案并了解如何在应用中利用 Microsoft 设计语言，你可以获得设计你自己的购物应用的灵感。
提供示例代码：Tallan Inc. 已经根据购物应用创意设计书，创建了一个很好的示例应用。你可以下载他们的示例应用，了解对本创意设计书中所述功能的真实实现及更多信息。请在此处下载 Tallan 示例购物应用。
购物应用方案
本主题中所述的购物应用使用 Microsoft 设计功能为用户创建引人的购物体验。
| 动态磁贴和浏览 | 搜索和窗口大小调整 | 共享 |
.png "动态磁贴和浏览的映像") |
.png "搜索的映像") |
.png "共享的映像") |
将用户吸引到应用的内容中
你可以使用 Microsoft 设计语言创建有趣、轻松和强大的非正式浏览体验。你还可以使用动态磁贴将用户吸引到你的应用中。按照此方案操作，了解如何可以使你的购物应用有吸引力。
.png "动态磁贴和浏览的映像")
Matt Berg 在他从家到办公室的途中要在公共汽车上使用他的 Windows 8.1 平板电脑。
|
内容为“刚刚到货:”的动态磁贴提醒 Matt 一件新的有特色的秋季时装已经到货。Matt 很感兴趣，因此他单击该磁贴进入应用。
|
Matt 需要一件新夹克，因此他单击“过肩”类别。
|
类别视图是按水平方向布局的，包含在同一画布上显示的所有选项的详细视图。Matt 可以直接浏览，而不必在任何内容层次结构中导航。
|
Matt 收缩以激活语义式缩放，这使他能够快速查看并导航商品列表。
|
在单击“夹克”部分之后，Matt 选择了一件夹克以在商品视图中查看它，然后将其添加到他的购物车中。
|
Matt 通过购买该夹克以及他之前已添加到其购物车中的一件衬衣，完成了其购物。
|
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
动态磁贴和浏览方案的摘要
在此方案中，我们将看到利用以下设计元素的使用案例：
- 通过显示与该用户相关的信息，动态磁贴将用户吸引回到你的应用中。
- 你的内容不加任何装饰地在你的应用中闪耀，并使用户能够沉浸在他们很关注的体验中。
有关动态磁贴和语义式缩放的信息，请参阅以下内容：
有关为你的应用选择最佳导航模式的帮助，请参阅导航模式。
推动用户参与
当用户通过添加搜索框，通过实现搜索合约和支持用户的多任务，以及通过设计在调整到较窄宽度时可以正常运行的应用准备购物时，你可以使用 Microsoft 设计语言吸引他们。
.png "动态磁贴和浏览的映像")
Jon Rodman 要使用其 Windows 8.1 平板电脑浏览某个时尚博客。
|
通过 Internet Explorer 或任何其他应用，Jon 可以从右侧引入“搜索”超级按钮并搜索某个相似的夹克。
|
|
Jon 选择“从头到脚”应用，该应用显示术语“夹克”的搜索结果。
|
Jon 使用筛选器根据价格缩小搜索结果。然后他选择某个商品。
|
Jon 将应用调整到左侧，这样他可以将该商品与博客中的夹克相比较。Jon 对他的选择很满意，将该夹克添加到其购物车中。
|
尽管仍处于较窄宽度中，Jon 决定完成其购买。
|
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
推动用户参与的摘要
在此方案中，我们将看到利用以下设计元素的使用案例：
- 当你的客户打算购买时，“搜索”合约将你的应用置于潜在目标列表中。
- 在较窄宽度中可以很好运行的应用使客户能够浏览你的内容并将其与其他应用和网站相比较。
有关搜索和窗口大小的信息，请参阅以下内容：
连接与分享
你可以使用 Microsoft 设计语言将用户连接到任何其他应用、联系人或社交网络。
.png "动态磁贴和浏览的映像")
David Hamilton 刚刚购买了一件新夹克。在下订单之后，他受鼓励分享了这一新闻。
|
David 使用“共享”合约来与其朋友分享该促销代码。
|
.png "动态磁贴和浏览的映像")
.png "动态磁贴和浏览的映像")
连接用户与分享摘要
在此方案中，我们将看到利用以下设计元素的使用案例：
- 你可以使你的内容作为共享来源，然后 Windows 8.1 将你连接到其他应用、电子邮件和社交网络。
- 你可以使你的应用进入“共享”目标并接收内容、链接或任何其他类型的结构化数据。
有关共享的信息，请参阅以下内容：