决定假期不体验iOSWow；我不会愿意完成手头的翻译。去年年底，我们学习了一篇文章《GuidingMobileApplicationInterfaceDesignPatterns》。英文原文来自O'ReillyZoo的一本新书《MobileDesignPatternGallery》，就是封面上有一只大公鸡的Son。本次这篇文章来自本书第四章——搜索、排序和过滤。XX出版社好像也在搞国产进口版。这真的与我无关，我将自己开始。接下来，果断而精细地划分，进入原作者的个性。许多信息服务站点将相关内容信息进行分类整理，如交通工具方面的货车、货车、SUV等；而像Greensheet这样的网站直接一页一页地堆砌销售信息。其中，我（英文原文的作者）要想找到什么，还真得一一阅读。谢谢，我还不如在手机上使用Craigslist应用程序。在使用Craigslist的过程中，我想，作为普通用户，我们显然可以从那些在信息搜索、排序和过滤方面做得很好的UI设计模式中获益。在本文中，我们将看看哪些设计模式可以帮助我们以用户期望的方式更有效地组织和呈现数据信息。搜索先推荐两本这方面的好书，《SearchPatterns:DesignforDiscovery》和《DesigningSearch:UXStrategiesforeCommerceSuccess》（前者国内已有介绍，即本书《搜索模式》）。然后我们继续研究与移动应用程序中的搜索相关的设计模式。显式搜索自动完成动态搜索指定搜索范围已保存/最近搜索项搜索表单搜索结果显式搜索显式搜索作为最常见和常见的搜索方式，依赖于显式的动作和行为来执行搜索任务，显示搜索结果。在这种模式下，搜索按钮出现在输入字段的右侧，或者直接嵌入虚拟键盘中（在这种情况下，“取消”按钮可以放在搜索字段中）。搜索结果通常显示在搜索栏正下方的区域中。在您的设计中，考虑使用具有自动完成模式的线性搜索。该方式提供了显式的搜索按钮，也可以为用户提供取消当前搜索行为的操作方法。在执行搜索时提供清晰的状态反馈。123456789下一页自动补全可以说这是随着Web2.0浪潮涌现的最经典实用的搜索方式。当用户输入关键词时，系统会立即提供一些根据当前输入的文字猜测的搜索结果。如果用户发现其中一项正是他想要的，他可以直接点击完成搜索。当然，这仍然是一种常见的模式，适用于没有合适候选人或用户觉得不手动输入完整关键字就无法生存的搜索功能。理想情况下，系统应该在用户输入后立即提供搜索结果，但在实践中，反馈系统工作状态的视觉提示也是必要的。上图右侧，Netflix直接将状态提示放在关键字输入框的右端；另一种常见做法是将其放置在搜索结果将出现的位置。TripAdvisor提供了更优秀的自动完成模式。他们直接根据热门旅游目的地、酒店和其他类型对即时搜索结果进行分类。LinkedIn的做法有点类似，他们会优先考虑那些与当前用户有直接关系的搜索结果#p#通过视觉提示将系统当前的工作状态反馈给用户；可以考虑将搜索结果中当前输入的字符作为重点。上一页123456789下一页动态搜索这种模式也可以称为“动态筛选”，当用户在搜索栏中输入关键字时，现有的搜索结果将进行动态筛选。看起来这与之前的“自动完成”模式类似，但实际上它们在交互模型上有所不同。动态搜索模式的主要功能是对已有的信息列表进行提炼和过滤。动态搜索模式用于动态地细化和过滤数据集，例如，它可用于地址簿或个人媒体库等应用程序。但是这种模型不适用于数据规模过大的情况。指定搜索范围在某些情况下，用户可以在执行搜索前定义搜索对象的类型和范围，以获得更符合要求的搜索结果。Google和Photobucket应用在指定搜索范围的操作形式上略有不同，但最终目的是一致的。AllRecipes和Dropbox应用程序采用了类似的方法。在Dropbox中，默认的搜索范围是所有内容，但无论搜索执行前还是搜索结束后，用户都可以进一步选择搜索范围，比如搜索文件或文件夹。根据产品自身情况，合理划分搜索类型，方便用户在搜索时进行选择。通常三到六个选项就够了，必要时可以通过表单实现高级搜索功能。上一页123456789下一页已保存/最近搜索良好的移动应用程序界面设计尊重最基本的可用性原则之一：尊重用户努力。在搜索中，保存的或最近的搜索结果是这个原则的一个很好的例子。通过这两种方式，用户可以很方便地选择搜索过的关键词，完全不需要重新输入。#p#与此可用性原则相关的设计模式包括Trulia中基于位置的搜索、Amazon中的条形码搜索、GoogleShopper中的扫描和语音搜索以及按搜索日期分组的搜索历史记录。在保存搜索结果的模式中，用户通常还会采取额外的步骤来命名搜索结果，作为索引它们以供将来查看的一种方式。“最近搜索项目”由系统自行保存和呈现。对于自己的产品，需要考虑哪种方式更合适。Previous123456789NextSearchForm用户可以在搜索表单中使用一些高级搜索选项，例如以某种方式选择搜索范围等。此外，搜索表单通常包括视觉上突出的搜索按钮。尽量限制搜索表单中交互元素的数量，并以正确的方式使用它们。在视觉上注意细节，例如元素的对齐方式、文本标签的布局和字体大小等。搜索结果我们将搜索结果本身视为整体搜索功能中的一种模式。搜索结果可以出现在与搜索操作相同的界面中，也可以出现在单独的搜索结果界面中，具体取决于要求。搜索结果可以以多种方式呈现，包括表格、列表、缩略图等，也可以在地图上显示。同一应用程序可以同时使用多个不同的搜索结果表示形式，具体取决于搜索结果的类型和用户的设置。许多应用在搜索结果中使用延迟加载，即先加载部分搜索结果，然后继续加载其他部分。通常有两种方式来触发更多内容的加载#p#，一种是自动加载，另一种是手动点击某个按钮或链接来执行。我们可以使用懒加载技术来代替传统的逐页浏览方式，尤其是在移动应用的上下文中，逐页导航的方式违背了自然的交互模型，不符合用户的直觉。此外，***让用户知道搜索结果中的条目总数，并为搜索结果提供合理的默认排序规则。上一页123456789下一页排序为搜索结果选择最合适的默认排序方式非常重要。通常，我们可以根据我们产品的实际特性和用户期望设置进行调整。改变搜索结果排序方式的设计模式大致有三种：排序开关排序选择器排序表单排序开关如果没有太多可选的排序方式，我们可以采用这种最简单的方案。将排序切换按钮放置在搜索结果的顶部或底部（取决于界面中其他相关元素的布局）允许用户在不离开当前视图的情况下轻松更改排序方式。下图右侧的Target应用，将四种排序方式集成到三个切换按钮中，其中的“价格”可以进一步切换为升序或降序。排序切换应该具有“当前”状态的清晰明确的视觉表示。排序选择器选择器模式可以很好地替代切换模式。该模式下可以使用多种类型的UI控件，具体使用方法请参考不同系统平台提供的设计规范。比如在Android应用中，菜单形式比较常见，而对于iOS，选择器（picker）和动作表（actionsheet）是比较合适的控件。与切换模式相比，选择器模式允许更长的文本标题和更多选项。在上方，沃尔玛的Android应用程序在搜索栏中放置了一个按钮，用于打开排序弹出窗口。在下图中，Kayak的iPhone应用程序将用于展开排序选择器的按钮放在搜索结果的底部。此外，Android中的组合框和iOS中的弹出式覆盖菜单都可以在这种模式下使用。参考相关系统平台的设计规范，在排序选择器模式下使用最合适的UI控件。当前选择的排序方法应以清晰且易于识别的视觉表示形式突出显示。#p#SortingForm许多应用程序会在同一界面中集成和使用多种排序和过滤方法。这种方法通常称为“精炼（refine）”，非常复杂，但可以帮助用户得到最准确的搜索结果。在移动应用中，“求精”的方式大多承载在表单界面中，用户需要根据自己的需要进行选择，并提交这些搜索条件。请在实际产品中优先考虑开关模式或选择器模式，以尽量减少产品复杂度。筛选包含大量数据的内容列表需要进一步筛选，以便更有效地向用户传达信息。常规过滤模式包括：FilterToggleFilterExpandedListFilterDialogBoxFilterFormFilterToggle类似于SortToggle模式，FilterToggle也会显示在搜索结果界面中，比如界面的顶部或底部。通常只需单击一下，用户就可以进一步过滤搜索结果。HeyZap应用程序使用标准的切换按钮控件，而Google使用垂直选项卡。CBSNews和ACLFestival应用程序都使用可水平滚动的过滤栏，允许用户在不同类型的内容列表之间快速切换。但是，不建议将此方法用作应用程序的主要导航。SXSW应用程序结合了两层过滤按钮栏；而FeedaFever新闻阅读器将两个组合框以非常简单的视觉风格排列在一起，作为一组统一的过滤切换组件。过滤器选项的文案必须清晰易懂；选择后，必须清楚地显示“当前”状态。Previous123456789NextFilterExpandList这也是一种非常有效的信息过滤方式。在界面底部或侧面滑动或点击某种“手柄”，将展开一个带有筛选选项的列表界面。在下图中，我们可以看到Audible应用的扩展列表中只有一个简单的过滤器切换条，而Sam的扩展列表提供的过滤项要复杂得多。但对于后者，更好的设计方案是去掉“过滤”按钮，这样地图就可以随着用户的选择而动态更新。过滤器对话框弹出对话框是模态的。用户必须选择过滤选项，或取消过滤操作。TripAdvisor的iOS应用程序使用自定义过滤器对话框，而USPS的Android应用程序在对话框中使用系统本机控件。#p#Dialog窗口模式确实可以很好的完成筛选任务，但是前两种模式不包含具有模态特性的控件元素，可以让用户在不脱离当前界面上下文的情况下更自由地尝试各种选项。过滤器选项。在弹出对话框窗口的方式下，尽量让选项列表间断，避免滚动。Previous123456789NextFilterForm与前面提到的排序表单模式类似，我们可以在一个表单界面中组合一些高级数据过滤和细化选项。例如，WorldMate允许用户在筛选表单中按价格、品牌和许可证筛选某个位置的酒店信息。Zappos的应用程序采用类似的方法，但它们基本上使用原生iOS界面控件。Freetime在过滤器表单中使用高度可定制的控制元素。用户首先需要在其中选择一个主要的分类项，然后在相应的二级过滤栏中进行选择，最后提交这些过滤选项。条件过滤是一种比较高级的过滤机制。我们可以在Wufoo的web应用中看到这种标准的过滤模式：在移动应用中使用各种控件创建复杂的过滤表单并不容易。不过，Roambi似乎做得很好：不要过度设计过滤机制。通常，保留在当前界面的过滤切换模式或扩展列表模式即可。如果信息结构比较复杂，必须采用表格模式，那么就必须严格遵循系统平台的设计规范和具有普遍意义的最佳实践模式。
