美文网首页交互设计移动交互交互学习
交互那些事儿——搜索模式探索

交互那些事儿——搜索模式探索

作者: 大鸽子Z | 来源:发表于2015-04-28 10:18 被阅读909次

    本篇是关于移动端搜索模式的学习总结,通过搜索的方式、搜索结果的排序和筛选三方面来总结。

    一、搜索模式

    1、模态搜索

    “模态搜索”是现今大家熟知的一种搜索方式。以知乎为例,其搜索框位于导航抽屉内,但是只要点击搜索框,“搜索模式”就会显示为一个带有弹出键盘的完整搜索页。

    ios版知乎

    模态搜索的主要好处在于用单个搜索页面增加了搜索空间。要记住,为那些最终不打算搜索的用户提供一个返回的途径,即一个“清除”按钮和取消模态搜索的选项,同时使用反馈来表示系统正在进行的操作。

    2、自动完成搜索

    现在移动设计已进入成熟阶段,自动完成功能应该成为显示搜索模式的标配。自动完成 搜索即用户输入文字时,会自动出现一组可能的结果,当用户继续输入,搜索结果相应减少。点击任何一项结果就会触发搜索。

    ios版穷游

    目前电商类的应用设计了增强型的自动完成搜索,它将每一项提示有可能所属的类别都显示出来。这样的设计另用户可以更方便地直接进入到最相关的搜索结果。

    ios版京东

    3、限定范围的搜索

    有些时候,如果让用户在开始搜索前就先设定好搜索范围,他们就能更便捷地得到搜索结果。如安卓版的Google play store在搜索框下面放置了一个下拉菜单控件。在ios平台上,常常用分段控件实现限定范围的搜索,但也可以选用其他的UI控件,比如滚动选项卡或胶囊导航栏。

    安卓版Google play和ios版知乎

    4、保存的搜索、最近搜索记录和热门搜索

    优秀的移动应用界面设计都会遵循基本的可用性准则:尊重用户付出的努力。保存的搜索、最近的搜索记录和热门搜索就是通过选择先前的搜索记录,实现搜索流程的简化,让用户不必重复输入相同的关键词或搜索条件。

    ios版京东

    5、搜索结果、查看结果

    在执行搜索后,搜索结果可以在同一页面显示,也可以跳转到专门的搜索结果页。搜索结果可以显示为表格、列表、地图、卫星图或缩略图的形式。

    ios版穷游攻略根据搜索结果的信息类型使用了三种形式显示其搜索结果

    二、排序模式

    当你浏览许许多多应用时,可能会奇怪,这些应用时按什么顺序排列的呢?是受欢迎程度、评分高低还是发布日期?当无从知晓的情况下,你可能要到别的地方去研究一下,再去下载。现实中排序模式确实能极大的提高搜索的可用性。可以考虑在搜索结果中运用一下模式:单页排序和排序浮层。

    1、单页排序

    在只需要少数几种排序选项的情况下,单页排序可以作为一种简单的一键式解决方案。在安卓应用中,下拉菜单控件可以很好地用来选择排列顺序。虽然不嫩一眼看到全部的排序选项,但它可以清晰地指明那个选项是活动的。

    安卓版印象笔记和ios版京东

    2、排序浮层

    出了单页排序,排序浮层也是一种很好的备选方案。这种模式不会占用宝贵的屏幕空间。用户可以通过点击排序标签或图标开启浮层,可以将它放在搜索结果页面的顶部、中间或者底部。

    ios版蝉游记

    三、筛选模式

    大型数据集可能因数量太大太难处理而变得几乎没用,为了让数据有意义,用户经常需要对结果进行筛选和细化。筛选器允许用户选择条件来所见数据集,只留下对他们来说最可用、最相关的搜索结果。

    1、单页筛选

    与单页排序一样,单页筛选显示在搜索结果页。点击后,筛选立即执行。

    iTunes和Google play

    2、筛选浮层可参考排序浮层。

    相关文章

      网友评论

        本文标题:交互那些事儿——搜索模式探索

        本文链接:https://www.haomeiwen.com/subject/fykvfttx.html