了解热图对于提供更好的用户界面有多重要？

热图是 UI 设计中非常有用的工具。我们收集了不同类型和不同用途的。

用户界面设计是一个持续的过程。事实上，没有完美的界面，一旦设计出来你就可以忘记它，再也不会看它。始终有必要收集数据以了解哪些有效、哪些无效、需要进行哪些更改以及在何处进行更改。我们报告了一篇内部设计文章的结果，该文章解释了这些地图如何对所有用户界面设计有用。

为了了解需要进行的更改以及实际需要更改的位置，热图可以为我们提供帮助。后者为我们提供了一个可视化工具来了解人们如何与网页交互，因此我们可以对其进行优化以使其更加有效。

什么是热图？

它是有关用户与网页元素交互的图形表示。事实上，一些网络应用程序能够跟踪鼠标、触控板和触摸屏的移动，并将它们转换为真实的交互“地图”。这些地图称为“热图”。

热图的类型

有 3 种不同类型的热图可用于分析页面：

• 由用户点击生成的；
• 那些由鼠标或光标的移动生成的；
• 那些通过滚动网页生成的。

您可能已经意识到通过使用眼动追踪（一种允许您分析用户与网页交互时眼睛停留的位置的工具）在界面设计中可以获得的优势，但是这些优势是由地图提供的热更容易解释（它们不需要神经科学家团队：D）并且在成本方面更容易获得。

使用眼动追踪获得的图表

通过光标或鼠标的移动生成的热图的最大优点在于，它们可以（假设已记录大量“会话”）很好地估计用户在与平台。

此外，用户在界面上的动作提供的数据可以与通过滚动和点击活动获得的数据相结合，帮助我们收集有关用户动作的非常详细的信息。

热图如何帮助您更好地设计页面或屏幕？

当在网站或应用程序上实施热图系统时，它们允许您收集有关整个页面或图像的信息；特别是，它们有助于定位和测试以下元素：

• 按钮：定位和类型；
• 导航：菜单、面包屑和链接；
• 图片：定位、尺寸、链接和类型；
• 文本：格式、长度和位置；
• 总体布局：有关内容层次结构的信息。

借助热图，您将能够重新设计网页并消除对于您的页面而言表现不佳的元素。此外，该工具提供了从用户收集信息的可能性，而无需中断浏览体验（与调查或弹出窗口的做法相反），从而使分析绝对是非侵入性的（因此没有某些偏见）。

热图非常易于阅读，即使对于非设计师也很容易展示。

事实上，热图是为数不多的允许您以更结构化（尽管是定性）方式分析某些东西的工具之一，而在传统环境中，这些工具往往仅限于设计师的世界。

手机是一个技术奇迹。它为我们的通讯 谎言数据​​ 带来了新的维度。它是一项了不起的信息技术。它是一种无线电话，让我们能够在最短的时间内与人沟通和联系。现代手机实际上是一台微型计算机。

了解如何阅读热图并不会让你成为一名设计师但它会帮助你：

• 从用户体验和相关性能的角度独立分析设计；
• 提出旨在提高转化率的设计变更；
• 帮助设计师完善改造设计；
• 将更具分析性的文化带入创意领域。

热图设计界面的 5 个用例

制作热图可能看起来很有趣（确实如此），但这张彩色图像背后的信息比您想象的要多得多。让我们一起看看可以使用此方法的 5 个案例。

1. 了解主要 CTA 是否获得最多点击次数

在这种情况下，最好的热图类型是通过点击 什么是电子商务的例子以及它如何改变零售业？ 生成的热图。通过这种方式，您将能够检查网站的主要 CTA 是否实际上获得了最多的点击次数，如果没有，您可以调查哪个元素可能会分散用户的注意力。

如果您发现主要 CTA 没有获得最多链接，最明显的操作是将其移至用户似乎点击最多的位置。然而，另一种解决方案可能是调查他们在该点点击的真正原因、吸引他们的因素，然后将其复制到 CTA 中。

2.了解用户如何滚动

通过滚动页面生成的地图使我们能够调查用户停止滚动的位置：他们这样做是因为重要信息位于那里吗？或者他们因为失去兴趣而停止滚动？我们注意到卷轴中哪些部分的颜色发生了戏剧性的变化？

在这种情况下，UI 优化将涉及将最重要的元素移至滚动通常会中断的平均水平之上，并删除任何可能阻碍进一步滚动的干扰或混乱元素。

3. 识别虚假点击

我们再次面临点击生成的热图的使用。在这种情况下，我们将观察到：用户最常点击哪些非链接？用户是否单击了图像或看似按钮的东西？

为了纠正这种情况，建议插入链接来引导用户按 电子邮件数据 照我们希望的方式进行操作，或者修改上述元素以减少点击的吸引力。

4. 找到分心的用户

通过用户移动生成的热力图，可以识别页面内随机移动的用户；这种类型的行为是由一系列被识别为“低温热”的小点击区域决定的。

很容易理解，现在有必要吸引他们的注意力，因此可能有必要重新设计或减少可能分散用户注意力的元素。我们继续创建线性视觉流（例如左上或右下）以补充访问者的自然阅读风格。

5.比较不同设备的使用习惯

在这种情况下，最好将从点击获得的热图与从滚动获得的热图结合起来。这样，例如通过将移动用户与桌面用户进行比较，就可以发现来自移动设备的用户是否“丢失”信息，或者来自桌面设备的用户是否有不同的习惯。

在这种情况下，您可以与设计师一起使用这些数据来优化桌面和移动设备上的不同设计和界面，从而使跨设备体验保持一致。

将热图与站点数据相结合以获得更深入的洞察

热图本身提供了许多有用的信息，但如果将它们与正确的数据结合起来，还可以做很多其他事情。

热图和会话记录

会话录音精确捕捉鼠标移动；它们代表了研究人们如何在界面中实际导航的最佳方法。

热图聚合在一起以在单个图像中表示普通用户的行为，而会话记录可让您可视化个人浏览体验。因此，如果您在热图中发现了有趣或不寻常的情况，通过使用记录，您可以找出这种情况发生的地点和方式。

网站上的热图和反馈

一旦您发现了热图的设计问题，收集定性反馈可以帮助您了解原因。看到许多人无法滚动滚动地图是一回事，阅读他们对他们认为不起作用的解释是另一回事。

与网站页面相关的调查允许您提出非常简单且有针对性的问题，例如：

• 您找到您要找的东西了吗？
• 是什么阻止你继续？
• 您认为此页面缺少哪些信息？
• 如果您可以更改页面的任何内容，您会更改什么？

在 UI 设计的世界里，事情经常发生变化，正如我们之前所说，消费者需求不断变化，昨天有效的明天可能不再有效；但有一件事是肯定的：尽可能多地了解你正在为其设计网页或界面的人，可以让你尽可能地优化你的工作，减少盲目性，以免浪费精力做无用功。