墨刀

墨刀

一句话定位

在线产品原型设计工具，国内对标Axure和Figma原型功能的产品。核心场景是快速画App和网页的线框图、交互原型，不需要写代码就能做出可点击的演示版本。2024年起加入了AI辅助生成原型的功能，输入需求描述可以自动产出基础页面结构。适合产品经理和交互设计师在需求沟通阶段快速产出可视化方案。

核心能力

快速原型绘制
内置丰富的手机和电脑端组件库，包括按钮、输入框、导航栏、列表、弹窗等常用UI控件。拖拽组件到画布上，调整位置、大小和颜色，就能搭出一个App页面的结构。组件支持母版功能，修改母版后所有引用自动更新。操作学习曲线比Axure低，第一次用的人大概30分钟能掌握基本操作，做出一个简单页面。但对于高保真视觉设计，墨刀的能力不如Pixso和Sketch。

交互链接和动效
在画板之间拖拽连线创建交互关系，支持点击、滑动、长按等触发方式，目标可以是跳转页面、弹出浮层、切换状态等。内置一批常用过渡动效，包括淡入淡出、左右滑动、底部弹出等。交互效果可以在手机端扫码预览，对方不需要装墨刀也能在浏览器里点。但微交互（如按钮按下的回弹效果、下拉刷新动画）目前不支持。

AI生成原型
2024年新增的AI功能，在画布上输入页面需求，AI可以自动生成一组基础页面结构。比如输入”一个外卖App的首页，顶部搜索栏，分类图标区，推荐商家列表，底部四个Tab导航”，AI会生成对应的线框图。生成速度约10到20秒，产出的组件位置、间距基本合理，但文字是占位符、颜色是默认灰色。实测中，简单页面的AI生成可用度约六到七成，复杂交互或多层嵌套页面的可用度下降到四成左右。

团队协作和版本管理
支持多人同时编辑同一个原型文件，各自的修改实时同步。有版本历史功能，可以回退到之前的版本。评论功能支持在具体页面上留标注，开发拿到原型后可以直接在对应UI元素下提问。团队协作的权限分为可编辑、可评论、可查看三级，满足不同的协作场景。

标注和交付
原型完成后可以生成标注页面，开发人员点开链接能看到每个元素的位置、大小、颜色代码、字号等信息。支持导出为HTML离线包，在没有网络的环境下也能演示。

适合谁用

产品经理
日常工作就是写需求、画原型、和开发沟通。墨刀对产品经理来说够用，不需要学Sketch或Figma那套设计工具，专门的原型工具效率反而更高。做评审的时候，一个可点击的交互原型比几十页的文字PRD直观得多。

交互设计师和用户体验设计师
主要关注页面交互逻辑而非视觉细节的设计师，墨刀的交互引擎基本能覆盖常用的交互模式。画出来的原型可以直接给视觉设计师做参考，作为高保真设计的上游输入。

创业者和小团队
没有专业设计师但要给投资人、客户或外包团队展示想法。墨刀的模板和组件库可以让非设计背景的人在半天内做出一个能跑的原型。

不适合的场景

需要高保真视觉设计。墨刀的视觉编辑能力有限，颜色、阴影、渐变等效果的可定制性不高。如果是给客户看的设计稿，建议用Pixso或Sketch。
复杂交互逻辑。墨刀的交互引擎适合线性的”点击-跳转”模式，条件判断、变量控制、数据联动等高级交互不支持。
需要大规模设计系统管理的大型设计团队。墨刀的组件管理和设计Token能力不如Pixso和Figma成熟。
只需要画流程图和思维导图。墨刀的强项是带交互的页面原型，流程图不如ProcessOn或boardmix方便。

上手门槛

无需魔法。注册即用。免费版支持基础功能但项目数和协作者数有限制。网页端为主，不需要安装。支持手机端扫码预览原型。

真实优缺点

优点

上手快。从注册到做出第一个可交互的原型，一套操作下来大概30到45分钟。不需要学设计基础、不需要懂代码，拖拽加连线就行。这个门槛对非设计师来说比较友好。

交互预览方便。生成一个二维码或者分享一个链接，对方在手机上就能直接体验你的原型。点按钮有跳转、有动效，接近于真实App的操作感受。早期创业团队用墨刀做BP里的产品演示，比截图PPT效果好很多。

中文生态和客服支持到位。组件库、模板、教程都是中文的，遇到问题找客服响应也快。相比Axure那种需要自己去论坛扒英文资源的学习体验，省不少时间。

母版和组件复用让迭代效率提升明显。一个产品有几十个页面，导航栏、底部Tab、通用弹窗这些重复元素用母版管理，改一次全部生效。对于需要频繁迭代的产品来说，这个能力是核心效率点。

AI生成原型减少从零开始的心理阻力。画原型最难的往往是面对空白画布不知道怎么起步。AI先给你搭个框架，你在上面改，比从零开始快。尤其是不熟悉原型工具的新人，AI生成的效果作为脚手架是够用的。

缺点

视觉设计能力比较弱。做出来的原型是线框图风格，不是设计稿。颜色、字体、阴影的调整选项有限，对视觉有要求的场景需要另外用设计工具做。

