产品截图会出现在落地页、文档、应用商店和融资材料里。把它们当作随手一截的临时产物，是一个常见且显眼的错误。

用高分辨率捕捉

  • 用高 DPI（高清）显示器截图。 在普通分辨率屏幕上截的图，在现代显示器上看起来发软，而且事后无法补救。
  • 按 2 倍捕捉、按 1 倍显示。 显式设定显示尺寸，让浏览器把高清文件缩小显示，而不是按原始像素铺开。
  • 绝不要放大截图。 界面文字是对插值最不宽容的内容——重新截一张。
  • 如果你的显示器不是高 DPI，用浏览器的设备模拟模式按 2 倍或 3 倍设备像素比截图。

先把数据清理干净

截图里的内容本身也是信息的一部分：

  • 把占位文本和测试数据换成真实可信的内容。截图里出现"asdf asdf"会瞬间摧毁可信度。
  • 使用一致、可信的姓名、数字和日期。 避免过期日期和荒谬数值。
  • 移除个人和内部信息：真实客户姓名、邮箱地址、内网 URL、账号 ID、API 密钥。截图泄露是实实在在的安全问题。
  • 隐藏浏览器杂物：书签栏、扩展图标、其他标签页、通知角标。用干净的配置文件或无痕窗口。
  • 把界面调到中性状态：没有错误横幅、没有填了一半的表单、没有莫名展开的下拉菜单——除非那正是你要说明的。

按信息裁剪

  • 只展示说明文字提到的部分。 一张全屏截图里只有一个相关按钮，作为图示远不如把那个区域紧紧裁出来。
  • 保留足够的上下文，让读者知道自己身在何处——一个区块标题、一条标签栏。
  • 一组截图裁剪一致才显得经过设计；参差随意则显得仓促。
  • 移动端截图可以考虑加设备外框：它能立刻交代场景。但要简洁且是当代机型；过时的手机框会让你的产品显得陈旧。

标注要克制

  • 每张截图最多一两处标注。箭头、一个高亮矩形，或轻微的聚光效果。
  • 风格统一——所有截图用同样的颜色、同样的线宽、同样的字体。
  • 用界面里不存在的颜色，标注才会被读作叠加层而不是界面元素。
  • 敏感字段用实心色块遮盖，而不是轻度模糊——后者是可以被还原的。

格式与交付

  • 截图一律用 PNG。 界面文字高对比、边缘锐利——正是 JPEG 压缩损伤最严重的内容。JPEG 截图会在每个字母周围出现振铃伪影。
  • 体积成问题时，裁得更紧或减少色板，而不是改用 JPEG。纯色界面的截图用减色的 PNG-8 压缩效果很好。
  • 无损 WebP 是不错的现代替代方案，能以更小体积保持锐利。
  • 用描述性文件名并保留原图——界面改版时你需要重新截取，而有据可查的原始状态会帮上忙。

最后，把截图维护排进日程。没有什么比"界面早已不存在"的截图更能让营销页显得过时，而过期截图会悄悄削弱页面上其他一切内容的可信度。