腾讯 MIG 实习期间，在视频理解 demo 的基础上又推进了视频搜索 demo，主要是使用多媒体方式：文字、图片、视频和画画来搜索视频。我的工作还是实现前端平台，其中画画模块需要一个画板能接收用户的画画数据，包括画画线条和笔画顺序等数据。
视频搜索 demo 的画画搜索模块参考的是最近很火的“猜画小歌”，其原型是 Google AI 实验室推出的 Quick, Draw!，主要是使用 RNN 对用户画出来的简笔画进行分类预测，并且已经在 TensorFlow 上给出了教程 Recurrent Neural Networks for Drawing Classification，参考的论文则是 A Neural Representation of Sketch Drawings，但是其并没有开源其前端画板和画画编码的源码。
因此前端画板部分主要参考了类似的完全开源的 Sketch-RNN，Sketch-RNN 不仅仅有前端画板记录并优化用户的画画数据，还能够在用户画画的基础上选择物体模型让 AI 进行补全画画，感觉可以作为“猜画小歌”的升级版“帮画小歌”，感兴趣的可以试试作者给出的 demo。
集成 Skech-RNN-JS
Skecth-RNN-JS 是一个完全使用 JavaScript 实现的 Sketch-RNN 项目，包括前端画板、画画编码和是使用预训练好的模型生成简笔画的功能，并且源码中包括了一系列的前端 demo 用于展示各种特性。因为我们的目标主要是集成 Sketch-RNN 的前端画板，并把用户画画的数据编码成可以用于简笔画分类的数据格式，因此参照的主要是 predict.html / predict.js 这个 demo：
前端画板：分析 predict demo 源码可以发现前端画板主要是集成了一个图形绘制和交互开源库 p5.js，可以对一个 canvas 画布进行底层绘制操作，包括设置画布的宽高背景色，设置画笔的粗细颜色然后绘制直线以及各种基本图形，响应鼠标位置和操作进行相应的绘制，设置帧率然后调用 draw() 动态绘制等等。然后这个 canvas 画布可以嵌入到网页元素中去作为我们的前端画板，响应用户的鼠标操作完成简笔画的绘制。
画画编码：Sketch-RNN 里首先是使用 Line Data 来记录一系列的点组成的笔画，比如 [[[x1, y1], [x2, y2], [x3, y3]], [[x4, y4], [x5, y5]]] 表示整个简笔画由两笔组成，第一笔由点 1、2、3 连起来，第二笔由点 4、5 连起来。当然实际的简笔画所包含的点要复杂得多，所以在用户在每完成一笔之后会进行一定的辅助平滑以减少所包含的点个数。之后 Line Data 就可以很容易地转换成 Recurrent Neural Networks for Drawing Classification 所需要的 drawing 数据格式，这就完成了画画编码。此外 Sketch-RNN 还进一步将 Line Data 转换成了 Stroke Data 用于生成简笔画，这里就不展开讲了。
生成画画：这一部分没有深入研究，只是直接把 Sketch-RNN 在用户画画基基础上根据模型生成画画的功能集成进来了，其工作流程主要是：对用户画画进行编码 -> 加载预训练好的模型文件（即神经网络权重数据）-> 将画画编码数据喂给模型进行预测 -> 重新画画或者在用户画画的基础上补全画画。