关于交互设计的一些整理

什么是交互设计?交互设计的对象是行为。交互设计的五要素为人、动作、工具或媒介、目的、和场景[1]。交互设计在整个环节中的作用是至关重要的。如果说信息架构是骨,界面是面,UI是妆,那么交互设计就是髓。界面的架构、元素布局,都是在确定了用户的操作流程之后才确定的。虽然交互设计并没有特定的视觉存在形式,但却统摄着产品的使用逻辑,无处不在的影响着用户使用系统时的体验。或者可以说交互设计以用户操作流程为主线,将产品的各个功能以一种符合用户心理预期的形式组织了起来。

因为交互强调的是行为互动,因此交互设计应该实时注意交互行为发生时用户的可能情绪波动,以及相应的交互会引起用户的情绪波动。如何通过必要的交互手段,加强和消减相应的情绪波动。

1从交互的存在方式看,交互有显性交互与隐性交互之分。

1.1显性交互,我以为应该从两个层面来思考。第一个层面是信息层面。第二个层面是系统层面。

1.1.1信息层面,即用户为实现一定目的,通过一系列行为从系统获取信息的过程。在这一过程中,

       a 用户获取信息的行为流程是如何安排的?标准是什么?

       b 信息以何种方式,按照何种逻辑顺序呈现给用户?

       c 这整个过程中用什么方式帮助用户更好地获取信息?

也即人与信息的交互。那么为了有效的实现人与信息的交互,设计师需要仔细研究人本身,研究信息本身,研究人与信息的关系,还要研究人获取信息所处的环境场所对于人、信息、人与信息间关系的影响。以此作为信息层面交互设计的出发点。

1.1.2系统层面,即用户操作系统获取目标信息过程中必然需要与承载信息的载体(系统)进行必要的互动,那么用户在获取信息过程中,

       a 系统可提供的操作方式是否符合用户的操作习惯?是否符合用户的认知习惯?

       b 系统对用户的每一步如何反馈的?怎样反馈?

       c 系统如何保障用户在连续操作过程中的流畅性体验?

       d 整个过程是否否合用户心理预期?是否会给用户造成认知成本?

也即人与信息载体(系统)的交互。那么,为了有效的实现人与系统的交互,设计师仍然需要研究人,研究系统(这里对于系统的研究就涉及到对搭载系统运行的平台---Android操作系统与iOS操作系统的系统研究,以及系统本身---产品战略、产品逻辑、产品信息框架、导航、信息设计、视觉),研究人与系统之间的关系,依然要研究人操作系统时所处场景对于人、系统、人与系统间关系的影响。以此作为系统层面交互设计的出发点。

1.2隐性交互其实是人操作过程中,系统自动捕捉人的操作、外部环境等各种因素后,呈现给用户的一种优化结果,这些优化结果并非是用户的直接操作行为引发的,多半是用户间接触发的,但是这种交互却切实的优化了用户的使用体验。

1.2.1人的操作

关于捕捉用户操作涉及到的就是算法问题,当然并不是所有的设计都会有涉及算法这一问题。算法当然是后台程序的事,但是从本质来讲这是机器与人的一种交互。且绝大多数针对用户行为习惯进行内容呈现的算法,需要相关的界面设计来引导用户进行某些相应的操作,来帮助系统后台算法推测用户行为习惯,为用户推送相关内容。

系统应该根据绝大多数的用户普遍行为,以及用户的习惯行为来指导相关的默认操作。

1.2.2外部环境

         a 无免费WiFi。用户启动下载,是否要给予用户提醒。

         b 网络状况不佳、无网络、断网。这就出现了三大机制加载机制、缓存机制、刷新机制。

         c 使用场景。移动端不同于pc端的一个主要的点就在于,用户使用设备的地点可能在任何用户可以到达的地方。家里、厨房、餐厅、                地铁、偷情(╭∩╮(︶︿︶)╭∩╮)等等。那么这些场合交互的便利性、容错性、隐私安全都需要考虑。

2交互与信息架构

