2.0 Beta
基于量子设计理念，我们希望有一个集交互、视觉、动效、3D 于一体的设计平台，让设计师的工作流程不再需要不断地同步、更新、集成和保存来维护，设计师应该工作，将时间和精力投入在更好的用户体验和创意上。
终于在经历了3年的不断探索、尝试与测试后，我们成功地实现了全平台化的一站式设计，将整个设计流程打通，不管你是交互设计、视觉设计师还是动效、三维设计师，都能在同一平台上进行设计，所有文档实时共享，让每一位设计师都能看到设计的全局，及时同步信息。
不止于此，我们还创建了独有的协作管理方式，把工作变得「可视化」，让部门之间更加融合，目标更加清晰，运转更加高效。
我们选择 Figma 作为这个一站式的设计平台，它有三个与众不同的宝贵功能：实时协作、远程沟通和历史版本。可以让数十名设计人员同时处理一个文档。 这是一个基于浏览器的设计工具，每个设计的文档和版本都存在于服务器上，使设计迭代任务变得轻松无忧。
你在担心 Figma 的服务器会炸，这个可能性很小。如果仍然不放心，可以将文档另存为 .fig 使其可下载，定期备份到本地，以防万一。
实时协作
对于团队来说，这具有重大意义，能够与其他设计师、工程师或客户实时进行设计，将在执行和沟通方面节省大量时间。
你可以快速地创建你的设计文件，然后邀请其他人编辑或仅查看你正在进行的设计。基于浏览器的工具的优点是收到邀请的人无需安装任何软件，甚至都不需要拥有 Mac 电脑即可参与进来。Figma 适用于 Mac、Windows 和移动设备（仅供查看）。任何人都可以进入并查看所有参数：字体、颜色、大小、间距等。
这意味着你可以在 Mac 和 Windows、iOS 和 Android、家庭和办公室之间切换。满足不同的需求，随时随地打开设计稿，实现真正意义上的移动办公。
版本历史
版本历史的功能让版本控制更加直观，让你可以快速比较版本。
这是一个线上的平台，会实时保存你的文档，设计师不再需要养成 Ctrl S 的习惯，也不会因为没有保存而失去宝贵的创意。所有的内容都会保存在线上，无需担心你的文件会丢失。
所有在平台上的文档都不会占用电脑的内存，你可以毫不吝啬地将当前的文档添加到历史版本中，给这个版本命名，添加文字说明。系统也会定时为你保存历史版本。 所有保存的历史版本都是可以退回去编辑的，不管是手动保存还是自动保存，这些文件都是永久存在的，除非手动删除。这个功能的无敌之处在于你可以将任意一个历史版本拷贝出来，变成一个独立的设计稿。这是其他任何基于本地文件管理的设计软件做不到的。
评论系统
通过内置的评论系统，团队成员可以对你的设计发表意见，当有新评论或回复时，你会收到通知，完成后，你可以单击「解决」隐藏评论。
我们让客户也参与进来，他们可以实时看到我们的设计稿，及时进行评论和反馈，节省了大量的沟通成本。
安全性
你可能会顾虑线上平台的安全性，在这一点无需担心。借助 Figma 的组织工作区，可以强制执行登陆权限，例如强制公司单点登陆。
组织工作区中的所有内容都归组织所有，包括成员的草稿和任何团队文件，成员的账户将链接到公司的企业邮箱，任何个人都无法拥有组织中的文件。
没有企业邮箱的公司外部协作者仍然可以作为来宾访问特定项目，组织管理员可以查看和管理来宾在组织中访问的内容。
这样一个一站式的设计平台，所有的设计人员都在同一个平台工作沟通交流，包含所有的设计文件，我们是如何有效地进行多人协作，任务管理的呢？
搭载看板的任务管理
Figma 中所有的 Frame（你可以理解为画板，但它比画板更灵活）都是可以创建链接的，只要你点击这个链接就可以直接跳转该 Frame，实现工作区域的精准定位。也就是说，团队之间除了不需要互相传输文件，甚至都不需要询问负责这个任务的同事把设计稿放在了文档中的哪个位置了。这个好用的功能为我们的任务管理带来了灵感，将它与看板结合，让任务管理变得简单。
最初我们尝试使用 Todo List 的方式进行看板的搭建，对任务进行拆解，将它们细分到团队成员的手中，在每条任务上标注任务负责人、任务截止日期以及完成进度，并且创建超链接定位到任务工作位置，以 Todo、Doing、Review、Done 的分类方式对任务进行线性排列。
如此有条不紊的任务清单看板看起很合理，但又似乎有点平淡。如果仅仅是任务的堆叠，每一个任务都孤独地呆立在那里，仿佛在说他人的事与我无关，这不是我们想要的任务管理。我们想要的是共创，让每个人员都有参与感，知道自己现在所做的事能为这个项目带来什么，自己处在一整个项目流程中的哪个关键位置。
这是以目标为导向的工作方式，驱动团队朝着一致的方向前进，让任务管理变得简单易行，易实施。
QOKR 量子板
基于 OKR 的管理方式，我们创建了独有的量子板进行任务管理，把期望的关键结果绘制成清晰的蓝图，然后分解成可以逐步实施的计划。
开始项目时，项目负责人和参与成员共创目标和关键结果，根据这些关键结果把任务分配给团队成员，接收到任务的人需要判别这个任务是否需要他人协助，如果需要就把需要协助的内容分配出去，来拉动看板。团队中的每个成员都能给他人分配任务，成为量子板的搭建者，也是拉动者，作为下游需要主动去拉动看板，以目标为导向对最终的结果负责。如果遇到没有对接人的环节，就需要项目负责人去协调安排。我们还设置了「加急任务」卡片，遇到紧急情况告知大家优先处理。
任务与任务之间都是用线关联起来的，最终都会汇聚到团队目标上，呈现出达成目标的清晰路线。当量子板中任意一个环节出现问题，就需要为该任务打上「问题」标签，因为该任务导致其他任务无法推动的一整条任务线都会处于置灰状态，让处在该任务线上的其他成员能够及时了解情况，而不会因为消息的滞后还在该条线上继续工作。
量子板是 JCer 共同探讨创建的，不是市面上已有的一款应用，它存在于我们设计平台中。没错，我们做到了 all in one，哪怕是任务管理，并且比任务管理软件更好用，这是为我们的设计团队量身定制的，无需跨平台，对每一个任务的精准定位让任务管理更简单更高效。
搭建量子板的过程的确会花费一些时间，还好我们有聪明的框架师以组件化的管理方式搭建出了量子板的模版，所有的任务卡片状态，标签内容的切换，卡片间的连线都无比方便。同时我们也要求不超多一周工作时长的任务无需放上量子板，直接沟通解决即可，马上能解决小任务就无须在形式上花费时间，毕竟同事之间还是需要适当沟通增加感情的嘛。
复盘
量子板的存在并不仅仅是为了任务管理，还为了复盘。从过去中汲取力量，从而更好地应对现在与未来。
无论我们的蓝图绘制地多么清晰，都必须要经历现实的检验，而实际的工作往往比我们想象的复杂。任务卡片上的每一个逾期、「问题」标签，置灰的任务线，这些对过程的记录都是为了更好地复盘。
目录
我们为每一个项目文件都做了目录，每一条目录都添加了对应的 Frame 链接，让第一次查看设计文档的人都可以像阅读一本电子书一样点击目录就可以直接跳转到对应的区域。
更新文档
每天完成工作后写更新记录也是量子协作中的重要一环， 及时记录每个成员对文档的操作足迹，让文档中的每一步操作都有迹可循，有源可查。毕竟这是共享文档，我们需要清楚地知道每个参与者都做了什么，对整个设计结果负责。
更新记录中包含更新日期、更新内容所属的功能模块、更新内容、所做的操作、具体描述和负责人的企业邮箱。
当我们在同一个项目中与一大群设计师同时工作时，很难保持设计上的一致性。当一个项目是由多个功能模块组成时，更是如此。它们必须遵循一套特定的美学原则和明确指定行为和交互的指导方针。
在一个较大的设计项目中，每个功能模块都有不同的团队和设计师负责，如果没有设计规范对其进行制约，任由各个模块设计师自由发挥，风格各异，出来的结果可想而知。
传统的设计规范，团队的设计师会基于当下的设计产出静态文档，团队用它来解决设计产出物的一致性问题，并且希望通过它来提高设计产出的效率。但是实际上这种静态形式的规范并不能实质上解决一系列问题，随着产品的迭代，设计人员的变更，面对这种大量的变更和不确定性，静态的设计规范是难以面对的。
我们定义的设计规范是可生长的，为了应对未来的不确定性，它是会不断进化的。为此，我们打造了量子组件库，将设计规范和组件库合二为一，让设计规范不再是脱离设计本身的一份独立文档，规范中的所有内容都是与界面紧密相连的，也就是说只要你修改了规范，所有与之对应的内容都会同步修改。
这究竟是怎么做到呢？这要归功于我们的「小天才」框架师，将构成界面的元素拆解到量子级别，再重新叠加纠缠在一起，通过对构成界面的最小元素（填充、描边、圆角、字体大小、行高、间距等）进行管理，在开发思维下，实现对整个产品的有效控制。
颜色样式
搭建量子组件库，你需要做的第一件事是创建一套强大的色板，让你的基础色尽可能地精简，一般包含主题色、辅助色、中性色和系统色。当然，为了使用地灵活性，我们根据专业的色板生成算法对这些基础色拓展出具有梯度的衍生色。
这些颜色样式不仅仅是放在文档中被查看的，它们已经被框架师的巧手量化成了一个个可复用的参数，作为设计师，你甚至都不需要知道主题色的色值是多少就能轻松设计界面，当你需要一个颜色的时候直接在颜色库中调取这个参数即可，在未来的设计迭代中，不管这个颜色经历了多少次的更改，都不会给你带来任何修改工作，它们已经与量子组件库的色板关联在了一起。
文字样式
除了颜色，文字的排版在界面中也起着重要作用。框架师会在规范中确定好应用于所有界面情况的文字样式，包含不同层级的标题、正文文本、辅助文本，以及按钮中使用的文本和用于单位符号的微缩文本。字体大小、字重、字距和行高这些参数叠加成一个文字样式。
所有的文字样式在前期都是通过台驾测试的，根据人到屏幕的距离以及最佳阅读角度对字体大小进行定义，以保证最佳的用户体验和阅读效率。并且，为了保证排版的美观性，我们使用字阶计算公式使这些文字的梯度排列具备一定的美感和韵律感。
文字样式中并不包含颜色参数，这是框架师的聪明之处，尽可能地减少文字样式的数量，通过在文字样式和颜色样式的叠加，文字的使用场景变得更加广泛和灵活，同时也减少了框架师的管理成本。
框架师会在一整个量子组件库的搭建管理中使用这类「小聪明」。更加轻巧的样式让其拥有了更大的自由度。
图标库
一个好的设计需要一套和谐统一的图标。为了保证图标的一致性，我们建议让指定的设计师来绘制一整套图标，而不是各画各的。
那么问题来了，需要先绘制好一套图标再进行界面设计吗？毕竟没有图标界面设计的工作很难进行，难道要让设计师先自己绘制图标吗？当然不需要，我们有一套强大的自动填充系统，不但可以对文本内容进行填充，还能对图标、组件进行填充。
设计师在绘制界面时，先使用暂代图标，将该暂代图标的名称改为对应图标的 ID 号，当图标库绘制完成后，只需要一键填充，对所有的图标进行替换。
组件库
它们是设计中常用的组件，包含按钮、开关、单选框、复选框、输入框、下拉栏、键盘等等。这些组件都是由上述的样式参数和图标叠加而成的，小组件排列组合成大组件，通过组件间的嵌套关系实现了我们说的量子纠缠。
关于组件的命名和分类，我们对标了多家具有指导意义的设计系统，比如 iOS、Material Design，建立了一套成熟的命名分类系统。
传统的组件库，会将同一组件的不同衍生状态全部平铺出来，通过层级的命名进行分类，这会导致在调用时需要一层一层地去寻找需要的组件，像是按钮会分为一级按钮、二级按钮，每一级的按钮分为带图标和不带图标的，每一个按钮还分不同状态，如此多的层级分类对设计师在调取组件时产生了很大的阻碍，特别是刚参与项目的设计师，很难快速找到想要的组件。
为了使组件的调取更加方便直观，框架师使用变体的形式来创建组件，组件的所有衍生状态都会以属性的方式呈现，而不是以平级的形式出现，也就是说即使有很多种状态的按钮，在组件库中仅会出现一个按钮，你只需要调出这个按钮，切换状态排列组合，变成你想要的那个按钮即可。所有的组件都以这种方式创建，你会发现你的组件库会变得非常干净整洁，只有一个按钮，一个开关，一个滑动条，而不是无数个按钮无数个列表。
组件库的超距作用
框架师负责组件库的搭建和维护，将它共享给团队成员，所有设计师使用同一套设计元素搭建界面，当库中的字体、颜色、组件等发生变化时，所有与之关联的设计文档会瞬间更新，相较于传统的开发方式提升了很大的效率。
自适应布局
自适应布局已经成为不可或缺的功能，设计师需要处理越来越多的屏幕分辨率。在 Figma 中，我们让自适应布局变得更灵活更好用。
过自适应布局创建的按钮和卡片，可以随着文本的变化自动调整大小。不仅如此，你还可以快速地重新排列菜单和列表，任意隐藏显示里面的内容。通过对这些响应式组件的组合，可以让这些组件适用于多种设备。
可交互组件
曾经我们还在用 Sketch 创建组件库的时候，有客户问我们，你们组件库里有动效吗？我们回答这些组件目前只能是静态的，这也是我们强烈渴望的实现的功能。现在我们可以自信地告诉你，这些组件是可动的，它们是「活」的。
这得利于设计与原型工具处于同一个平台，每一个组件都可包含它的可交互状态，这些交互元素可以像静态组件一样被复用和共享。
原型制作
设计师无需寻找其他原型设计软件，以及无休止地同步文件，在 Figma 中直接制作原型，与设计紧密相关，无需再次导出屏幕。可交互组件也大大简化了原型的制作流程。
在设计中调整颜色或字体大小，可以实时观察原型反映的变化。TED 演讲模式让你可以像 TED 演讲专家一样在会议室中漫步，使用手机来遥控点击演示文稿。
ID 管理
在交互文档中，需要追溯每一个功能项的管理，详细描述交互流程、功能状态。针对不同交互媒介（触控屏幕、遥控屏、AR等）定义不同的交互方式（手势交互、遥控交互、点击交互等）。清晰标注文档的功能描述、文言、动态、音效等 ID，专项管理对应的数据库，一个团队仅需管理一份 ID 库即可，方便上下游的打通，避免低效沟通和机械性工作。
自动填充系统
给图标、文言赋予的 ID 号的不仅仅服务于交互文档的管理，我们把它和 Google 的在线文档关联起来，创造了解放设计师生产力的自动填充系统。
除了可以自动填充图标，让设计师在还没有绘制完图标的情况下进行界面设计，不用后续再去手动更换图标，还能将界面中的文言与在线文档关联起来，只要修改文档中的文言信息，界面中的文言也能得到同步修改，无需设计师在去反复修改文言。
这份文档甚至都不需要设计师来进行管理，不管是客户还是开发人员都可以直接去在线文档中编辑，缩短了文言修改的工作流程。
动画参数化
我们的动效团队根据多年的制作经验，整理并总结出了如《动效原则库》、《情感库》、《开发文档输出规范》等宝贵的文档，用于指导在具体项目中与既定的视觉方案完美结合。
根据不同应用场景测试出最佳的动效方案，如动效时长、运动曲线等，并且在基于虚拟引擎制作的无限接近量产的高保真原型中包含了大量的动画代码，这些动画参数和代码都会列入我们的动画数据库中以供复用。
动画的参数化是非常必要且符合未来设计趋势的。我们将所有说不清道不明的动画细节参数化、代码化，把关键帧起始和结束信息、位置、属性、持续时长、运动曲线、帧率等信息给到开发，减少不必要的感性沟通，实现 100% 的动画还原效果。
并且我们会针对不同类型的动效输出不同的开发文档和素材库，实现动画与开发参数间的无缝衔接，有助于开发工程师对动画的理解。
3D 量子库
作为一个一站式的设计平台，当然少不了 3D 的加持。
在 HMI 设计中特别是 Adas 的设计，我们需要很多的三维模型来辅助设计。按照以往的流程，设计师会找到建模师提出需求，要建一个什么样的模型，什么角度，什么大小。当拿到渲染好的效果图后，发现这个效果与想要的不符，于是又要去找建模师调整参数导出图片。这样的过程来来回回，耗费大量的沟通修改时间。
为了打通设计觉设计与建模师之间的桥梁，我们建立了 3D 量子库。
3D 量子库中包含了建模师提前建好的不同类型的车辆、样机、城市道路、房屋、人物等等在设计过程需要被使用到的三维模型。设计师可以直接把模型导入到 Figma 中，根据自己的需要调节环境亮度、材质的粗糙度、金属度、透视角度、透视远近，用于辅助界面设计。
另外像是已经设计好的语音形象，也可以通过这种方式导入到 3D 量子库中，让设计师可以更加灵活地使用，而不用将各个不同的角度、动作、表情以图片的形式导入导出。减少了设计师的工作量和沟通成本，让三维模型在界面设计中的使用变得更方便灵活。