基于UI交互意图理解的异常检测方法

原创

已于 2023-11-24 14:39:17 修改 · 2.4k 阅读

19 ·

CC 4.0 BY-SA版权

文章标签：

#ui

于 2023-11-23 19:58:29 首次发布

美团到店平台与复旦团队合作，自主研发多模态UI交互意图识别模型及配套框架。文章介绍了从大前端质量保障痛点出发的设计与实现，该模型可准确识别UI交互意图，编写的测试用例有泛化能力，还探讨了架构、实现方式及未来应用方向。

美团到店平台技术部/质量工程部与复旦大学周扬帆教授团队开展了科研合作，基于业务实际场景，自主研发了多模态UI交互意图识别模型以及配套的UI交互框架。

本文从大前端质量保障领域的痛点出发，介绍了UI交互意图识别的方法设计与实现。基于UI交互意图编写的测试用例在实际业务中展现出了可以跨端、跨App的泛化能力，希望可以为从事相关工作的同学带来一些启发或帮助。

1. 背景
2. UI交互介绍
- 2.1 UI模块与交互意图
- 2.2 当下痛点与启示
- 2.3 研究目标
- 2.4 效果预期
3. 架构设计
- 3.1 技术思路
- 3.2 当前进展与效果Demo
- 3.3 实现难点
4 实现方式探索
- 4.1 交互意图识别需求
- 4.2 模型的输入
- 4.3 双阶段UI交互意图理解
- 4.4 实验结论
5 实际落地探索
6 总结
7 展望
招聘信息

1. 背景

近年来，随着美团多种业务线的扩充和迭代，UI测试的任务愈发繁重。针对UI测试中人工成本过高的问题，美团到店测试团队开发了视觉自动化工具以进行UI界面的静态回归检查。然而，对于UI交互功能逻辑的检验仍强依赖于脚本测试，其无法满足对于进一步效率、覆盖面提升的强烈需求。主要难点体现在两方面：

前端技术栈多样，不同页面的实现方式各异，这导致不同页面中功能相似的UI模块的组件树差异很多，基于规则的测试脚本也就很难具备泛化能力，生产、维护的成本非常高。
UI样式繁多，同样的功能模块可能在视觉上有很大差异，这为基于CV方法实现自动化驱动带来了困难。

考虑上述两个难点，美团到店平台技术部/质量工程部与复旦大学计算机科学技术学院周扬帆教授团队展开了“基于UI交互理解的智能化异常检测方法”的科研合作，利用多模态模型对用户可见文本、视觉图像内容和UI组件树中的属性进行融合，实现了对于UI交互意图[1]的准确识别。该工作对于大前端UI的质量保障等多个领域都具有可借鉴的意义，介绍该工作的论文[2]已被ESEC/FSE 2023（软件领域CCF A类推荐会议）接收，并将于12月6日在其工业届轨（Industry track）公开发布、推介。

2. UI交互介绍

| 2.1 UI模块与交互意图

移动应用由“页面”组成，不同页面中的不同“模块”为用户提供着不同的功能。用户在浏览页面时，根据以往使用经验以及当前页面中的图像、文字、页面结构等信息，可快速理解页面当中不同【模块】所想要提供的【功能】，以及通过该功能用户能够达到的【目的】。这些被用户认为能够提供特定功能并达到预期目的的页面模块，我们将其命名为一个【交互意图簇】。

以下图中的页面为例，不同模块通常对应不同的交互意图类型划分。比如商品详情区域，我们可以得知此模块主要是向我们展示当前商品最主要的信息，起展示作用；而顾客信息区域，需要用户进行点击或输入个人信息，用以补全整个订单所需要的信息；同时页面当中也会存在各类功能按钮，通过按钮的位置、文本信息、图标等信息，用户也可以大致推断出操作后会得到怎样的结果。由此，我们可以将UI交互意图定义为「用户通过当前UI展示推断出来的不同模块的概念及交互功能」。

图1 模块的概念及交互功能样例

| 2.2 当下痛点与启示

对于复杂的UI交互场景，如提交订单页，测试人员需要对不同模块制定较复杂的测试流程、测试规则，同时编写及维护复杂的自动化测试逻辑。以美团内的App测试场景为例，许多不同的页面有着相似的功能模块，这些功能模块尽管表象不同，但对于一般用户来说，交互意图明确且相似，没有理解困难。如：

图2 相似的功能模块

| 2.3 研究目标

本课题期望结合多种机器学习方法，通过机器获取与人工认知一致的“交互意图”，从而利用该信息模拟测试人员对客户端产品进行“理解-操作-检查”的测试验证流程。如人工操作一般，我们希望该能力能够以一个与一般用户类似的逻辑来操作、检查相似的功能，同时兼容不同的技术栈、App、业务领域，无需特定适配。就像一个用户在美团上能够订酒店，在没有使用过的点评或者美团小程序上也同样能完成预订酒店的流程。

从能力目标视角来看，UI交互意图识别的定位是完成一般用户的交互概念到页面实体的映射。由人直接进该映射的准确率最高、泛化性最好，典型的场景就是手工测试，即人观测页面后操作、检查。人能在不同的设计、程序实现形式下实现下找到目标操作实体（例如各种各样的提交按钮、商品卡片）。当前的自动化脚本测试提高了效率，但由于映射的泛化性较差，往往需为每个页面做单独的适配。

此外，业内尝试了诸如CV页面目标检测等方法，但在鲁棒性、泛化性、使用成本等方面上仍不太令人满意。本研究旨在利用深度学习和多模态信息，通过少量标注数据，尽可能提升交互意图识别的映射能力，使其接近人的识别、认知水平。