2.1信息架构是交互设计师基于功能流程,最优用户操作逻辑确定的各功能模块的分布形式。Jesse James Garrett在《用户

体验要素:以用户为中心的产品设计》书中给出了信息结构的分类---自上而下的或自下而上的信息结构。

自上而下的信息分类结构非常常见,而且这种分类方式非常便于日后产品功能的延展。多数toC类应用都是采用了这种结构。原因在于toC类产品一般属于轻架构产品,因为这类产品面向一般大众,为了吸引最为广泛的用户,这类产品必须将产品的学习成本降到最低。同时为了最快的抢占市场,这类产品一般会通过做减法事先明确产品的核心功能点,通过后期迭代的方式不断完善功能,因此这类产品一般采用自上而下的信息架构方式,而很少采用自下而上的方式。

自下而上的架构方式倒是与企业合并重组有着异曲同工之妙。按照知乎某答主的看法[4],自下而上的信息分类方式常见于to类重架构应用中。

之所以会出现这种分歧或许是由于to C与to B产品的差异有关系。to C端产品一般是产品去挖掘用户需求,是创造,从无到有。因此,是从整体到局部,从重点到细节。而to B端的产品一般公司战略或相关方给你提出要求,产品经理将这类“线下已有的需求”系统化,达到提高现有流程的效率的目的。因此,是从局部到整体,由枝节到核心,是归纳的过程。

2.2两种方式的平衡

自上而下的信息分类方式有可能导致重要细节的缺失,且伴随太多细枝末节功能的过度开发,使得产品功能趋向于臃肿。自下而上的信息分类方式可能导致产品后续功能不能进行添加,不能灵活容纳系统未来功能发展的需要。同样按照知乎某答主的看法,解决办法是这两种层级结构的平衡式使用方式。

2.3信息分类结构的构成。

信息分类结构

无论是哪一种分类方式,最下单位为图中的一个个节点。这些节点或者对应的是APP中的一个页面,又或者是页面中的某一个模块。而箭头反映的就是页面或模块之间的跳转。


2.3.1一个适应性强的信息架构系统,能把现有内容作为吸纳有结构的一部分容纳进来,也可以把现有内容作为一个新的部分容纳进来(见图二)。


图二

2.3.2节点的添加与删减不应该特定数目类别为标准,而是应该思考用户是否认为这种分类是合理的。既不刻意增加步骤,也不刻意压缩步骤。

2.3.3信息架构的最终目标是架构出符合网站或系统目标以及用户需求的结构。

3交互设计与界面设计

交互设计更加注重产品和使用者行为上的交互以及交互的过程,以电话银行系统为例,在这个例子里,并没有可以触摸的视

觉面,而它在交互方面的行为本质却完全表现出来了。界面是一个静态的词,当进行界面设计的时候,我们关心的是界面本身,界面的组件,布局,风格,看它们是否能支撑有效的交互,但是,交互行为是界面约束的源头,当产品的交互行为清清楚楚地定义出来时,对界面的要求也就更加清楚了,界面上(如果存在可视界面的话)的组件是为交互行为服务的,它可以更美,更抽象,更艺术化,但不可以为了任何理由破坏产品的交互行为。从广义上来说,也可以认为界面设计包含交互设计,在这样的情况下,它同时还包含另外的部分例如外观设计或平面设计,这些都是可以单独进行研究的更细的分支。[3]

界面交互设计的思考起点应该是用户在该界面的行为逻辑。由信息架构系统可知,界面是为了帮助用户实现特定目的的一连串的节点,界面所承载的内容便是用户达至最终目的的一连串的与最终目的相关的信息。因而,界面本质就是承载引导用户通向最终目的的信息载体。这就决定了界面之间具有相互承接的性质,界面承载的内容是连续的信息流。因而,界面交互设计就涉及前面提到的交互设计的显性层面与隐性层面提到的内容。

界面设计应该注意的一些事项

a弹出层。弹出层从前面提到的交互角度看应该属于显性交互中的系统层面,是系统对于人与信息交互过程中出现的状况的一种提醒反馈。

