大总管默默

目前的设计行业如何提高生产力、行业前沿的解决方案有什么?本文主要通过对设计产品的现状的了解和调研,找到更适合B端产品提效的方案~

互联网行业经过十几年的高速发展,已经进入了成熟期。在一个成熟的行业中,除创新突破外,有效的成本控制和提高生产效能是企业成败的关键。2020年疫情助推了在线办公的发展,也让数字化经济和数字化转型成了很多企业的选择,原本对用户体验要求不高的B端产品也得到了越来越多的关注。写这篇文章的初心也是基于在探索中后台产品的研发流程中,在保证较好的用户体验的前提下,通过C2D2C的模式提高产品研发的生产力,从而达到提升生产效率的目的。

一、目前有哪些提升设计与前端生产力的方案

1、D2C(Design To Code)

D2C(Design to code)这个模式我们非常熟悉,其本质是将设计师的设计资产转化为代码,让前端工程师可以快速的复用,在这个成熟的领域主要分成两大类:「设计资产类」和「设计对接类」

a. 设计资产类

设计资产类是完整系统的规范和代码进行沉淀形成设计类的资产,这一类的产品在市面上目前是属于主流,产品有网易的Fish Design(网易自研)、Ant Design、Arco Design、Element 等,这些产品都是将组件化的设计资产转化为代码资产,方便前端工程师在开发 B 端产品页面时可以快速引用,提升开发的效率。

图片

b. 设计对接类

设计对接类又分成「设计稿查看类」「设计稿代码生成类」两种类型:

设计稿查看类:主要是 D-box(网易自研)、figma、蓝湖等可以让前端工程师在线查看设计师的设计稿并提供一定的转化代码方案,主要是为了保障产品的还原度。

图片

设计稿代码生成类:最近两年为了彻底的解决还原度的问题,让前端工程师专注的解决代码问题「设计稿代码生成类」也开始在市场崭露头角。

比如:Imgcook、Codefun,直接复制设计稿地址进入软件内部转为代码文件,直接导出完整的静态页面代码,减少开发过程中的样式调整问题。

直接导出整页代码模式的小缺陷是无法满足开发中:代码精简(ai 智能生成的代码对目前还达不到开发人员喜欢的程度,较为冗余)、控件交互、绑定数据等几方面的需求,但是比如在一次性的静态页面的实现中还是能够达到提效的目的。

图片

结论:D2C模式的产品相对独立,从定义还原度「设计资产类」、保障还原度「设计稿查看类」、解决还原度「设计稿代码生成类」层层递进,可以有效提升设计师和前端工程师的生产效率和协同效率。

但在目前竞争激烈的大环境中,优秀团队的效率提升已经达到瓶颈,而提效的本质是为了比竞争对手更快更好,当所有人都有了相同的东西时,提效的目标可能就需要从别的地方打开缺口。

 

2、C2D(Code To Design)

C2D(Code To Design)「前端代码转设计稿」这个模式对于设计师相对模糊,不过国外的企业已经做出了探索。

比如:2017 年Airbnb 发布的前端开源模块 React Sketch.app,其核心理念是用代码做设计。第一次看到的时候感觉真的很酷,通过 React Sketch.app 直接在 Sketch 设计软件中编译出设计界面,代码也可以直接在项目中使用。

图片

还有另外一个产品叫 html-sketchapp,通过在输入框中输入网页地址就可以直接在 Sketch 中生成可编辑的设计界面「网页转设计文件」,通过任何前端代码都可以转为设计资产的文件,甚至直白一些说就是参考成熟产品做设计,适度借鉴吧。

图片

结论:目前的 C2D 的市场方案对于设计师而言不够友好,无法让设计师可以直接使用,都需要工程师来完成转换,同样也会遏制设计创新,陷入同质化的泥潭中。

但这个模式,却非常适合“有意”借鉴参考成熟或者竞争对手的项目团队,可以快速达到同类型产品的基准水平。

 

 

二、针对目前现状,什么样的方式可以实现提效?

从我们当前的工作流程来看

图片

在这个流程中设计最在乎的就是设计阶段的表现需求和前端的设计还原,为了保障精准的表现需求,在设计阶段需要大量的沟通和风格尝试。

在前端还原阶段需要和前端不断的扣细节,输出几百条信息的走查文档,那应该如何解决这些问题?

图片

答案就是「 C2D2C」的模式

 

1、C2D2C(Code To Design To Code)

C2D2C(Design to code to design)的模式,将流程中的设计表现和前端还原阶段的通过设计标准化和研发工业化的方式进行流程优化,减少设计和前端开发的参与,实现中后台研发流程的整体提效。

图片

在十几年的发展里互联网行业积累了大量的设计资产。

这些设计资产的沉淀是设计标准化的基础,将设计资产转为封装好的代码组件也就是 D2C 的过程。将封装好的组件通过低代码平台进行属性配置、搭建页面、布局调整实现页面的设计就是 C2D 的过程。

