江苏龙网

  1. 首页 > 人文 > >

迭代前端智能化：视觉稿图像识别技术难点和思考


Imgcook 中的图片生成代码服务 ， 能够将图片转换成 Flutter、H5 等代码 ， 能够获取元素的位置和属性等内容 ， 具体如下图所示 。
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
【迭代前端智能化：视觉稿图像识别技术难点和思考】图片生成代码怎么做
图片生成代码 ， 具体步骤可以分为如下几步：版面分析：提取轮廓和元素属性提取：获取文字、图片、轮廓等的属性布局推导：获取重复布局、GridView、ListView等布局类型代码生成：代码翻译生成对应的Flutter、H5等代码复制代码
本文会介绍版面分析模块的一些难点和思考 。
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
技术难点和思考
迭代1：传统图像处理
第一版我们自然想到了先利用机器视觉的方法来做边缘检测和行列投影的方式去获取对应的轮廓和元素 。
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
但是这一版本存在很明显的问题：
1）前后景颜色接近会导致无法召回
2）元素叠加时会丢失叠加的元素
例如下图的播放按钮
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
迭代2：引入深度学习
第一版存在不理解语义的问题 ， 我们在第二版引入深度学习去尝试理解语义 。 深度学习 ， 故名思义存在很深的网络 ， 每一层的卷积网络都能获取不同的特征图 ， 多层融合可以很好地提取特征信息 ， 使得机器“理解”语义信息 。
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
迭代3：深度学习融合传统图像处理算法
目标检测方法 ， 无论是一阶段还是二阶段的模式都存在位置定位不准的问题 ， 如下图所示 。 我们尝试将迭代1和迭代2的方法融合 ， 结合深度学习的语义理解能力和传统图像处理精度高的优点 ， 迭代了第三个版本
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图
分析结果
版面分析结合深度学习的语义理解能力和传统图像处理精度高的优点 ， 可以得到很高的精确率和召回率 ， 闲鱼千余张版面分析结果如下：
迭代前端智能化：视觉稿图像识别技术难点和思考
本文插图


    推荐阅读


    上一篇：一点前沿关科技节能飞机，NASA怪异的机翼设计

    下一篇：福安军事真正目的是另一大国，敲山震虎！美将五国列为反恐行动不合作国家