是不是越看越痛心疾首?
但请问,你想过改变吗?
你尝试过去解决这些问题吗?
为了彻底解决这些问题, 我做了深入而广泛的调研和思考,从调研,预研,实践,验证已经有三年有余的时间了。
这里面结合SVG 设计稿描述
,系统字体识别和字蛛转换
,多种空间 /特征算法
,视觉识别
,机器学习
,DSL 和 AST 转换
等多种技术,已经实现了从设计稿到前端页面的顺滑直出,并且对前端、设计、操作系统毫无侵入。
在项目实践中,设计稿还原度中位数 0.95 ,最高可达 0.99 , 复杂页面代码保留率 70%,而且符合开发预期, 二开体验一流。
解决方案传送门: https://gitee.com/d2-c/lens
zuoyan lens是一个通过智能算法将设计稿转换为前端页面的产品( design to code ),是低代码
平台的一个分支方向, 他的输入是设计稿产出是前端页面,中间无需值守即可自动完成。
此项目可以一键将 Sketch 、Photoshop 的设计稿转换为可维护的前端代码。100 个 page 的工作量 10 分钟内即可轻松搞定
,极大释放前端生产力。
icon
svg
文件, 可直接上传到iconfont
等作为字体图标使用,亦可转为 svg 雪碧list
,grid
等布局方式Sketch
文件GoGoCode
来做 AST 转换, 可以自由定义输出语言,语法, 比如转为:React , 微信原生,Vue ,uniapp ,Taro ,RN 等移动端推荐,PC 端暂无适配
1 ,前端开发人员
2 ,业务运营人员
1 ,前端开发人员 前端开发可以快速完成页面交付,不用担心 UI 走查,专注页面逻辑等核心问题,对于项目快速交付,减少技术债务等都有立竿见影的效果
2 ,业务运营人员 解决业务运营人员快速执行策划落地,无须等待技术排期或技术短暂工期,可以极速完成创新、验证、试错的问题,
亦可快速创建体验 demo 供客户 /老板体验, 快速达成成交意向,或者减少返工等问题
对于 D2C 类型的项目, 生成代码的准确性、可用性和可维护性是成败的关键,而设计稿的解析和推算本身就非常复杂。
这里只做简单的罗列,不做细致的分析, 因为这个东西复杂度蛮高,没有过经验的人只会云里雾里摸不清头脑,同时这些问题,我将出系列文章分享自己的经验,欢迎大家讨论
因为设计稿是纯静态的, 所以想要表达动态交互效果就只能靠脑补。 目前来看, 无论是根据环境推导还是 AI 识别,效果都不理想。 这里面要分为多个场景来细说。
1 ,可以预先定义的动效交互, 这部分的动态效果可以通过组件识别来表达, 因为动效已经在组件里定义过了, 直接命中组件即可
2 ,可脑补但没有预先定义或不能预先定义的 改造代码,甚至重构布局结构,已经没有什么方案可以解决了
3 ,产品或者 UI 不说, 前端根本就想不到的交互 这种的也没办法, 开发通过大脑都没办法命中, 更别提一个机器系统了
对于一个以降本增效为目标的项目来讲:D2C 只是其中的一环(虽然这一环就足够掉头发了),后面的开发链路还有:
逻辑 /事件编排
服务端数据理解
只有这两块内容完全开发完毕后,才能勉强说达到设计目标了,这个时候不管对开发还是产品、运营才算是一个完整的闭环链路, 庆幸的是, 这两块的算法复杂度没有 D2C 环节的高
对于开发者,这个开源项目( https://gitee.com/d2-c/lens ), 完成度不能算是完美,欢迎大家使用,提 issues 或者加我微信讨论。
同时, 该系列的文章也在列大纲梳理中,敬请期待
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.