用好的交互设计来管理复杂-“筛选器”

我们必须按照人们的行为方式来设计,而不是按照我们希望他们应有的行为来设计。


我们必须按照人们的行为方式来设计,而不是按照我们希望他们应有的行为来设计。

用好的交互设计来管理复杂-“筛选器”

好的设计不是让事情变得简单(如果复杂是符合需求的),而是去管理复杂。在《在做交互设计时,你需要知道这几大定律》中我们总结了Tesler’s >Law/泰思勒定律(复杂性守恒定律),这个定律告诉我们:每个应用程序都有固有的不可简化的复杂性,问题需要是由用户还是设计者去处理需要产品经理用心思考。有时复杂仅仅来源于那些应该经过过滤的大量信息。我们必须按照人们的行为方式来设计,而不是按照我们希望他们应有的行为来设计。

正如诺曼所说 “复杂是世界的一部分,但它不应该令人困惑 ” 好的设计能够帮助我们驯服复杂,不是让事物变得简单,而是去管理复杂。产品经理需要保持“设计者—产品—用户”的合作关系,让设计与复杂共生,使得复杂的内容变得简单易用且交互清晰。在诸多展示大量信息的功能中,“分类筛选”就是一个典型的Feature。 今天我们就来分析几类“筛选器”的交互设计,并剖析下他们的优劣。

第一类:分层级筛选

下拉菜单,浮层模式 (目前较为常见的模式)

这类展示模式更适合筛选内容分类较少,且分类层级不超过两层,通常情况下标签筛选内容不多于10个,同时能在2-3排展示完全。

常见App类型:云盘类、购物类、健身类、打车类等,如图所示:

用好的交互设计来管理复杂-“筛选器”

当筛选内容足够具体化,能高度的概括为耦合度较低的信息分类的情况下,建议使用本类筛选交互模式。因为这类模式的信息展示足够直接明显,用户操作步骤较少而且清晰。

全新浮层,全屏展示:

这类筛选器,一般来讲会囊括关键词筛选,同类信息排序两种内容。与其分散展现,不如聚合在一个整页做选择。这类交互模式更偏向筛选的关键词足够简洁易懂,同时有一定的定制思维在里面。通常情况下,关键词的覆盖内容更加贴合产品的核心表现,或者产品经理需要突出展示某类信息。

另外筛选的类型仅为一种,或者需要定制化。譬如地理位置、定位城市、O2O的不同模式及优势,与此同时,展示的信息需要不断扩充,或者有计划增加、修改的情况。如上的情况下选用新增一页的模式,扩展性更强,同时对版本交互稳定性会更高。

常见App类型:游记类、垂直电商类,如图所示:

用好的交互设计来管理复杂-“筛选器”

第二类:综合性筛选

底部Bar,抽屉模式:

用户习惯性的浏览方式,一般来讲是 “F” 的形状,即自左向右,自上而下。当这些关键区域被头条,副题,热点以及重要文章之类的核心入口占据时,

“筛选”这类重置页面内容的功能放置底部位置,就显得更加干净,且不喧兵夺主。同时基于用户操作习惯的考虑,抽屉式的页面弹出,扩展性会更强,内容聚合度会更高。

常见App类型:旅行类

用好的交互设计来管理复杂-“筛选器”

由于对内容筛选的要求较多,因此需要高度整合的筛选器,同时展示的区域普遍要求较大,信息承载较多,在选择筛选器设计交互形式的时候,通常会使用底部Bar,抽屉式的展示方式。

当需要筛选的内容为多种类型,且多层级,譬如:“国家-省份-城市”这类层层嵌套的模式,就建议使用底部Bar的展示方式。相对于“大众点评”及其他O2O的应用,选择自上而下的抽屉模式筛选器来说,更建议使用底部Bar的模式,因为底部Bar的筛选,当刷新数据时会更直接的看到内容的展示,而自上而下的抽屉模式会遮盖底部的内容展示,相对而言,信息筛选的及时性就降低了。

新开界面,复合嵌套:

当品类多,且分类细的时候,通常需要把类别做第一层框架的分类,然后在第一层框架中再进行一次分类,表现形式可以是Tab或者抽屉收起。

