在做前端项目时，我们通常会得到描述UI元素外观和功能的设计、规范和用户故事。我们使用这些设计和规范来创建UI，然后启动项目。
这很好，但是用户通常不会知道单个元素的功能。他们将依赖于:
他们的本能和经验，也就是他们的期望
围绕UI元素的其他信息
如果用户看到一个汉堡菜单图标，他们会希望在点击图标时出现某种主菜单。但是如果他们看到网站标识旁边有一个“箭头向下”的图标，他们就不确定当他们点击它时会发生什么。它可以是一个主菜单，网站切换器，语言切换器等等。
Alt文本
在“Libreria”下面有更多的类别(用户需要滚动)，但是用户一开始不会知道
UX测试的价值
这就是用户体验测试如此重要的原因。你团队中的每个人，包括你自己，从第一行代码到最后一行代码都知道网站是如何运行的，当然，网站上的每一个功能和交互都是清晰的，因为是你创建的。
让不太熟悉你的项目的人来检查可以产生有价值的数据，并有助于查明瓶颈和可用性问题。
我目前提供前端和用户体验审计服务，所以如果你感兴趣，请检查它。
用户的意图
根据用户之前的经验，用户对UI应该如何工作有自己的期望，UI本身如何呈现，是否一致。
但是他们在网站上的意图是什么呢?让我们看一下这个例子。
Alt文本
用户在使用了菜单上方的搜索之后，打算使用左边的侧边栏导航(“Shop by”部分下的分类过滤器)。用户然后移动他们的鼠标向下，但百万菜单激活反应意外悬停和覆盖整个左导航!用户现在必须关闭超级菜单，这样他们才能使用他们打算使用的元素。
所以你可以看到，即使我们在创建UI元素时考虑了规格和设计，我们仍然需要考虑更大的前景:
元素将如何与页面上的其他元素交互
UI元素将如何响应正确的用户意图
基本上，我们希望确保在与UI交互时不会出现意外和意外，我们希望确保UI仅在用户期望时才对用户交互做出响应。
考虑另一个例子。
Alt文本
红色箭头表示用户将光标从菜单移动到链接时的自然路径，但这将导致菜单更改为另一子菜单，因为它会在悬停时做出反应。绿色箭头表示开发人员创建并知道如何使用的安全路径。但这与使用此UI元素时的用户体验和意图不一致。
如何避免意外的互动
使用延迟-添加setTimeout和clearTimeout超时值200ms到mega菜单将解决这个问题。用户甚至不会注意到这种轻微的延迟，用户会觉得他们已经完全控制
考虑可交互区域——交互区域可能太宽或太窄。确保用户可以激活悬停功能的尺寸是最佳的。
确保有足够的信息引导用户进入正确的流程，并教他们如何使用UI元素
尊重用户意图并满足他们期望的导航
下面是我创建的导航，它利用了延迟和优化的交互区域，以确保导航响应用户意图。
结论和额外的
我们已经看到了用户的期望和意图是如何揭示我们网站上糟糕的用户体验问题的。如果没有完全了解网站功能和代码的人进行测试，这些问题是完全不会被发现的。
我们还看到了如何将用户意图考虑在内，并创建用户体验很棒、使用起来令人愉快的UI元素。
我建议阅读Steve Krug的《不要让我思考》，以更好地理解用户意图和web UX。
这些文章是用咖啡做燃料的。所以如果你喜欢我的工作并且觉得它有用，考虑给我买一杯咖啡!我真的很感激。
上一篇：拥抱代码和设计之间的张力
