美文网首页101条UX原则 - 权威设计指南
101条UX原则 - #07 让你的按钮看起来像个 “按钮”

101条UX原则 - #07 让你的按钮看起来像个 “按钮”

作者: Tomi_Wong | 来源:发表于2018-12-13 17:14 被阅读0次

    扁平化设计美学源于微软的Metro用户界面,在21世纪后期几乎无处不在。 在iOS 7 和 Android 的 Material Design 中,这些极简的视觉效果仍然是现代Web应用程序的首选。

    但扁平化设计很糟糕, 这对可用性来说真的很糟糕。它的风格超越了实质,它就迫使用户更多地思考他们与你的产品之间进行的每次互动。

    别再让用户难以找到按钮,比如下面的图,你猜可以点击什么:

    你的UI的某些部分可以与之交互,但用户既不知道这些部分,也不想花时间了解它。他们在现实生活中都使用过按钮,很多次用过电梯的按钮,烤箱的按钮和车内按钮,因此他们了解按钮的工作原理:

    具有视觉效果的按钮(例如纹理和伪3D阴影(左)在用户测试中的表现始终优于没有这些效果的(右)。

    通过模拟绘制出真实世界的样例,我们可以制作醒目且立即就熟悉的UI按钮。 人类视觉系统可以看到更深层次的东西,你删掉了UI的层次感,也就删掉了传递给用户的整个信息层。

    现实生活中的按钮看上去就是可以按的:它们明示或者暗示了一种显而易见的方式,如果被按下去,它们就可能会动。 例如,它们可能具有指示灯,并且在启用时看起来更加突出。你应该将这些功能复制到UI设计中。

    相反的情况也是如此:现实世界的按钮看起来并不像停车场机器和咖啡机上的可压扁平电容式按钮——这些按钮常伴随着一张手写的贴纸写着“按这里出票”。

    使用来自现实世界的灵感来创建可用性,让新用户可以立即识别控件。创建用户需要立即知道的视觉形式,提示他们正看着一个可以按下或点击的按钮。

    最后,反之亦然:如果不是个按钮,就不要让非按钮元素看起来像按钮。

    知识点:

    ·使按钮看起来像按钮。

    ·不要让非按钮看起来像按钮。

    ·从实际经验中借鉴UI设计的思路。

    相关文章

      网友评论

        本文标题:101条UX原则 - #07 让你的按钮看起来像个 “按钮”

        本文链接:https://www.haomeiwen.com/subject/youbhqtx.html