PC端UI打磨很极致，却忽略了光标悬停状态？

Sponsor

我发现很多PC端设计系统把UI规范打磨得很细致，但却普遍忽略了光标这个东西。

不过，我也能理解为啥PC端设计师普遍不热衷这个。

试想一下，设计师去做项目汇报，领导问你这次改版的亮点是什么，设计师回答说：改了几处光标。

这不是产品经理也能做？这不是让前端写一行代码就行了吗？这也能算设计亮点？

选光标这件事，确实不太能凸显设计价值。尤其我刚工作的时候，每天面对一堆复杂的UI界面焦头烂额，哪里顾及得到光标？

直到发生了一件事，让我彻底改变了对光标的看法。

当时要设计一个拖拽卡片的交互，因为是B端产品太复杂，具体功能就不多说了。

总而言之，就是那种传统B端后台产品，一般人看了根本想不到居然能拖拽。但是我们产品升级，为了提高操作效率，就加了一个拖拽功能。

当时为了暗示这些卡片可以拖拽，我是想到了很多办法，例如：

拖拽目的地圈虚线框：一般拖拽都是往虚线框里拖。

卡片悬停态加阴影：暗示这个是可以浮动的。

卡片加上圆点阵列：暗示这里是抓手。

卡片悬停时，目的地的虚线框高亮：暗示往那里拖。

拿去做用户测试，结果几乎没谁主动发现可以拖拽的。

气得我直接在上面加了一行字：“卡片可以拖动。”

然而因为页面上的信息太多，很多用户还是没看到那行字……

后面都快放弃了，我突然来了个灵感，把卡片悬停时的光标改成一个抓手。

再去做用户测试，几乎所有人都知道可以拖拽了。

然后我就反省，这么简单的一个解决方案，我之前为什么没想到？

于是我想起了一件事，那就是用户在使用PC端时，眼睛一直跟着光标跑。

就好像玩射击游戏一样，外人看是瞄准器在动，本人看是瞄准器一直居中，变动的是背景。

对于PC端用户来说，一旦找不到光标就会着急地快速晃动鼠标。为此，Mac 还提供了一个功能，在用户快速晃动鼠标时，放大光标方便用户寻找。

也就是说，UI上的变化再大，只要超出了用户视线范围就未必被看到。

而光标一旦发生变化，用户会非常敏感。

早期的很多PC端软件，喜欢用强烈的阴影来体现凹凸感，哪里可以点哪里不能点，看得比较清楚。

现在PC端软件和网站在视觉上都扁平化了，对光标也不重视，非常依赖悬停态来暗示用户哪里可以点。

可悬停态的问题是：

1、热区太多，很难全部做出悬停态，难免有遗漏的。

2、有些悬停态本身做得很弱，不太好理解。

所以对于扁平风格的PC端产品来说，完全放弃光标而完全依赖悬停态来暗示用户哪里可以点击，这么做的风险是比较高的。

更重要的是，光标能提供暗示不止于上述拖拽和点击。例如：

拖拽中松开暗示：

输入暗示：

禁用暗示：

缩放暗示：

单向拖拽暗示：

加载中暗示：

对于设计师来说，虽然光标不那么容易体现设计价值，但是对于用户体验和开发成本，都是很有价值的。有时用户很难get到的东西，说不定换个光标就理解了呢？

作者：体验进阶（公众号）

赞助商链接

喜欢这篇文章吗？欢迎分享到你的微博、QQ群，并关注我们的微博，谢谢支持。
版权：除非注明，本站文章均为原创文章，转载请联系我们授权，否则禁止转载。