把设计稿变成能点的原型，再把原型交给开发，这条链路通常要在好几个工具之间来回搬。Marvel 把它收进浏览器里，线框、原型、交付、测试与评论各占一个入口，数据只有一份。

从浏览器打开的工作台

Marvel 是运行在浏览器里的在线设计平台。官方把它概括为「为现代设计团队提供快速原型、测试与交付」，并说明线框、设计与原型可以在同一处完成，从低保真到高保真都覆盖。它在二零一三年以副项目起步，官方称如今已有超过两百万个人与团队在使用。

打开项目之后，界面分成两个层次。左侧是工具条与画布，画布上摆的是一张张屏幕；右侧是属性面板，负责位置、尺寸、圆角、填充与透明度这些参数。焦点在哪一层，参数面板就跟到哪里。

线框、设计、原型放在一处

设计能力是内置的。添加屏幕时选择在内置编辑器里画，不必再另开一个画图软件；线框图与界面稿都能画，页面切换器用来在多个设计之间跳转。画好的设计会自动带上交付所需的代码、标注与素材。

原型靠热点搭建。热点是画在屏幕上方的一块可点区域，拖出范围再指定目标屏幕，它就变成一次点击跳转。官方给出的路径是先悬停第一屏、进入原型模式，再拖出热区并选择目标，播放之后就能看到跳转效果。整个过程无需写代码，官方说从静态稿到可交互原型的成品，制作时间以分钟计。

把设计交给开发

交付环节由 Handoff 承担。官方描述它会自动把设计与原型转成开发规格，包含代码和素材，并且紧挨着可交互原型呈现；项目本身就被当作规格文档，省掉了标注与反复导出的离线文档。生成的内容里既有 CSS，也有 iOS 与 Android 侧需要的样式描述，可以连同素材一起打包取用。

另一条路径是分享。原型可以生成链接直接发出去，也可以只分享其中一段流程：把某个分区单独复制成链接，对方打开后看到的就只有这一段，官方说这能让干系人和开发只关注需要确认的部分。

用户测试与协作

用户测试的流程是选一个原型，平台生成一条专属链接，把链接发给参与者，对方在电脑或手机上打开即可开始；测试过程会记录屏幕画面、声音与前置摄像头。同时进行的测试数量按方案区分，个人方案可以同时开三个，团队方案十个，企业方案另议。

协作围绕评论展开。评论分为公开与私有两种，私有评论只有团队成员可见，适合与外部客户或外包方并行沟通时使用。参与者按角色加入项目：团队成员能看账号下的全部项目，贡献者只能看到被专门邀请的那些。评论会落在具体的画面位置上，改动之后依然贴着原来那处。

方案与价格

免费方案不限时长，给到一个用户和一个项目；官方在常见问题里写明免费方案没有倒计时，可以先一直用到决定升级为止。个人方案按年付折算为每月十二美元，包含数量不限的项目、三个并行的用户测试名额，可以把原型与设计稿导出，并去掉页面上的 Marvel 标识。团队方案年付每月四十二美元，从三个人起步，测试名额增加到十个，另附优先支持。

企业方案按需报价，用户数、项目数与测试次数都没有上限，支持仅受邀可见的项目、更细的安全设置与单点登录，也可以走发票或对公转账。学生与教师购买年付方案有七折，注册非营利组织是五折。

适合谁用

一个人的产品设计师，可以用它把线框和原型做完，再输出一份交付说明；两三个人的小团队，可以用团队方案把评论、测试与项目权限集中到一处；需要跨公司推进的项目，私有评论和仅受邀可见的项目能把外部协作与内部讨论分开。习惯在手机上确认效果的人，也可以通过移动端应用打开原型预览。

设计工具怎么选，多半取决于要不要少换一次工具。当线框、原型、测试与交付共用同一份设计，被省下的除了导入导出，还有每次改动之后重新对齐的那段时间。