通过平台设定交互行为和绑定后台数据,完成整个系统,最后在进行站点发布,就实现了 C2D2C 的完整流程。

图片

C2D2C 的模式是设计资产与线上智能化布局的代码方案(低代码平台)以及后台数据绑定的结合,将以前的人工分工通过智能化方案综合一体去解决。

但这个过程不是僵化死板的模式,在C2D环节实现“设计->前端”的高还原度下快速落地,在D2C环节下实现“低代码平台->自有产品”的灵活调整下快速复制。

结论:随着社会的发展,标准化和智能化的产品线都将会被人工智能取代,互联网行业也正在向这个方向发展,所以设计的标准化和开发的工业化就像手工业向工业化的转型,这是一个大的趋势,未来可能一天的时间就可以生产数套后台产品,这样的生产效率才能跟上中国的数字化转型浪潮。

 

2.、C2D2C 的市场化

低代码平台 是 C2D2C 模式得以实现的核心平台,从2018 年开始海外投资开始关注低代码平台,OutSystem 平台获得 KKR 和高盛的 3.6 亿美元的融资,成为了低代码赛道的独角兽,另一家低代码创业公司 Mendix 被西门子以 7 亿美元的价格收购,资本市场的关注让低代码赛道开始火热起。

而国内的低代码平台是从 2020 年疫情肆掠开始,疫情助推了在线办公的发展,国家也在大力支持数字化经济,更多的企业开始数字化转型,这也让低代码在国内有了飞速发展的土壤。

目前海外比较成熟的平台主要是 OutSystem和 Mendix,而国内也有很多已经商业化的低代码产品,像网易轻舟等,已经开始投入商业化的使用,可以从网易轻舟的低代码产品架构,清晰完整的看到C2D2C模式的所需要具备的能力。

图片

网易轻舟从业务角度出发,具备持续迭代能力、组件具备可扩展性,并且可以为企业进行私有化部署,部署完成后可以和存量系统进行集成,交付后具备非常好的可运维性,是一个成熟的商业化平台。

网易轻舟目前已经服务了包括工商银行、吉利汽车、申万宏源证券、泰康人寿、台州银行等包括政府产业平台30家,从服务的客户我们也可以看的出来,低代码产品在大型企业中落地更有优势。

结论:C2D2C 的模式已经得到市场的验证,研发工业化可以更加高效的提升中后台产品的研发效率,设计标准化也可以减少中后台设计师大量的重复性劳动,对于中后台的业务产品,可以大胆地选择一个富有实力低代码产品。

 

 

最后

低代码平台的使用需要同时具备一定的代码能力和设计能力,这不管是对开发还是设计师都具备一定的门槛。目前的低代码平台使用角色应该是前端工程师,复杂的后台交互平台还是需要设计师的深度介入。

低代码平台的诞生减少了中后台设计师大量的重复性工作,可以让中后台设计师将更多的精力投入到用户研究和提升用户体验上。拖拽式的 UI 和智能化的布局以及良好的用户体验和以前的开发相比较,在中后台的开发上更加的高效也更加的智能。

在最初调研到低代码平台的时候,行业的快速发展和成熟,让我下意识的反应是中后台的设计师可能要失业了,但是在调研了平台的使用和深入的思考后,我觉得这是中后台设计师的机会。C2D2C 模式的最优解应该是 0 代码方案,而使用 0 代码平台最好的角色就是设计师。设计师专业的审美和对于用户体验理解的深度都是其他职业所不具备的,未来的中后台设计师更应该将自己的精力投入到平台流程的优化和用户体验的研究中去,这也在未来 0 代码平台到来后,我们才能更快更好的投入到新的生产中。

 

原文地址: 网易UEDC(公众号)

作者:程鑫

图片

转载请注明:学UI网 » 中后台产品的产研协同提效调研

登录收藏
 
你可能喜欢的:
如何通过设计语言手册来传递品牌理念!如何通过设计语言手册来传递品牌理念!
B端测试题的整体思路丨真题演示B端测试题的整体思路丨真题演示
客户关系管理(CRM)产品解析客户关系管理(CRM)产品解析
只要一个公式,带你看懂协同办公提效只要一个公式,带你看懂协同办公提效
如何解析产品原型如何解析产品原型
3个案例,正确理解B端产品中的一致性原则3个案例,正确理解B端产品中的一致性原则
桌面端与移动端的设计差异,对B端设计又有何影响桌面端与移动端的设计差异,对B端设计又有何影响
“你有多爱我?”为什么不是个好问题?“你有多爱我?”为什么不是个好问题?
上手即用的B端图表资源~上手即用的B端图表资源~
设计基础(9):拆解B端产品,总结界面框架设计的3原则设计基础(9):拆解B端产品,总结界面框架设计的3原则