VisBug

Chrome浏览器插件下载和安装教程(图文讲解)
开源浏览器设计工具

使用 JavaScript 构建的开源 Web 设计调试工具:面向设计师的 FireBug。

- 指向、单击、移动、调整大小和修补
- 在任何状态下编辑或设计任何页面,就像它是一个画板
- 检查样式、间距、距离、可访问性和对齐方式
- 挑剔的布局和内容,在真实的终端环境中,在任何设备尺寸
- 利用 adobe/sketch 技能
- 编辑文字,替换图片
- 在混乱中设计:使用生产或原型以及它们产生的奇怪状态,作为画板和设计机会
- 在 DevTools 模拟延迟、i18n、媒体查询、平台限制、CPU、屏幕大小等的同时进行设计
- 在您的网站/应用程序的前端做出更多决定(a11y、响应式、边缘情况等)
- 无需等待开发人员公开他们的乐高积木,只需直接编辑最终状态(无论框架如何)并执行/测试一个想法

**通过将设计工具交互和热键引入浏览器,为设计师和内容创作者赋予权力,在他们目前觉得自己几乎没有权力的地方**