淘宝天猫业务产品很多，每年还会有很多大促活动，产品页面心智不同导致 UI 视觉多样、业务性质不同导致业务逻辑不同，大量的 UI 难以复用，需要投入大量的前端人力来开发，前端同学的业务压力非常大。为了解决这种困境，我们研发了自动生成代码平台 imgcook，帮助提升前端研发效率。

在 imgcook 中我们逐步引入了 CV、NLP 等 AI 技术来辅助识别设计稿信息智能生成可读性和可维护性较高的代码，并在双 11 大促中自动生成了 79.34% 的前端代码，助力前端研发效率提升 68%。智能生成代码平台 imgcook.com 在 2019 年已经正式对外开放，服务于 25000+ 用户。 本次分享将为大家介绍设计稿生成代码平台 imgcook 的核心思想以及AI技术在 imgcook 中的应用场景和落地实践。

演讲提纲：

1. 设计稿生成代码平台 imgcook 介绍
   • 产品发展历程
   • D2C双11研发提效
2. 机器学习技术在 D2C 领域的应用场景
3. 前端视角下，D2C 领域机器学习应用实践
   • 使用机器学习解决问题的一般步骤
   • 组件化代码生成的问题定义
   • 如何收集组件样本数据？
   • 如何做机器学习算法选型？
   • 前端工程师如何训练模型？
   • 模型识别服务部署
   • 模型识别服务应用于D2C工程链路
4. D2C 双 11 零研发工程实践
5. 未来展望

你将获得：

1. 了解机器学习技术在设计稿生成代码（D2C）领域的应用场景
2. 了解如何将机器学习技术应用到工程项目中解决业务问题

羚珑智能设计平台是一个在线设计服务平台，专注于泛零售领域的设计，帮助客户解决日常经营过程中碰到的各类设计需求，那么 Web 技术在图形领域可以玩出什么花样呢？ 
本次主要介绍京东围绕智能设计背后的图形处理技术：矢量图像的可视化编辑、背景的程序化生成、好看的商品堆品等。  

演讲提纲：

1. 3 分钟了解羚珑是什么
   • 羚珑的能力全景图
   • 羚珑的核心功能视频演示
2. 设计物料的数字化是线上可视化设计的基础
   • PSD 的解析处理
   • SKETCH 的解析处理
3. 设计物料的线上渲染，选 DOM 还是 CANVAS
   • 演示 - 利用 DOM 渲染一个 PSD 数据
   • 演示 - 利用 CANVAS 渲染同一个 PSD 数据
   • DOM 与 CANVAS 的对比评估及未来羚珑的选择
4. 矢量元素的渲染与编辑
   • 背景 - 设计师的疑问
   • 矢量元素在 Web 端的渲染及编辑 DEMO
   • PSD 或 SKETCH 里面的矢量图层识别处理
5. 利用 Web 技术能不能生成高可用性的背景素材
   • 我们的背景素材都是需要花钱买的，大部分素材都是位图，适用性低
   • 看看行业产品的背景功能模块
   • 我们是如何实现高可用性的矢量背景素材的
6. 智能堆品 - 给你几个商品，能不能帮我自动摆的好看点
   • 大部分机器生成的商品广告图都是单品的，而设计师和客户希望支持多商品，还要堆得好看
   • 我们的堆品实现思路
   • 看看我们的堆品 DEMO
7. 结语
   • 羚珑未来的技术发展计划
   • 我的一些感受

你将获得: 

1. 了解复杂矢量图的制作过程 
2. 了解基于矢量图的背景生成器原理 
3. 了解堆放商品实现方式  

Design to Code 短短几个字，背后隐藏了巨量的工作。想解析诸如 Sketch 、PSD 这样的矢量图形很容易，但是想生成一份真正能被程序员所接受的代码实在很有挑战。
我们团队历经 8 个月，在 2020 年 6 月份发布了第一个内测版本。经过三个月好几轮的内测后，初期的热心用户都纷纷的离开了。我们不得不思考，他们为什么“不买单”？什么才是前端工程师真正想要的代码？
在整个算法引擎中，达成相对定位布局只是万里长征第一步，如何推算出靠谱的分组关系，如何实现具有普适性的 List、Grid 识别，这些都是摆在面前一座又一座的大山。
通过一年的优化，我们已经做将常规页面的 CSS 代码量控制在了 200 行左右，不少用户基于我们的工具实现了产品上线。本次分享将为大家介绍 CodeFun，一个名不见经传的小团队，如何趟通前端智能化这条道路，如何翻译出工程师真正愿意“买单”的代码？

演讲提纲：

1. CodeFun 项⽬背景 
   • 前端智能化现状
   • 技术发展历程与踩过的坑 
     • 技术路线的多次变迁与迭代 
     • 内测⽤户⼤量流失后的问题分析与总结 
     • ⽤户画像的多次摇摆与变迁 
   • ⽤户为什么不“买单”？ 
     • 设计师不愿意配合的原因 
     • ⼯程师不愿意⽤的原因 
2. 普适性 D2C 
   • 普适性 D2C
   • 普适性带来的困难与挑战 
     • 研发⼯作量分布 
     • 算法总流程架构分享 
     • 在“零规范”下倒逼出来的 N 种算法场景介绍 
3. 让⽤户真正为之“买单”的算法
   • 模式识别 showcase  
     • List 推算 
     • Grid 推算 
     • 等分模式推算 
   • Flexbox 识别算法 showcase  
     • space-* 推算 
     • flex-grow 推算 
   • 用户落地效果分享
4. D2C 各⼤⼚牌是竞争还是协作？ 
   • CodeFun 的下⼀步⼯作展望 
   • D2C 各品牌之间应该如何良性互动？ 
   • D2C 的未来

你将获得：

1. 了解前端智能化真正的核心困难
2. 了解前端智能化带给用户真正的效率变革