求助，有没有视觉大模型可以识别一个 UI 设计图中各个模块的划分

[9527kf]

我有一些设计图，想用视觉大模型将图中有哪些模块，各个模块的位置信息给标出来（左上角位置和右下角位置）。
试了几个模型，能识别出来有几个模块，但不能准确标出位置信息。
大家有了解这块的吗

[seedhk]

自己训练模型吧

[neteroster]

给张例图

[sillydaddy]

给张例图

[9527kf]


就这样的，模块划分比较明显的

[9527kf]

@9527kf 不会发图

[Liftman]

你是 cs 还是 bs 大屏。可以实现的很多。因为现在全部基于 computer use 类的 agent 都需要能够准确定位。。。不然无法操作点击指令。browser use 也是。

[wo4211831]

可以考虑试试 qwen-vl 。试试这样的提示词
请分析这张仪表盘（ Dashboard ）图片，并返回一个 JSON 结构化数据，包括每个模块的名称、内容、坐标位置（左上角坐标、宽度、高度）。
要求：
1. 解析图像中的各个数据模块，如“地区情况”、“库存情况”、“临期货物情况”、“仓库订单”等，并提取其具体数据。
2. 提供每个模块的位置信息，包括：
- `x`：模块左上角横坐标
- `y`：模块左上角纵坐标
- `width`：模块宽度
- `height`：模块高度
3. 结构化输出为 JSON 格式，示例：
```json
{
"modules": [
{
"name": "地区情况",
"content": {
"商品 1": 287,
"商品 2": 59,
"商品 3": 23
},
"position": { "x": 100, "y": 200, "width": 300, "height": 200 }
},
{
"name": "库存情况",
"content": {
"周一": 180,
"周二": 50,
"周三": 90,
"周四": 40,
"周五": 30,
"周六": 120,
"周日": 150
},
"position": { "x": 450, "y": 200, "width": 300, "height": 200 }
}
]
}

[sillydaddy]

我感觉你说的视觉大模型是大语言模型吧？因为像 yolo 这样的视觉模型，不可能不给出坐标位置的。
yolo 试过吗，我感觉 yolo 可以。不过可能需要自己标注数据然后训练一下，之前看过训练 yolo 可以识别验证码。
yolo 不是大语言模型，可以部署在低配置的机器上。

[9527kf]

@Liftman 谢谢老哥，是 bs 的，但是还是设计图阶段。browser use 这些框架，是基于 dom 的识别吧

[9527kf]

@wo4211831 谢谢老哥，我试试你的提示词，我用自己的提示词试过，就是最终给的坐标不准确

[9527kf]

@sillydaddy 谢谢老哥，是说的视觉大语言模型，用这个比较简单吧。你说的这种视觉模型经过自己训练，应该是更靠谱些，但是我们这边不懂这块技术

[Liftman]

@9527kf ...图也没事。https://imgur.com/a/R5yA95H 。主要模块坐标区域统计
顶部标题栏 (Top Title Bar)

位置: 约 [425, 190] 中心点
区域: 约 [325-525, 180-200]
内容: "两江新区智慧交通"
中央数字指标 (Central Digital Indicators)

大数字: 约 [450, 395] 中心点
数字显示: "3 2 8 6"
区域: 约 [435-565, 375-420]
地区概况 (Regional Overview) - 左上角饼图

位置: 约 [150, 290] 中心点
区域: 约 [50-250, 230-350]
内容: 饼图显示区域 1/2/3 的数据，287, 59, 23 等数值
库存情况 (Inventory Status) - 左中部柱状图

位置: 约 [150, 445] 中心点
区域: 约 [50-250, 380-510]
内容: 按星期显示的柱状图，有 287 和 59 的数值标记
城市销售情况 (City Sales Status) - 左下角列表

位置: 约 [150, 610] 中心点
区域: 约 [50-250, 540-685]
内容: 多个城市的销售数据条形图
待发货/发货/拒收 (Pending/Shipped/Rejected) - 中上部三个卡片

位置: 约 [510, 265] 中心点
区域: 约 [320-690, 240-285]
内容:
待发货: 2888
发货: 1888
拒收: 98
仓库订单 (Warehouse Orders) - 中部标题

位置: 约 [510, 355] 中心点
区域: 约 [480-540, 345-365]
下方三个指标 (Bottom Three Metrics)

易碎 (Fragile): [380, 480] 中心点，数值 96
轻重 (Weight): [510, 480] 中心点，数值 108
定制 (Custom): [650, 480] 中心点，数值 57
临期货物情况 (Expiring Goods Status) - 右上角

位置: 约 [880, 290] 中心点
区域: 约 [770-970, 230-350]
内容:
时间筛选: 50 天
临期金额: 580,000,000
临期货物量: 3800
单项目标完成情况 (Project Completion Status) - 右中部

位置: 约 [880, 445] 中心点
区域: 约 [770-970, 380-510]
内容:
完成比例: 60%
已完成: 2408
未完成: 1729
人流量情况 (People Flow Status) - 中下部雷达图

位置: 约 [510, 610] 中心点
区域: 约 [430-650, 540-685]
内容: 多维度的雷达图
实时订单趋势 (Real-time Order Trends) - 右下角柱状图

位置: 约 [880, 610] 中心点
区域: 约 [770-970, 540-685]
内容: 柱状图显示订单趋势
右上角时间筛选 (Time Filter - Upper Right)

位置: 约 [980, 185] 中心点
区域: 约 [950-995, 175-195]
内容: "本月" 下拉菜单
底部任务栏 (Bottom Taskbar)

位置: 约 [512, 735] 中心点
区域: 约 [0-1024, 720-750]
内容: 桌面图标和工作区信息
这是一个完整的智慧交通大屏显示界面，包含了多种数据可视化图表（饼图、柱状图、雷达图）和关键性能指标，用来监控交通运输相关的各类指标和状态。

[lihanst]

苹果的 Ferret-UI

[9527kf]

@Liftman 这是用什么识别的，我去试试

[9527kf]

@lihanst 感谢老哥，你这个看着好像是专门干这个的，我去试试

[Liftman]

@9527kf 就 computer use 。。但是你还需要 claude api 。。而且他是基于内部 ubuntu 的桌面分辨率坐标。你还需要用二开的跑在本地系统的那个版本。。。我只是表示下 ai 可以做到。但是没部署就费劲。

[gaobh]

为啥要这么干，标注有啥意义，不能用 figma 么……

[9527kf]

@gaobh 没用过 figma