Quartz 4

🔍 搜索

Vision Go 使用文档

11 min read

Vision Go 使用文档

💡 视觉狗(vision go)工具用来测量视频录制的交互场景的用户感知流畅度。工具的形态为 Python 脚本,通过命令行的方式进行交互。

环境准备

视频录制工具

下载定制版的 scrcpy,该版本携带了更多的信息,方便进行结果数据上的联动。

下载:

wget --quiet --output-document=scrcpy-mi.zip http://cnbj1-fds.api.xiaomi.net/inner-share/datasets/apollo/scrcpy-mi.zip && \
    unzip scrcpy-mi.zip && \
    rm scrcpy-mi.zip && \
    cd scrcpy-mi && \
    ./install_release.sh && \
    rm -rf scrcpy-mi

验证是否安装成功:

scrcpy --version
 
scrcpy-mi 2.4
 
Dependencies (compiled / linked):
 - SDL: 2.0.20 / 2.0.20
 - libavcodec: 58.134.100 / 58.134.100
 - libavformat: 58.76.100 / 58.76.100
 - libavutil: 56.70.100 / 56.70.100
 - libavdevice: 58.13.100 / 58.13.100
 - libusb: - / 1.0.25

视频录制命令如下,ctrl+c 结束录制:

scrcpy --no-audio --record=test.mkv

视觉狗下载

地址

📄 [引用文档: 视觉狗下载](feishu docx: QKVndKWfDom65WxGF6acPm49nWe)

依赖安装

运行环境

  • 系统:Ubuntu 20.04.5+(其他系统可能需要适配)
  • Python 版本:3.10.0+
pip install opencv-python imagehash numpy PIL pandas tkinterdnd2

使用

视觉狗内置了五类常用的流畅度评测模型,以满足不同交互场景用户感知流畅度的测量。通过观察帧间距曲线的平滑度来判断用户感知流畅度优良。

命令一览:

➜ $ ./vision_go.py -h
usage: vision_go.py [-h] -v VIDEO_FILE_PATH [-m MODEL] [-c] [-b BEGIN_INDEX] [-e END_INDEX] [-d] [-s] [-n] [-t]
 
Analyzing user-perceived fluency through videos, version 1.0.0.
 
options:
  -h, --help            show this help message and exit
  -v VIDEO_FILE_PATH, --video-file-path VIDEO_FILE_PATH
                        the path of the video which will be parsed
  -m MODEL, --model MODEL
                        define the model of vision algorithm, default is 'browse' , optional models are 'motion'、'color-motion'、
                        'color-motion-transition'、'color-motion-transition_x'、'color-motion-transition_y'、 'color-motion-
                        scale''、'color-motion-scale_x'、'color-motion-scale_y'、'fling_v'、'fling_h'、'slide_v'、'slide_h'、
                        'response'、'browse'.
  -c, --crop            crop the video by frame start and end index
  -b BEGIN_INDEX, --begin-index BEGIN_INDEX
                        crop the video by frame start index
  -e END_INDEX, --end-index END_INDEX
                        crop the video by frame end index, default is the last frame index
  -d, --debug           set debug mode to see debug info, default is false
  -s, --step-frame      browse frame step by step
  -n, --no-show         do not show the stat graph
  -t, --trim            trim wrong frame data if need

GUI 操作:

$ ./vision_go.py

产物:

概念定义

名词定义
distance (px)真实像素距离,单位 px
average distance (px)平均像素距离,由多个几何变化维度加权产生,只具备相对参考意义
time(ms)相对时间,单位毫秒,第一个数据时间取 0,后续时间都减去第一个时间获得,具备相对参考意义
model测试模型,来自于 vision go 工具,主要有 motion、fling_v、color-motion、color-motion-transition 等等
smooth曲线平滑度,来自于 vision go 工具,用于衡量帧间距曲线平滑度,平滑度数值越小,动效越流畅

帧间距曲线图如何判断流畅性

💡 是否丢帧:帧间距为 0 则是丢帧,帧间距突刺大于 20 像素为跳帧。 是否平滑:曲线毛刺越少或者抖动幅度越小越平滑

下面列举模型的场景典型构建以及分析方式,以下举例描述如何使用评测模型。

评测模型

运动模型

适用于满足**高对比度背景(contrast)和单一变量(single)**的场景,简称 CS 原则,否则测量结果不准或者没有结果。

🎬 [视频附件: 运动模型示例(I5d6bO491ouESMxVahFck8kDnad,源空间 403 无法下载)]

场景设计与操作

交互场景的背景为深色,与运动窗体白色形成鲜明对比,满足 CS 原则。点击 dock 使用 scrcpy 录制窗口打开完成流程获得视频文件 motion.mkv。

分析命令

./vision_go.py -v motion.mkv -m motion

结果分析

横轴为相对时间,纵轴为平均像素,使用的模型是 motion,曲线比较平滑。

惯性滑动模型

适用于页面的横向或者纵向动效单向变化的场景。

🎬 [视频附件: 惯性滑动模型示例(WC1nbnlM8o3uTCxLDYacVcxhnGt,源空间 403 无法下载)]

场景设计与操作