《设计心理学2》中提到:“日常的生活通常是复杂的,但并非由于某个特定活动时复杂的,而是因为有那么多表面上简单的活动,每一个都有它自己的一套特定的需求,把大量的简单活动合在一起,结果就会是复杂和令人困惑的:整体大于它各部分的总和”。所以对于大量内容及品类需要展示给用户的时候,产品设计不能过分简单,简单本身不一定是良性的,简单也不意味着更少的功能。

常见App类型:百货类

用好的交互设计来管理复杂-“筛选器”

对于不同的App应用,选择合适的内容筛选模式。对产品经理在交互设计及产品框架上的理解要求是比较高的,如何把零散且重要的信息聚合整理在一个小小的筛选器中,需要我们从产品功能的具体要求出发,考虑场景化及易用性的前提下,尽量做到合理。

 

作者:权莉,微信昵称:Mandy权。一名快乐的产品经理!

本文由 @权莉 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/27839/

(0)
CatherineCatherine
上一篇 2017-05-19 11:46
下一篇 2017-05-19 13:39

相关推荐

  • 高保真VS线框图,哪一种交互稿更能清晰准确地描述产品

    很多产品经常会纠结怎么把原型画得好看,哪个原型工具要彻底学会并熟练使用等等。但是团队的其他成员并不会关心你的原型画得多好看,也不关心用什么工具画,如果你能准备清晰表达出产品框架内容,也许在纸上画他们…

    2016-01-15
  • 简约而不简单,谈一谈移动开发中的那些极简设计

    设计是一件用户驱动很强的工作。随着用户越来越偏好更简洁的交互界面,如何剔除多余的元素,保留最基础最重要的元素是极简设计的关键。极简设计形式和功能完美结合。它最大的优点是极简的表现形式,简洁的线条,大方的留白,简约的图形化元素,就算是很复杂的内容,在这样的设计下也会显得很简洁和干练。当然,如果能有效的利用这些元素。

    2017-05-20
  • JDC丨京东设计中心 - 电商大促攻略页设计指南

    通常我们看到的旅游攻略,游戏攻略等都是以文章资讯的形式呈现,只可阅读不可交互。而电商大促活动中的攻略页,可不仅仅是一篇资讯文章那么简单,除了要向用户传达促销信息,往往承载着引流,预约,发券,传播等营…

    2018-03-27
  • 交互设计之流程设计(1)

    流程设计是将信息架构转变为交互稿的重要步骤,什么是流程设计呢?简单来说,就是用户完成一项任务的步骤流程,用户是怎样一步一步的完成任务的。本文将从流程设计重要性、如何进行流程设计、流程设计与交互工作三个方面来阐述流程设计。一、流程设计的重要性流程设计对于用户体验来说非常重要,一个好的流程设计将会给用户带来非常的体验。在这里从流程设计是什么、流程设计中需要考虑的问题、优秀流程设计的好处三个方便来进行讲解。1 流程设计是什么首先理解交互设计是...

    2018-05-06
  • Android和iOS平台交互方式的不同点

    本篇文章属于很初级的内容,之所以写下来,一是为了整理一下自己的思路,二是为了方便初学者们快速了解 Android和IOS在交互上的很多区别。可能有些地方不是完全正确,望多交流。

    2017-06-03
  • 产品经理的UX——移动端的输入操作设计

    UX是User experience的缩写,指用户体验,UX设计指以用户体验为中心的设计。UX Planet (uxplanet.org)上面讨论很多关于移动设计里做好UX的技巧,很多观点都非常具有指导意义。

    2017-05-19
  • UI风水学:你该知道的9个UI设计门道

    好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
    好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
    好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。

    2017-05-12
  • 总结七大设计原则,打造高素质的UI界面

    虽然好设计的原则是老生常谈,但是我们还是要经常总结,结合自己的设计,三省吾身。

    2017-05-11
  • 交互设计师的60日计划之第九天

    今天参与了用户访谈,啊不,是旁听了用户访谈,躲在小黑屋里观察用户的表情动作,听他的描述,挺有趣。 20150805 用户和我们预想的完全不同前两天有讲过准备了访谈前的一些问题和任务提供给用研同学,今天真的见到…

    交互专题 2015-08-20
  • 超全面!界面交互动效核心知识的分类与总结

    Echo  :这篇文章是基于我自己的理解对界面交互动效设计 进行了分类整理和总结。

    2017-09-13