Clarity

前言 最近发现了一个新的工具-clarity, clarity 是一种免费工具，用于捕获用户使用网站。安装非常简单，可以在数分钟内开始获取数据。 clarity 有以下功能特点: 热点地图: 为你的所有页面自动生成。查看用户点击的位置、他们忽略的内容以及滚动的距离。 insights: 快速发现用户在何处感到灰心，并将这些问题转化为机会。 Google Analytics: 可以方便的与 Google Analytics 关联。 会话录制: 观看用户如何使用你的网站。了解运行顺畅的地方、需要改进的内容，并测试新想法。 copilot: 使用由 GPT 构建的直观对话体验来理解你的分析数据。 接下来就开始介绍 clarity 的简单使用。 clarity 使用 创建项目 登录成功后, 可以选择网站或者移动项目, 这里选择网站，输入相应的信息。 配置代码 填完信息，需要配置相应的代码信息，可以看到有2种方法，一种是知名第三方平台提供的快捷配置方法另一种是手动添加代码。这里选择手动添加代码。 配置信息 根据导览，可以配置一些信息，例如与ga关联，屏蔽一些隐私信息。 查看数据 根据导览的指引配置完信息后,第二天再次登录系统就可以看到数据了。可以看到有4个主要的模块栏目:仪表盘、录制、热度地图、ga，接下来分别介绍这4个部分。 仪表盘 仪表盘主要就是用户在你网站上访问的整体数据的展现。 录制 录制通过名字就可以得知这个是对用户在你页面上浏览情况的录制，可以看到用户的访问的整体情况，点击了哪些元素等。 热度地图 热度地图可以看到网站的哪些页面经常被访问，被访问的页面哪些部分经常被点击。 Google Analytics Google Analytics 主要就是 ga的数据了。 小结 本文简单的介绍了 clarity 的使用,由于目前数据量较少，不能很好的展示 clarity 的功能。 clarity 的代码已经开源了，有兴趣的可以访问 https://github.com/microsoft/clarity?tab=readme-ov-file 查看。 参考 https://clarity.microsoft.com/ https://clarity.microsoft.com/demo/projects/view/3t0wlogvdz/dashboard https://www.capterra.com/p/236349/Microsoft-Clarity/ https://learn.microsoft.com/en-us/clarity/ https://github.com/microsoft/clarity https://learn.microsoft.com/en-us/clarity/ga-integration/ga-integration#how-to-find-and-add-your-account-id-on-google-analytics