知乎上的一个问题:为什么后退、上一步、取消等选项普遍在左边,而确定、前进、下一步等选项普遍在右边呢?
以下是我的回答。
这是因为,绝大多数事物,都是按照从左到右的先后顺序来的 。
一段文字中字的先后顺序、一串数字中数字的先后顺序,甚至于书写一个字或数字时,各笔画的先后顺序,都是按照从左到右来的
手机上图片的先后顺序,也是按照从左到右的顺序来的
思维导图中由一个起点逐渐裂变的过程,也是按照从左到右的先后顺序来的
我们头脑中关于一件事发展过程的图像化演示,也是自然的、默认的按照从左到右的顺序来的
由于我们接触到的额所有信息,都遵循着“左先右后”的规则,不断强化着我们头脑中对于左右的认识,甚至变成了一种自然而然的想法,事情本来就是这样的。
App实际上可以看成是对现实中事项的映射,要和人们的认识保持一致,自然也要按照从左到右的先后 顺序来。
回过头来再想一想,是什么原因,让身边的、脑中的事物变成乐从左到右的先后顺序?
个人的猜测是,欧洲人书写文字的顺序。然后这种书写的顺序,随着西方文化一同传播到我们这里。这是一种无处不在的影响,影响着人们对于左右的理解,然后通过人们的认识,影响到其他种类的事物上。
至于欧洲人写字的顺序为什么是从左到右,可能是为了防止写字的时候手和胳膊沾到墨水吧。
回到手机App上,我们知道大部分的后腿、取消等都在左边,而前进、确认都在右边,但却又发现,有些取消是在导航栏的右边,比如下面这些。
这又是什么原因呢?
决定界面上个元素布局的,不仅有和实际事物保持一致方面的因素,还有其他因素。在上述情况中,可能是给予操作便捷性的考虑。
本来按照左边表示后退而右边表示前进的原则,取消应该放在左边而不是右边。
但在这里,取消还有另一层属性。类似于播放歌曲时的播放键和暂停键,这两个互生、相反的按键通常会放到一起,一方面会让操作更便捷,按下播放后,不用去其他地方再去找暂停,另一方面,从某种角度上来讲,这两个实际上是同一个东西两种表现。从这个角度看,取消应该和新建放在同样的位置。
而在上图所示的情况下,设计者综合考虑上述两个因素,可能感觉后者的因素更重要,所以选择了后者。
注意这种选择,是在导航栏上只有”取消“而没有”完成“的情况下做出的。
如果导航栏中有完成按键,则左先右后的原则会再加一分,变为相对更重要的因素,所以也就成了下面的样子。
App界面上的“左边”,不只局限于对应事物发展过程中的“先”,而是对应包括“先”在内的一个宽泛的含义。
可以对应当前位置,相对于其他位置,左边表示我自己的位置
可以对应当前时间
可以对应“我”,相对于其他内容,左边表示“我”自己的相关信息
可以对应”总的“,而右边表示分支、细化的东西。
……
可以看到,左边对应的是类似于”前面的“、”源头的“、”当前的“、”总的“、”我“一类的宽泛的含义;右边则与之相反。
除了左边、右边这样的小细节之外,还有一些地方挺值得探讨。
比如,在 一个界面中点击进入新界面的过程中,有的是左滑进入新界面,有的是从底部弹出新界面。这两种交互形式有什么区别?或者说,在什么情况下应该用前者,什么情况下应该用后者?判断的依据是什么?
比如,在界面左上角的返回图标的位置,有的App中在该区域显示返回后界面的名称,有的则不显示?哪一种做法好一些?这背后是基于什么考虑?或者说有没有什么试用情况的判断标准?
先讨论第一个 问题,关于左滑和从底部弹出的交互形式。
先要明确一个原则 ,App中的各种元素,要尽可能和其所代表的实际事项的本身属性相匹配,即”匹配性“的原则。
具体到交互形式,就是交互形式要和两个界面的切换过程本身的含义相匹配。
有一种情况是,从界面A到界面B,是从一个总的界面进入到细分的界面,就像是在从左到右逐渐分支的思维导图中,从一个父节点进入子节点一样。人们自然想象出来的样子,是从父节点向右移动到子节点,同时子节点放大。这里面可以提炼出右移、放大两个交互效果。
这时候再看左滑、从底部弹出这两种交互形式,就能明显的得出,左滑是和页面实际的切换过程更匹配的,更符合人们的心智模型。
再来看另一种情况。在界面上点击新建进入新界面。还是以思维导图为例。在从左到右逐步分支的框架中,新界面不是存在于这个框架中的一个点 ,因为框架中的点更像是已经存在的界面。新界面更像是在一个点上附加某种东西,而不是移动到另一个点。具体到界面上,就是该界面不动,不是左滑进入新界面,而是凭空再单拿出一个界面。
这时候再来看两种交互形式,显然从底部弹出更符合实际的情况。
大部分界面之间的跳转,都可以归类到上述两种情况中,其他特殊情况的不再讨论。
额外加一项,按上述的角度看,点击搜索时,只是将当前界面变为搜索模式,搜索范围也是在当前界面中,所以也不应该采用左滑进入新界面的交互形式。
但在有些App中,点击创建进入新界面时或是点击搜索时,都是统一采用左滑的交互形式。这可能是考虑了右滑返回的因素之后的综合选择。
在大屏手机上,相对于点击左上角的返回按钮,右滑返回更易操作。左滑进入的界面,用右滑返回的操作没有问题。但对于从底部弹出的界面,右滑返回和从底部弹出的效果不是相反的关系,不符合用户的认知模型,使用右滑返回的功能就会很牵强、不自然。权衡了两个选择之后,可能有的设计者会牺牲掉匹配性而选择操作的便捷性。
关于在界面左上角的位置,显示返回后的界面名称。
除返回外,进入新界面时,通常是要点击某一个文字、图标等,而这些文字、图标都会传达给用户”下一个界面是什么“的信息。也就是说,从点击,到看清楚界面的样子的中间这段时间,就已经对新界面有一定的预了解,这会使对新界面的理解过程更快、更轻松。
但对于左上角只有返回图标的界面来说,点击返回时,对于要返回的界面的预了解较弱,仅依靠于对上一个界面的记忆。这样,对于返回后的界面的理解,基本上是从看到返回后的界面后才开始,这会使对界面的理解过程变慢且更吃力一些。在对于上一个界面的记忆不太清晰的情况下,更是如此。
但实际上很多App在返回区域都没有显示名称,这是什么原因?
在返回图标附近显示名称,除了会让理解过程变得轻松的优势外,还有一些缺点。
占用导航栏空间。有些App的导航栏空间很挤,综合考虑就去掉了名称。
让返回区域变得不太清爽。
有些App对界面清爽要求很高,所以也是综合考虑去掉了。