OmniParser技术分析（一）

1.引言

通过上篇文章介绍 OmniParser:下一代纯视觉UI自动化测试先驱相信大家已经对OmniParser有初步了解，接下来详细介绍下OmniParser使用了哪些技术模型实现了对UI纯视觉的检测和理解。

2.整体方案

通过阅读OmniParser提供的运行Demo代码知道，其实整个UI纯视觉检测主要分为2部分，涉及3个环节分别是：图片OCR、图片icon检测、图片元素理解，分别使用的模型为：

环节	模型	作用
图片OCR	paddle_ocr	识别图片文字区域和坐标
图片icon检测	yolov8n	获取图片目标区域和坐标
图片元素理解	Florence-2-base-ft	对检测到的元素理解

以下是从官网提供的demo程序中的截取：

    def parse(self, image_base64: str):
        image_bytes = base64.b64decode(image_base64)
        image = Image.open(io.BytesIO(image_bytes))
        print('image size:', image.size)
        
        box_overlay_ratio = max(image.size) / 3200
        draw_bbox_config = {
            'text_scale': 0.8 * box_overlay_ratio,
            'text_thickness': max(int(2 * box_overlay_ratio), 1),
            'text_padding': max(int(3 * box_overlay_ratio), 1),
            'thickness': max(int(3 * box_overlay_ratio), 1),
        }

        (text, ocr_bbox), _ = check_ocr_box(image, display_img=False, output_bb_format='xyxy', easyocr_args={'text_threshold': 0.8}, use_paddleocr=False)
        dino_labled_img, label_coordinates, parsed_content_list = get_som_labeled_img(image, self.som_model, BOX_TRESHOLD = self.config['BOX_TRESHOLD'], output_coord_in_ratio=True, ocr_bbox=ocr_bbox,draw_bbox_config=draw_bbox_config, caption_model_processor=self.caption_model_processor, ocr_text=text,use_local_semantics=True, iou_threshold=0.7, scale_img=False, batch_size=128)

        return dino_labled_img, parsed_content_list, label_coordinates

3.模型的介绍

3.1 Paddle_ocr

官方针对图片字符识别推荐使用的是paddle_ocr，猜测原因应该是效果不错 + 开源，接下来介绍下paddle_ocr基本使用。

3.1.1安装

pip install paddleocr

由于PaddleOCR支持多种语言，需要设置一些配置参数，以下为Demo设置的参数，识别的语言设置的英文，这里如果识别中文修改为lang='ch'：

paddle_ocr = PaddleOCR(
    lang='en',  # other lang also available
    use_angle_cls=False,
    use_gpu=False,  # using cuda will conflict with pytorch in the same process
    show_log=False,
    max_batch_size=1024,
    use_dilation=True,  # improves accuracy
    det_db_score_mode='slow',  # improves accuracy
    rec_batch_num=1024)
result = paddle_ocr.ocr(image_np, cls=False)[0]

识别结果格式示例如下，分为有文本框，文字和识别置信度

[[[28.0, 37.0], [302.0, 39.0], [302.0, 72.0], [27.0, 70.0]], ('纯臻营养护发素', 0.9658738374710083)]
......

3.2 YOLOv8n

3.2.1. 图标检测模型简介

图标检测模型是OmniParser-v2的基础组件之一，主要负责从屏幕截图中识别并定位可交互的UI元素，如按钮、输入框等。该模型经过大规模数据集训练，能够检测最小至8×8像素的元素，确保在各种分辨率和界面复杂度下都能准确识别。使用的检测模型为YOLOv8，以下为官网的介绍：

YOLOv8 was released by Ultralytics on January 10th, 2023, offering cutting-edge performance in terms of accuracy and speed. Building upon the advancements of previous YOLO versions, YOLOv8 introduced new features and optimizations that make it an ideal choice for various object detection tasks in a wide range of applications.

翻译：YOLOv8 由 Ultralytics 于 2023 年 1 月 10 日发布，在准确率和速度方面提供一流的性能。在之前 YOLO 版本的改进基础上，YOLOv8 引入了新功能和优化，使其成为广泛应用中各种对象检测任务的理想选择。

