【连载】特定场景下的交互设计

特定场景下的交互与UI设计

上周在公司内部做了一次关于交互和UI设计的演讲，整理完之后发现还有一些东西值得留下来。也算是把当时的逐字稿分享给大家，当然会稍微有些不同，逐字稿也是写的惨不忍睹。闲言少叙，我们开始。

相信大家都在网上看过老罗（罗永浩）在星巴克打脸的视频，这个视频每次在老罗有什么新闻的时候都会被挖出来发一遍，我们在这个视频中还是可以看出很多东西的。 包括用户体验、营销方法、甚至文化差异等等。真的很有意思。

首先我们要肯定星巴克这样杯型的命名是有着他一套营销逻辑的。星巴克的点单环节，可以说是一次游戏、一次社交行为及表演，客户在此也得到了某种程度上的满足。

但确实对于点单的客户最初会造成很大困惑，这就和页面一样，如果没有对场景进行分析，设计就会给用户带来困扰和一些非常不适的心里感受。那么设计出的输出物也可能是一次交互设计和UI设计的失败。

（图一：失败的设计）

我们首先来看这个界面（图一），真的很好看很漂亮，按钮的质感和配色都无可挑剔，但是大家有没有注意到，这个管理上传文件的弹窗在功能操作上的感受会让人有和老罗一样的感受。

它的界面有上传、删除、和取消功能，但我们看这张图片，我们真的无法去判断如何操作。它功能按钮做的虽然很精致，但是配色方面让用户觉得无从下手。我们经常作为警示的红色用到了取消，我们最常用的上传功能用到了灰色，按照普通用户的操作习惯来说，最长按的就是删除的按钮，显然这是让人崩溃的设计。我很难去快速的识别和操作。

看这些非常精美的按钮，可以说UI做到了极致，那你可以说这是个好设计吗？显然不是，他错在哪里？错在他脱离了场景，表意的换乱造成操作的不确定性和糟糕的用户体验。

（图二：合格的设计）

我们在看下图二显然它是合格的，为什么呢？场景对了！蓝色代表功能，灰色代表取消功能，红色代表删除并有提示作用。在上传文件管理的操作场景下，这样的表达就符合了这个场景的功能特点。

在看我们的题目，《特定场景下的交互与UI设计》我更想个他加个标题，设计中如何避免“让老罗打脸”的尴尬。

我在接下来的文章中会从场景的定义和分析、场景分析对于交互、场景分析对于UI、综合实例四个方面来说一下自己对于特定场景下设计的理解和感受。

---

下期预告：

场景的定义和分析

场景的定义和分析