从一个回复框看用户体验

现在几乎人人言必称用户体验，就连没做过相关工作的也口口声声说着用户体验，这令本人最为反感。搞了这么久的前端开发相关工作，都不敢对任何一个东西妄言用户体验好还是坏。是否有可取之处或者哪里尚待改进都要认真考虑，推敲再三。

而那些毫无相关工作经验的人，口口声声说着用户体验的时候，也在暴露着他们的无知还自以为是~~

今天就来分析一个常见留言框的设计，看看用户体验都体现在哪里。

首先来看第一个图： 

 

 这是一个较为合理的设计

一、表情快捷按钮位于回复框之上，我们可以便捷的点击表情插入回复。有时候表情更能表达我们的心情，而不是去输入一大段文字。而且这种更加便捷的回复方式使得用户的行为得到鼓励，对增加用户的使用是有积极意义的。

 

 2、表情列表弹出后 不遮挡文字区域，直观的显示表情图片插入的位置和效果。

 3、回复按钮位于左端，输入完毕后可以很快捷的点击发布。大多数人都不会输入长篇大论，所以当输入完毕之后，用户的光标和鼠标一定距离左端较近，如果放到右端，用户就要移动更长的距离去点击按钮。要知道我们的用户都是很懒的，他们只喜欢贴心和便捷的东西。

4、按钮的可点击区域较大， 点击起来更方便。

 我们再来看另一种设计：

 

 这种设计把表情按钮放到了右下角，发布按钮也在右下角。我们来分析下这种设计：

 1、表情按钮位于右下角，要插入表情，鼠标 需要移动相当长的一段距离。

2、表情按钮遮挡了文字框的拖动滑块，在chrome等浏览器中，拖动改变文字框大小的功能就无法使用了。而像我这样的chrome用户，是很喜欢这个文字框拖动功能的，所以它会让我觉得很碍事。事实上也是这样。

3、表情列表打开之后不是遮挡文字区域，就是遮挡发布按钮。非常碍事，我需要取消掉表情选择之后才能回到文字框。

4、按钮位于右下角找到按钮要移动鼠标很长距离。

5、按钮细小，不方便点击。 

这样一分析，其好差自然见得分晓。前者本来是成型的设计，自然有它存在的道理，各个细节考虑周到。

而后者如此武断的改动，并无考虑到用户使用的细节问题，真是太过主观和欠缺考虑。  

PS：更为可笑的是，后一个设计还作为了最近一个项目的用户体验增强计划的一部分。真无语~~

结语：无知可怕，更可怕地是无知还又自以为是~~