使用 adb swipe 来触发抛滑,使其纵向滑动,注意不要触发边缘回弹,避免带来分析干扰。

分析命令

./vision_go.py -v fling.mkv -m fling_v
# 横向惯性滑动为 fling_h

结果分析

横轴为相对时间,纵轴为像素,使用的模型是 fling_v,曲线比较平滑,但是离手时丢了一帧。

跟手滑动模型

适用于跟手滑动页面的场景测试场景。建议使用命令操作滑动来保持匀速滑动。

🎬 [视频附件: 跟手滑动模型示例(FkDobeaOJoIIemxM9gOc8HbMnQf,源空间 403 无法下载)]

场景设计与操作

# adb shell input touchscreen swipe <起始点 X> <起始点 Y> <结束点 X> <结束点 Y> [滑动时间(毫秒)]

使用命令实现手指匀速滑动一秒的效果,获得视频 slide_v.mkv,注意不要触顶回弹。

分析命令

./vision_go.py -v slide_v.mkv -m slide_v
# 横向滑动为 slide_h

结果分析

刚开始的曲线震荡阶段为跟手滑动阶段,后面向下减小的阶段为惯性滑动阶段。横轴为相对时间,纵轴为像素,使用的模型是 fling_v,曲线比较平滑,但是离手时丢了一帧。

响应时延模型

适用于满足 CS 原则的场景,点击按钮,观察随之而来的变化何时发生。

🎬 [视频附件: 响应时延模型示例(VSHSbw6KGow3MLxVdX5cFkiznQk,源空间 403 无法下载)]

场景设计与操作

该模型需要配合显示指针位置标识使用,打开方式如下:

或者使用命令:

# 打开指针
adb shell settings put system pointer_location 1
# 关闭指针
adb shell settings put system pointer_location 0

保持界面在点击按钮后只会有一个变化视角要素即可,模型将捕获第一帧变化。

分析命令

./vision_go.py -v response.mkv -m response

结果分析

图中 0 的位置是 touch down 时间,1 位置是 touch up 时间,2 位置是第一帧变化时间。

时延 = 2 位置时间 - 1 位置时间,此处为 195ms。

标记追踪模型

适用于复合动效,多动画元素,无规则动画场景。

根据测试的几何维度变化,共计 7 个子模型。原则上尽可能使得帧间距是真实的像素变化。

模型几何变化维度纵轴是否为像素
color-motion宽度 + 高度 + 纵向位移 + 横向位移否
color-motion-transition纵向位移 + 横向位移否
color-motion-transition_x横向位移是
color-motion-transition_y纵向位移是
color-motion-scale宽度 + 高度否
color-motion-scale_x宽度是
color-motion-scale_y高度是

举例 1:color-motion

🎬 [视频附件: color-motion 示例 1(GOK5bQW00oO72sxOi1PcWTFUnJQ,源空间 403 无法下载)]

场景设计与操作

对需要进行测量的页面进行代码修改,页面中增加一个颜色为 #FF0000 的高亮红色矩形,模型将识别和跟踪这个特定颜色的矩形来测量流畅度,而忽视其他视觉要素的干扰。

分析命令

./vision_go.py -v mark.mkv -m color-motion

结果分析

纵轴为平均像素,横轴为相对时间,在 50ms 左右的位置丢了一帧。

举例 2:color-motion-transition_y

🎬 [视频附件: color-motion-transition_y 示例 2(OGRmbRLOxohcn2xuR1zcZBxCnWh,源空间 403 无法下载)]

场景设计与操作

对需要进行测量的页面进行代码修改,页面中增加一个颜色为 #FF0000 的高亮红色矩形,模型将识别和跟踪这个特定颜色的矩形来测量流畅度,而忽视其他视觉要素的干扰。

分析命令

./vision_go.py -v mark.mkv -m color-motion-transition_y

结果分析

📷 截图

纵轴为像素,横轴为相对时间,拖动 500ms 后放手,没有丢帧,平滑度尚可。

逐帧浏览

视频逐帧浏览功能用于方便优化人员深层次分析画面帧率情况,命令如下:

./vision_go.py -v mark.mp4 -s

每敲击任何一个按键,将浏览下一帧。

视频截取

由于实际录制的视频可能较长,但是关键时间段只是很小一部分,为了加快分析速度,可以通过视频截取功能将有用的视频时段截取出来,然后对截取的视频进行测量,命令如下:

./vision_go.py -v mark.mp4 -c -b 10 -e 50
# -e 可以不填写,默认是视频最后一帧

🎬 [视频附件: 视频截取功能演示(DkXTbl6ZioWynyxOFhKcNHnknid,源空间 403 无法下载)]

附录

📄 [引用文档: FrameTimeline 卡顿检测工具与流畅度模型](feishu docx: Wgb5dWyyOo2Ugsxaj5vcdl6cncc)

📥 抓取自飞书 wiki 空间 7541192071952990209,obj_token: N4pSdpcsLoJlG1xLwGHcZDuHnif 🔗 性能强相关:通用流畅度分析见 blog/performance/rendering/;本系列总览见 用户感知流畅度评估体系

Graph View

Backlinks