UI2CODE 图片识别自动生成代码

案例来源:闲鱼
会议地点:深圳
分享时间: 2019-06-22 10:00-11:00

项振辉 

闲鱼 前端专家

从事 前端工作多年, 曾在 蘑菇街担任 前端商家业务技术&基础架构业务Leader ,搭建了蘑菇街大部分的基础前端业务和搭建服务,现在 淘宝 闲鱼 担任前端技术Leader , 主要关注 tensflow和端侧的技术结合和业务就会

课程概要

案例背景简介:
基于 图片 如何精确识别我们定义的 基础UI控件、自定义UI控件、业务控件,并提高识别的准确率,并准确的提取出 对应控件的基础属性, 来保证代码还原的精确实现, 另外 关于 如何 基于静态的图片生成动态的flex 的精确布局,也是比较大的挑战。

解决思路/成功要点:
引入 tensflow 来建立对应的组件分类,另外 也引入了 一些图像理解的技术 来帮助识别并提取对应的属性,另外我们还实现了 基于 基础的组件信息和关系 去识别 该组件的语义信息,和后端的 VIEWMODEL 进行打通,在传统的前端基础的工程能力基础上 拓展了新的机器学习的思路和想法。

成果:
目前 我们基于精确度比较高的 图片 已经能比较好的产出对应的 UI还原界面, 目前我们支持了 weex和flutter和淘宝小程序 3种对应的实现,已经在闲鱼自己目前的工作环境里 对效率产生了比较大的提升。

听众收益

1. 拓宽下 传统前端的视角,了解下 机器学习和传统的开发技术 是否能有结合的部分
2. 对技术架构和业务架构在一个相对聚合的业务本身如何做取舍
3. 相对简单的了解下机器学习能干什么,和一些基本的工作方式

项振辉 

闲鱼
前端专家

从事 前端工作多年, 曾在 蘑菇街担任 前端商家业务技术&基础架构业务Leader ,搭建了蘑菇街大部分的基础前端业务和搭建服务,现在 淘宝 闲鱼 担任前端技术Leader , 主要关注 tensflow和端侧的技术结合和业务就会

课程概要

案例背景简介:
基于 图片 如何精确识别我们定义的 基础UI控件、自定义UI控件、业务控件,并提高识别的准确率,并准确的提取出 对应控件的基础属性, 来保证代码还原的精确实现, 另外 关于 如何 基于静态的图片生成动态的flex 的精确布局,也是比较大的挑战。

解决思路/成功要点:
引入 tensflow 来建立对应的组件分类,另外 也引入了 一些图像理解的技术 来帮助识别并提取对应的属性,另外我们还实现了 基于 基础的组件信息和关系 去识别 该组件的语义信息,和后端的 VIEWMODEL 进行打通,在传统的前端基础的工程能力基础上 拓展了新的机器学习的思路和想法。

成果:
目前 我们基于精确度比较高的 图片 已经能比较好的产出对应的 UI还原界面, 目前我们支持了 weex和flutter和淘宝小程序 3种对应的实现,已经在闲鱼自己目前的工作环境里 对效率产生了比较大的提升。

听众收益

1. 拓宽下 传统前端的视角,了解下 机器学习和传统的开发技术 是否能有结合的部分
2. 对技术架构和业务架构在一个相对聚合的业务本身如何做取舍
3. 相对简单的了解下机器学习能干什么,和一些基本的工作方式

CopyRight © 2008-2021 Msup & 高可用架构

京ICP备09001521号