下面图片是官网提供COCO数据上检测结果对比，v8一共有5种变形模型，从官方的测试结果看yolov8n其实是效果最差的，不知OmniParser为啥选这个检测模型。


3.2.2 YOLOv8模型使用

from ultralytics import YOLO

# Load a COCO-pretrained YOLOv8n model
model = YOLO("yolov8n.pt")

# Display model information (optional)
model.info()

# Train the model on the COCO8 example dataset for 100 epochs
results = model.train(data="coco8.yaml", epochs=100, imgsz=640)

# Run inference with the YOLOv8n model on the 'bus.jpg' image
results = model("path/to/bus.jpg")

这里推荐个YOLO网络结构可视化的工具：netron具体用法可以搜下，后续再抽时间解读网络结构。

3.2.3 YOLOv8 主要特点

• 先进的主干和颈部架构：

YOLOv8 employs state-of-the-art backbone and neck architectures, resulting in improved feature extraction and object detection performance.

• 无锚分割 Ultralytics 头：

YOLOv8 adopts an anchor-free split Ultralytics head, which contributes to better accuracy and a more efficient detection process compared to anchor-based approaches.

• 优化的准确度-速度权衡：

With a focus on maintaining an optimal balance between accuracy and speed, YOLOv8 is suitable for real-time object detection tasks in diverse application areas.

• 优化的准确度-速度权衡：

YOLOv8 offers a range of pre-trained models to cater to various tasks and performance requirements, making it easier to find the right model for your specific use case.

3. Florence-2

Florence-2 是微软与2024年6月发布的多模态大模型，专为视觉理解任务设计，旨在处理多种视觉和视觉-语言任务。它在计算机视觉领域展现了强大的泛化能力，能够处理多种视觉任务，如图像理解、对象检测、图像字幕生成等。

Florence-2 主要特点：

• 通用视觉理解：采用模块化设计，方便集成不同的LLM，满足多样化需求。
• 多模态学习：结合自然语言处理能力，实现视觉-语言任务，如图像字幕生成和视觉问答。
• 大规模数据训练：使用大规模、高质量的数据集进行训练，提升模型的泛化能力和鲁棒性。
• 高效推理：优化了计算效率，使其能够在云端和本地设备上快速推理。
• 跨任务一致性：在不同的视觉任务上表现稳定，适用于多种应用场景，如自动驾驶、医疗影像分析和智能监控。

在官网Demo中可以看出使用的是Florence-2-base ，Model size是0.23B，整体比较小，下面是运行模型的demo程序。

import requests

from PIL import Image
from transformers import AutoProcessor, AutoModelForCausalLM 

device = "cuda:0" if torch.cuda.is_available() else "cpu"
torch_dtype = torch.float16 if torch.cuda.is_available() else torch.float32

model = AutoModelForCausalLM.from_pretrained("microsoft/Florence-2-base-ft", torch_dtype=torch_dtype, trust_remote_code=True).to(device)
processor = AutoProcessor.from_pretrained("microsoft/Florence-2-base-ft", trust_remote_code=True)

prompt = "<OD>"

url = "https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/transformers/tasks/car.jpg?download=true"
image = Image.open(requests.get(url, stream=True).raw)

inputs = processor(text=prompt, images=image, return_tensors="pt").to(device, torch_dtype)

generated_ids = model.generate(
    input_ids=inputs["input_ids"],
    pixel_values=inputs["pixel_values"],
    max_new_tokens=1024,
    do_sample=False,
    num_beams=3
)
generated_text = processor.batch_decode(generated_ids, skip_special_tokens=False)[0]

parsed_answer = processor.post_process_generation(generated_text, task="<OD>", image_size=(image.width, image.height))

print(parsed_answer)

4.结语

OmniParser-v2通过集成上述多种先进模型，实现了从屏幕截图到结构化数据的高效转换，为大型语言模型赋予了实际的计算机操作能力。但仔细分析使用的模型分支都为参数量最小的，实际测试下来效果的话也会大打折扣，猜测应该是因为开源替换了原先效果更优的模型。后续继续挖掘下每个模型具体的实现以及如何进行模型的微调，帮助大家能在具体的业务场景实现定制化。

参考资料：

• paddleocr官方文档
• ultralytics
• Florence-2-base-HF