复杂交互场景不支持。条件判断、变量绑定、数据驱动这些高级交互功能要么没有、要么实现得比较初级。如果你做的产品有比较复杂的交互逻辑（比如电商的购物车累积计算、多步骤表单的状态流转），墨刀处理不了。

大项目打开和切换页面时偶有卡顿。一个超过50个画板的原型文件，页面切换时会有1到2秒的停顿，操作流畅度不如本地安装的Axure。

AI生成的质量不太稳定。同一个需求描述，不同时间生成的结果差异可能很大。而且AI对中文口语化需求的理解有时候会跑偏，生成的页面布局和你脑子里想的对不上。需要有一定的调整经验才能把AI生成的结果变成有用的素材。

免费版限制比较明显。项目数、协作者数、导出功能都有限制。如果是日常高频使用的产品经理，大概率需要付费。

使用教程：从零开始，30分钟做出第一个可交互的原型

第一步：注册和了解界面

浏览器打开 modao.cc，手机号注册或微信登录。进入工作台后，点”新建项目”，给项目起个名字，选一个设备类型（iPhone 15 Pro 或 Desktop 1440）。项目创建后进入编辑界面。

编辑界面分几个区域：左侧是组件库和页面列表，中间是主画布，右侧是属性面板，顶部是工具栏。

第二步：了解组件库

左侧组件库里分为几类：基础组件（矩形、文本、图片）、表单组件（输入框、单选、多选、开关）、导航组件（导航栏、Tab栏、分段选择器）、展示组件（列表、卡片、弹窗）。找到你需要的组件，拖到画布上即可。

第一次用建议从模仿开始。打开一个你常用的App，对照着它的首页，在墨刀里用组件搭出一样的结构。这个练习大概30分钟，做完你就基本熟悉了所有常用组件的位置和属性。

第三步：制作第一个页面

假设做一个外卖App的首页。操作步骤：

从组件库里拖一个矩形到画布顶部作为搜索框区域，调整高度为44像素，填充浅灰色。
拖一个文本组件放在搜索框里，输入”搜索商家或菜品”，颜色改成浅灰色。
拖一组图标和文本，排列成分类入口（美食、超市、水果、医药等），用墨刀的”等距排列”功能让间距一致。
拖一个列表组件作为推荐商家区域，列表项包含图片占位符、商家名称、评分星标、配送时间。

全部做完后，右键这个页面在左侧页面列表里重命名为”首页”。

第四步：制作第二个页面并创建交互

在左侧页面栏点”＋”新建页面，重命名为”商家详情”。用组件搭一个商家详情页的布局：顶部商家头图、商家名称和评分、菜品分类Tab、菜品列表。

现在回到首页，选中某个商家列表项，拖动右侧出现的小圆点到”商家详情”页面，在弹出的交互设置中选择”点击→跳转→商家详情”。设置好过渡动效为”从右滑入”。

第五步：预览和分享

点顶部工具栏的预览图标（播放按钮或手机图标），会在浏览器新标签页中打开一个可交互的原型预览。在首页点击你设置了交互的那个列表项，看是否跳转到商家详情页，动画是否顺畅。

点分享按钮生成预览链接或二维码。把链接发给同事或开发，对方在手机浏览器里打开，点首页的列表项同样能看到跳转效果。不需要装墨刀也能预览。

到这一步，你已经完成了一个包含交互的原型基础流程。

教程：三个高频使用场景的详细操作

场景一：需求评审会的快速原型演示

适用于产品经理在需求评审时向开发、测试、设计同步需求。

操作步骤：

1. 在墨刀中新建项目，导入或者新画需要的页面。如果是已有项目的功能迭代，复制现有页面做修改比从零画快得多。

2. 梳理交互流程：用户从哪里进入、点哪些按钮、走到哪些页面、有哪些分支情况。把这个流程画一个简单的线稿，确保交互路径是完整的。

3. 在墨刀里搭建这些页面并创建交互链接。对于状态页面（加载中、空数据、错误提示、成功反馈），每个都做一个画板，不要用文字描述代替。

4. 把所有页面和交互做完后，创建一个”走查清单”页面，列出这次需求的核心功能点和验收标准。这页放在原型的最开始，评审时先过清单。

5. 评审时直接用预览模式演示：我打开App，看到这个首页，点击这个商品，进入到详情页，然后加入购物车，再到订单确认页。有交互的原型比静态截图说服力强很多，特别是对开发来说，一个有跳转效果的原型能避免很多理解偏差。

6. 评审过程中的改动直接在墨刀里改。评审结束后更新原型文件，再发一次链接给所有人，确保每个人看到的都是最新版。

实际效果：用交互原型做需求评审，后续开发过程中因”需求理解不一致”导致的返工大概能减少三成到四成。成本是产品经理多花一到两个小时画原型。

场景二：用AI快速生成多方案对比

适用于在需求早期需要快速探索多种设计方向的场景。

操作步骤：

1. 在墨刀中新建空白项目，点击AI功能入口。

2. 输入同一需求但用不同表述，生成多个版本：