b加载页面。限于当前网速问题,用户在页面跳转过程中必然会涉及到页面内容下载的问题,为了保持页面间的连续性,更重要的是对于当前系统内部正在发生的行为给予用户一定的反馈,以缓解用户的情绪,需要在加载页面添加一些下的交互动画。以及相应的加载机制(具体参看文后文章链接)。

4交互设计与导航设计

导航设计的依据是信息架构中的节点。导航是为了帮助用户在不同节点之间跳转,或者说在不同的信息流程中跳转,帮助用户清楚了解当前操作在整个操作流程中的位置,接下来的操作将要通往何处。当导航满足了这些基本的需求之后,还应该准确传达出导航与内容之间的联系,设计师往往借助于转场动画特效,来体现导航与内容之间的联系。而上下级导航的连续性,往往通过标准化的配色、造型等来确保导航在各个页面具备较高的识别度。

4.1导航的分类

4.1.1全局导航。


移动端全局导航


标签导航优点:方便用户在不同流程之间来回替换。

缺点:占用有限的屏幕空间。

驼式导航优点:当页面有处于同一层级的几大部分内容,同时又需要一个非常重要且频繁操作的入口,就可以使用该导航。

抽屉导航优点:节省页面空间,使得用户集中注意力于当前页面。

缺点:用户在各功能模块间跳转的频率降低

宫格导航优点:使得用户集中于当前操作内容,适用于各功能模块较独立的设计。

缺点:用户要想跳转到下一个功能模块,必须先退出当前模块,在进入相应模块,且必须进入模块才可看到内容。和以内容为主的趋势相悖

组合导航:用户可聚焦当前内容,又可实现在不同内容之间的快速转换。

列表式导航:结构清晰,这种形式不会展示内容,因此一般存在于二级页面中。

Tab导航:一般用于二级页,本质和标签导航相同,当应用层级较多的情况下,可以采用tab导航。

4.1.2局部导航。提供给用户在这个框架中到“附近地点”的通路。

4.1.3辅助导航。能够以简洁明了的形式查看其他信息或执行特定操作,同时无需用户退出当前活动。例如:弹窗。

4.1.4上下文导航。嵌入页面自身内容的一种导航。

4.1.5友好导航。用户并不会经常用到,但可以作为一种便捷途径来使用。例如:溢出菜单。

4交互与信息设计。

从设计学科的角度,信息设计研究的是如何呈现信息,以便于信息的受众有效地理解信息。换句话说,有效呈现信息内容的方式以及利于信息传达的优美、简洁的信息环境是信息设计研究的首要内容。[5]最关键的是,用一种能“反映你的用户思路”和“支持他们的任务和目标”的方式来分类和排列这些信息元素。关于信息的设计,应该从用户获取最终信息的整个流程中去审视当前信息设计在整个环节中的作用,以此来决定传达的信息内容、排列方式、主次重点。

写在最后:

《用户体验要素》这本书中提到网页设计的5个层面,我以为一个优秀的设计是一个整体性的存在,因此,虽然作者将整个的设计分做了五部分,但是在设计过程中设计师应该带着整体性的视角去做每一个环节,因为单独看每一个环节在整个环节中的作用都是承上启下的,并不是绝对独立的。交互设计也是如此。一个优秀的交互设计师难道不应该以交互的视角,审视产品的一切设计层面吗?

参考:

1《交互设计:从物理逻辑到行为逻辑》作者:辛向阳http://www.360doc.com/content/15/0210/13/21907744_447672901.shtml

2《交互设计的三大隐形机制:加载、刷新和缓存》作者:不详http://www.mahaixiang.cn/jhsj/525.html

3《交互设计和界面设计》 作者:百度文库

4《怎样理解信息架构》作者:尤文文https://www.zhihu.com/question/19719820

5《交叉研究视野中的信息与交互设计》 作者:装饰杂志http://art.china.cn/products/2015-03/18/content_7758063.htm

6《用户体验要素》

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345

推荐阅读更多精彩内容