Skip to main content
Glama

uisight

你的AI看不到屏幕。你无法描述这个bug。uisight解决了这两个问题。

uisight为你的AI编程助手(Claude Code、Cursor、Antigravity——任何支持MCP的工具)提供了对你Web应用的真实视觉:并排运行的移动端+桌面端实时会话、一个报告数字而非感觉的测量引擎,以及一个你和AI查看完全相同屏幕的共享面板。

由一位独立开发者构建,他厌倦了拍摄手机截图、粘贴到聊天中,然后输入“这个按钮看起来坏了,你能看到吗?”

它有何不同

多视口浏览器(Polypane等)

浏览器自动化MCP(Playwright MCP等)

uisight

人类+AI共享一个实时会话

—

—

✅

测量引擎(报告1.14:1,而非“看起来低”)

面向人类

—

✅ 以文本形式,面向AI

设备×主题矩阵(移动端/桌面端,浅色/深色)

✅

—

✅

人类标记bug → AI读取备注+截图

—

—

✅

测量引擎是核心:你的AI无需浪费token去费力查看截图,inspect会返回类似这样的结果:

[mobile · Pixel 7 · light] https://yourapp.com/
  INVISIBLE TEXT 1.04:1 — span.bg-gradient-to-r "your headline" (text rgba(255,255,255,.5) / bg rgb(247,247,248))
  BUTTON a.text-white "Get Started" → text/background contrast 3.35:1
  touch target below 44px 180x23 — "read the guide"

文本结果廉价、精确且可直接操作——你的AI能修复确切的选择器,而不是猜测。

Related MCP server: PixelCheck

快速开始

# one-shot audit: PNGs + gallery + report for iPhone/Pixel/desktop, light+dark
npx uisight https://yourapp.com --theme both

# live panel: mobile + desktop side by side, you browse, AI watches (and vice versa)
npx uisight-panel http://localhost:3000

将其接入你的AI(MCP)

# Claude Code
claude mcp add --scope user uisight -- npx -y uisight-mcp

对于Cursor / Antigravity / 其他MCP主机,添加到你的MCP配置中:

{ "mcpServers": { "uisight": { "command": "npx", "args": ["-y", "uisight-mcp"] } } }

然后只需告诉你的代理:“用uisight查看我的应用”。面板服务器会在需要时自动启动。

MCP工具

工具

功能

see_screen

返回当前屏幕的图像——即人类在面板中看到的精确帧

inspect

运行对比度/触摸目标/溢出/主题检查;返回以文本形式呈现的测量结果

goto

将所有会话导航到某个URL(包括localhost)

tap / type_text / scroll

驱动页面——人类实时观看操作过程

set_device

切换设备配置文件(iphone-15, iphone-se, pixel, galaxy, ipad, desktop, laptop)或浅色/深色主题

status

打开的URL、会话、最近的控制台/网络错误——排查bug时的第一站

marks

读取人类在面板中固定的备注(📌 备注+当时截图)

土耳其语工具名称可通过UISIGHT_LANG=tr启用(ekrani_gor, denetle, ...)。

面板(人类侧)

npx uisight-panel <url> 在localhost:5055打开一个浏览器页面:

  • 移动端+桌面端并排显示,两者均为实时,URL同步

  • 点击 = 在该设备上点击 · 滚轮 = 滚动 · 点击后输入

  • 每个窗格的设备切换器,共享的浅色/深色切换

  • 检查按钮在每个屏幕上运行测量引擎

  • 📌 固定:输入备注,固定它——你的AI通过marks读取备注+截图。不再需要“让我描述我看到的”。

可在VS Code / Antigravity中通过简单浏览器:显示 → http://localhost:5055使用。

它检查什么

  • 不可见文本(对比度 < 1.6:1)和WCAG AA对比度失败——处理了alpha混合背景、渐变文本、oklab()/oklch()颜色

  • 低于44px的触摸目标(仅移动端配置文件;内联文本链接按宽度豁免,符合WCAG)

  • 水平溢出及导致溢出的元素

  • 小于12px的文本、无alt属性的图片

  • 主题漂移:在浅色和深色中相同的元素 = 可能是硬编码颜色

  • 每个设备的控制台/JS错误和失败的网络请求

以及诚实的限制:自动化检查无法发现设计错误——一个重叠的标题测量结果正常。这就是为什么see_screen存在,以及为什么报告会说“肉眼检查PNG”。

注意事项与限制

  • iPhone配置文件运行在真实的WebKit(Safari引擎)上——接近iOS,但并非iOS模拟器。

  • 浏览器由Playwright在首次运行时下载一次(如果想预热,可运行npx playwright install chromium webkit)。

  • 一切本地运行——无云端、无账户,你的屏幕永远不会离开你的机器。

  • v0.1版本提供英文界面,底层代码库最初用土耳其语编写(正在迁移中)。欢迎贡献;变量名在v0.2之前可能会让你感到意外。

许可证

MIT © SoloLabs

Related MCP Connectors

Related MCP Servers