提示1：生成一个电商App的首页，顶部搜索栏，中间横幅广告，下方商品推荐网格，底部四个Tab：首页、分类、购物车、我的。

提示2：生成一个电商App的首页，一级导航用底部五个Tab，中间是瀑布流商品列表，顶部有轮播广告，搜索栏固定在顶部。

3. AI会在十几秒内分别生成两套不同风格的页面结构。把它们放在同一个项目里方便对比。

4. 把生成的初稿截图或直接分享链接给团队，让大家在评论里投票和提建议。这个过程不用等到UI设计出图，产品经理自己几分钟就能搞定几个方向的初稿。

5. 确定方向后，在AI生成的基础上做细节调整：替换占位符文字、调整间距和颜色、补充漏掉的交互状态。

注意事项：AI生成的页面有较高的随机性，同一个提示两次生成的结果可能不同。如果第一次生成的不理想，可以微调提示词再试，比如加上”参考淘宝首页布局””简洁风格，白色背景”这类描述。

场景三：创业项目投资演示

适用于创业者制作产品演示原型给投资人看。

操作步骤：

1. 做给投资人看的原型和做给开发看的原型不一样。投资人不关心技术细节，关心的是”用户怎么用””核心体验是什么”。所以只需要做3到5个最核心的页面，把最亮点的交互做出来。

2. 选模板或AI生成基础页面作为起点，然后在上面精修。视觉上要比日常原型更讲究一点：用接近真实品牌色的配色、替换真实的产品图、文字不要用占位符而用和真实场景接近的内容。

3. 交互上做足：核心流程的每一步跳转都做好，动效选择不要太花哨，用”从右滑入”这种最自然的过渡效果。关键操作（如下单、支付成功）要给出明确的反馈页面。

4. 在关键页面上加注释：用墨刀的备注功能标出”这里是AI算法匹配””同步比传统方式快三倍”等卖点。投资人看原型的时候，注释能帮你把核心价值讲清楚。

5. 在手机端预览，确保屏幕适配没问题。投资演示最好让投资人在他自己的手机上操作，体验最直观。

6. 如果要做脱机演示（防止现场没网），墨刀支持导出为HTML离线包。导出后在电脑或手机上可以直接打开，不需要网络。

使用中常见的问题和应对方法

问题一：原型画得太详细，花了太多时间

常见于新上手的产品经理，想把原型画得跟成品App一样。

应对：区分”线框图”和”高保真设计”。原型的目标是”把交互逻辑讲清楚”，不是”把视觉效果做出来”。流程跑通、状态覆盖完整，比页面好看重要得多。一个页面控制在5到10分钟内完成，超了就说明你做多了。

问题二：AI生成的页面和预期差距很大

原因是AI对需求描述的理解有限。

应对：写提示词的时候具体一点，类似”一个仿微信的聊天列表页，每条包含头像、昵称、最后一条消息摘要、时间，上面有搜索栏”。越具体越好。如果第一版不满意，调整提示词再试，而不是在AI生成的结果上大幅修改。

问题三：交互链接太多，后期维护混乱

项目做大了之后，页面之间的交互线密密麻麻，改一个页面不知道会影响哪些跳转。

应对：用母版管理公共导航元素。导航栏、底部Tab这类几乎所有页面都有的组件做成母版，跳转交互也做在母版里。这样改一次导航全部页面同步更新。另外，页面命名要有规范：功能缩写+页面名称，比如”订单_列表””订单_详情””订单_退款”。

问题四：分享链接后对方说打不开

可能是权限设置问题。

应对：检查分享链接的权限设置，确保是”知道链接的人可查看”。另外，墨刀对移动端浏览器的兼容性基本覆盖主流浏览器（微信内置浏览器、Safari、Chrome），但如果对方用的是比较冷门的浏览器可能会出问题。

访问方式和价格

官网：modao.cc。网页端为主，不需要安装。支持手机扫码预览原型。

价格（截至2026年6月）

免费版：支持2个项目、每个项目最多20个页面、协作者上限3人、基础组件库可用。AI生成次数有限。适合体验和偶尔使用。

个人专业版：约149元/年。无限项目、无限页面、高级组件和动效、导出HTML离线包、每月AI生成额度提升。适合日常使用的产品经理。

团队版：约299元/人/年（最低5人起购）。团队协作、版本管理、权限控制、企业组件库。适合产品设计团队。

企业版：按需求定价，需联系销售。私有化部署、API接入、数据安全管控。

以上为官网标准价格，促销期间可能有折扣。

一句话总评

产品经理的日常原型工具，够用、上手快、交互直观，但视觉和复杂逻辑方面有明确的边界。

如果它不适合你，试试这个

需要同时做高保真视觉设计 → Pixso（pixso.cn），设计能力更强但学习成本也更高。
要做复杂交互逻辑和数据驱动原型 → Axure RP（axure.com），交互引擎最强但上手难度大、界面看起来比较老旧。
只需要画流程图和思维导图 → ProcessOn（processon.com）或 boardmix（boardmix.cn），免费版限制少。
习惯在Figma里做所有事情 → Figma（figma.com），原型功能是附属能力但和你其他设计工作在一个工具里。