从youtube的产品交互聊聊设计心理学

本文写于2018年6月27日,首发于简书。


Philip Stark设计的柠檬挤汁器

如果你从来没见过这个奇怪的像外星人一样的东西,看到右边的用法之后,应该会拍着大腿说:哎呀这个设计真棒!

“三支像章鱼脚一样的东西支起了整个身体,留出了放杯子的空间。上面的大头正好贴合橘子或者柠檬的表皮形状,下面的尖嘴可以很好的汇聚果汁,自然的滴在下面的容器里。”

一个简单的“挤”的行为,可以被解决的如此有趣。

这就是好设计给人们带来的最直接的感觉,好的产品不仅质量上乘,颜值高,而且能很巧妙的解决功能需求。总结起来就是三点,也是我在学习和实践设计过程中不断重复验证的准则:

1. Functional, (满足功能需求)

2. Intuitive, (满足直觉操作)

3. Playful.(有趣)

其实这几点设计准则可以反过来在很多的设计产品上去印证,无论是电子产品,工业产品,还是互联网产品。


Youtube和优酷的交互界面



世界著名的流媒体网站Youtube虽然已经被Google收购很久,但是成功的独立经营已经超过10年,并且几乎没有可以挑战其地位的同类产品。Facebook在尝试做流媒体,instagram也在尝试,至少目前来看,youtube的产品很完整,使用起来非常顺畅。至少从国内一众流媒体网站来看,还没有做的接近于Youtube的产品。

几个月前,youtube的移动终端(手机)做了新的产品迭代,增加了一些非常酷的功能。当然,这里不是要去分析youtube如何更新自己的产品,而是通过一个小的交互功能的例子去分析什么是好的设计,以及印证我们前面提到的,好设计的几个准则。


就是上面这幅图,注意看这是一个手机全屏幕的视频播放过程中的快进提醒,快进的手势是double tap,也就是点击两下。再让我们对比下国内做的比较好的视频产品,优酷视频(其实大部分产品的操作手势是一样的)的手势操作。

注意,Youtube在手机端的指令只有:停止/快进快退两种。操作手势分别是点击屏幕一下,和点击屏幕两下。(快进点右半边屏幕,快退点左半边屏幕)

而优酷的操作指令,就丰富的多了:屏幕左边可以调整亮度,右边调整音量,下端调整进度。操作手势分别是:上下滑动和左右滑动。


交互设计分析


回到我们之前说的好的设计准则里,按照顺序分析和对比一下这两种产品的优劣。

1. Functional, (满足功能需求)

Youtube:停止;快进快退

优酷:屏幕亮度;音量;快进快退

对于用户在全屏观看内容的时候,屏幕亮度的调节是不需要被拿到与快进快退同样级别和频次的。音量的调节也可以很快通过物理按键来调节到位,通过屏幕调节反而会造成误操作。这是从性质上来讲两个功能都有其鸡肋的地方,可以说是可有可无,甚至为了更好的操作需要被操作的指令,这两样功能是完全可以被藏在其他界面去操作的。

相反,Youtube在全屏的时候,只保留了停止,快进(快退)两个指令,不多,但是已经足够,而且不会造成功能叠加导致的误操作。

有的时候,或者说大部分时候,想要做太多是会导致想做的没有被足够强调和重视的直接原因。

在是否满足功能需求的打分项里,Youtube:是;优酷:否。

2. Intuitive, (满足直觉操作)

Youtube:单击屏幕/双击屏幕

优酷:屏幕手指滑动

首先对操作指令来说,简单,准确,容易识别是很重要的。Youtube只用了点击屏幕的操作,而没有任何其他的手势指令。这样一来误操作的几率几乎可以忽略不计,因为没人会把点击屏幕跟滑动,或者其他手势混在一起。

说到混在一起,优酷的操作就比较灾难了。滑动的方向和滑动的屏幕区域指代着不同的功能,而无论是手指滑动本身,还是屏幕区域,甚至是人为使用时的误操作,都会让我们的指令和结果相互混淆。甚至,我会在全屏的时候锁住屏幕,来减少误操作。

重点来了,滑动手指来指令快进快退最灾难的一点是,你根本没法控制快进快退的精确时间……我不知道滑动快进为什么没有在Youtube里出现过,但是从使用体验来说,滑动和快进几乎是没法一对一进行精确指令操作的。首先,快进我们需要的是精确到秒的操作体验,要不然滑动屏幕跟滑动进度条来控制没有任何区别。其次,对于不同时常的内容来说,滑动每一下的进度比例也是非常难控制的。没有对比没有伤害,跟Youtube的每双击一下快进10秒来说,滑动控制进度简直是失控。

在是否满足直觉操作需求的打分项里,Youtube:是;优酷:否。

3. Playful.(有趣)

对于设计产品是否有趣的定义,我觉得可以从两个方面来看:

1. 你的每个操作是否对应着明确的信息反馈?

2. 你接收到的信息反馈是否足够精确,是否足够有趣?


举个例子,Muji的设计总监深泽直人设计的这款CD播放器,就可以通过很明确,又以一种很Nostalgia(怀旧的)的行为反馈设计了播放器的开关。他移植了传统风扇和灯的老式拉线开关,来控制播放器的启动和停止。

通过直觉的拉线行为来控制开关,在每次开关的时候又会有物理的咔咔声音来反馈行为。这种简单的开关操作,就是不仅有精确反馈,同时又足够有趣。

说完Muji播放器的例子,再说回这两个视频产品。因为是在触摸屏上的操作,物理反馈几乎是没有技术方法可以办到的。但是你看到Youtube 界面上每次双击快进时候会涟漪般淡淡出现在屏幕一边的圆形轮廓了么?如果可以放慢这个过程的话,随着用户每次双击屏幕,从屏幕右边(或者左边)的中心会随之逐渐扩散开一圈淡淡的白色的涟漪,就好像每次双击都在向平静的水面丢了一颗小石子,水面就会泛起波纹。

多么精确又浪漫的反馈,这波操作体验简直可以打满分!

优酷的操作反馈呢?额……似乎是没有的。没 有 的……就是说,你的手指在屏幕上滑动多少距离,会相应的快进多少时间,以及最后让你知道快进到哪里,是凭手感,凭运气的……

嗯,凭手感,凭运气……

毫无疑问,在设计是否足够有趣的打分项里,Youtube:是;优酷:否。


好设计与坏设计


记得在《设计心理学》这套书里作者也说过:不好的设计其实会让操作的人显得很笨。

当你面对一个不知道是该推还是该拉的门的时候;当你拿着一把遥控器不知道该怎样打开电视的时候;当你买回来的智能音箱却不知道该如何让他放音乐的时候,其实不是我们显得笨了,而是这些产品里面没有考虑到如何与用户交流,最终导致整个过程不仅不足够美好和浪漫,连基本的功能目的都没法达到。

坏的设计不是罪人,但是坏的设计用多了,你是否也会变得不够浪漫,不够美好?你是否也会变得脾气暴躁,不易交流?

多观察,多接触好的设计,因为产品和用户之间的关系,是相互的。我们不仅需要好的产品来满足我们的需求,我们也需要好的产品,来滋养出更好的自己。

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

推荐阅读更多精彩内容