【A05】MasterGo插件设计开发: HTML to Mastergo 【尽微致广】
发布时间: 2022-11-24 15:22:56

本届A类赛题可通过以下方式提问与交流:

1、大赛官网团队账号-赛题答疑区提问,组委会定期收集问题提交至企业解答后公布;

2、可前往赛题答疑论坛(PC端点击链接):https://mastergo.com/file/77782156635006?utm_source=fwwb&utm_medium=saitishouce&utm_campaign=&utm_term=&utm_content=提问或交流,企业定期回复。



1.命题方向

企业服务

2.题目类别

应用类

3.题目名称

MasterGo插件设计开发: HTML to Mastergo

4.背景说明

【整体背景】

在互联网产品的生产流程中,设计师的角色发生了很大转变,设计环节变得越来越重要,设计方式也在不断进化。设计工程化是当前结构化设计走向系统化、规模化的重要里程碑。

我们期望通过一系列工具和方法论,将设计交付中一些复杂重复的事项交给计算机来实现,以达到降本增效的目的。

【公司背景】

尽微致广作为PLG模式在中国最早的践行者之一,致力于提升产品设计研发团队的整体效率及交付质量,从互联网行业的从业者、工具、资源、工作方式等不同角度出发,为各个体量的团队提供整体产品解决方案。旗下产品设计协作平台蓝湖,目前拥有 600 万用户, 50 万注册团队,在互联网头部公司渗透率超过 98%。

MasterGo 是尽微至广在 2021年推出的新产品,之后迅速成为国产设计软件的领导品牌,致力于持续推进多元化布局,基于更全面的流程和场景,建立底层标准、提升生产效率、重构生产关系,为用户及客户网络提供更完善的产品服务价值。

【业务背景】

现代化的互联网产品设计中,规范的重要性是非常重要的,它保证了大家的设计满足同一个设计理念、设计原则;使用了同一个设计数据源,比如各个大厂推出的设计规范,例如 Google 的 Material Design、蚂蚁的 Ant Design 等等。

5.项目说明

【问题说明】

针对如何高效的维护这个设计数据源这一问题,当前大家普遍的解决方案是采用Code To Design,即通过维护唯一的设计系统代码仓库的方式来维护统一的设计数据源,即 A single source of truth 。然后通过将设计组件库转化成代码的方式交给设计师维护设计稿。

【用户期望】

将组件库导入到 MasterGo,目标要求如下:

1)将 HTML 文件导入到 MasterGo,还原度达 95%;

2)能还原其图层信息和样式信息(设计意图),此为方案重点;

3)可以提供机制将常用组件库导入到 MasterGo,此项为加分项。

6.任务要求

【开发说明】

通过 MasterGo 插件的形式,可以将 HTML 文件或设计组件库通过任意形式导入,并通过 MasterGo API 将解析出的元素还原成 MasterGo 文件。

【技术要求与指标】
方案希望轻量简单,以设计意图的还原度与设计细节的还原度为最终指标。

【提交材料】

(1) 项目概要介绍;

(2) 项目简介 PPT;

(3) 项目详细方案;

(4) 项目演示视频;

(5) 企业要求提交的材料:

①项目详细方案,包括技术方案思路、方案DEMO;

②项目演示视频需包含演示结果

(6) 团队自愿提交的其他补充材料。

【任务清单】

1)插件 UI 侧;

2)插件核心功能:

①HTML 解析模块,并将解析后的信息转化成 MasterGo 文件:

A.可以还原 HTML 表面信息至设计稿;

B.可以还原 HTML 的样式信息至设计稿 ;

C.可以还原 HTML 的图层信息至设计稿。

②设计组件库导入至 MasterGo:

A.可以还原组件信息至设计稿;

B.可以还原组件变体信息至设计稿。

7.其他

8.参考信息

开发工具建议:vscode

相关参考信息:

https://code.visualstudio.com/

https://developers.mastergo.com/

9.评分要点

赛题评分要点见附件A 类企业命题初赛统一评分标准。



订阅号