第十一周软件开发创新作业

前言
在产品设计流程中，原型设计是从想法走向可验证方案的关键一步。目前主流原型设计工具包括Axure、RP、墨刀、Figma等各有优劣。
本文将以我参与的校园软件创新项目智绘社团（是一个帮助校园社团一键生成海报、推文、短视频的AIGC平台）为例，重点介绍Axure这一原型设计工具。

一 三大主流原型设计工具对比

工具	学习成本	核心特点	适用场景	在智绘社团中的用途
Axure RP	较高	复杂交互、条件逻辑、变量、动态面板	高保真逻辑演示、后台系统	主工具：模拟AIGC生成的条件判断、加载、失败重试
墨刀	极低	中文界面、拖拽式操作、手机扫码预览	快速验证、移动端原型	早期快速做可点击Demo给社团同学测试
Figma	中等	设计+原型一体、实时协作、插件生态	UI设计驱动、团队协作	最终高保真视觉设计，与开发交接

二 重点介绍 Axure

2.1 Axure是什么

Axure 是一款专业的原型设计工具 支持交互式 高保真度的原型制作 核心优势包括 动态面板 一个组件可包含多个状态 自由切换 条件逻辑 支持 if else 判断 变量 存储用户操作状态 丰富的交互事件 单击 双击 载入 拖拽等。

2.2 用智绘社团实战 模拟AIGC海报生成完整流程

业务需求

用户使用智绘社团生成一张AI海报 需要经历以下步骤

第一步 上传社团LOGO

第二步 选择海报风格 科技感 国潮 校园清新

第三步 点击一键生成按钮

第四步 系统显示加载中 模拟AIGC生成耗时

第五步 生成成功 展示海报预览 加下载按钮

第六步 生成失败 模拟百分之十概率 提示生成失败 是否重试 用户点击重试 重新生成

Axure实现步骤

Step1 搭建页面元件

元件类型	命名	作用
矩形	上传区域	点击后“上传”LOGO
单选按钮组	风格选择	科技感/国潮/校园清新
按钮	一键生成	触发生成流程
动态面板	结果面板	包含3个状态：加载态、成功态、失败态
按钮	下载	成功态时才启用

Step2 设置上传功能

选中上传区域 → 交互面板 → 添加【鼠标单击】事件 → 动作：设置变量 uploaded = 1 → 同时将区域文字改为“已上传”。

Step3 设置一键生成按钮的条件判断

在生成按钮上添加【鼠标单击】事件 → 添加条件：

如果 变量uploaded == 1 且 任意一个风格被选中
满足条件才继续执行，否则给出提示“请先上传LOGO并选择风格”。

Step4 模拟AIGC生成过程

满足条件后的动作顺序：

1.设置动态面板为“加载态”（显示加载动画）

2.添加等待动作：2000毫秒

3.生成随机数 [[Math.random()]] 模拟成功/失败

若随机数 > 0.9 → 设置为“失败态”（显示“生成失败，点击重试”）

否则 → 设置为“成功态”（显示海报图片，启用下载按钮）

Step5 实现重试逻辑

在失败态中放置一个“点击重试”按钮 → 添加交互：重新执行Step 4的整个流程（重新加载 → 再次随机判断）。

2.3 为什么选择Axure做这件事

墨刀无法实现条件判断和随机失败模拟 Figma的原型功能相对较弱 变量和条件逻辑需要依赖插件 而Axure原生支持上述所有逻辑 演示时可以真实点击操作 给指导老师或投资人留下的专业度远超静态图片。

使用Axure后 我们在内部测试中提前发现了三处逻辑问题 例如未上传时也能点生成 在写代码前就完成了修正。

三 辅助介绍 墨刀和Figma

3.1 墨刀 快速验证用户流程

墨刀的特点就是完全中文界面 拖拽式操作 内置大量移动端组件 生成二维码后手机扫码即可预览和点击 学习成本几乎为零。

在我们的项目中的用法：
项目启动第一周 我们用墨刀三天搭建了第一个可点击原型 将首页 海报生成页 推文生成页 短视频生成页用连线串起来 每个按钮只做页面跳转 不模拟真实业务逻辑 然后生成二维码 让五位社团同学在手机上体验。

收获的反馈 三位同学表示风格选择的交互不够直观 我们当场修改原型 第二天再次测试。

墨刀适合 0→1 快速验证页面流程和用户习惯，不适合复杂逻辑模拟

3.2 Figma 高保真设计与开发交付

Figma的特点 设计和原型一体化 支持多人实时协作 可以同时编辑同一个文件 拥有强大的插件生态和设计系统支持 开发人员可以直接查看标注并导出切图。

在我们的项目中的用法：

当Axure原型逻辑确认后 设计师在Figma中完成 精确的UI设计 包括颜色 字体 间距 图标 创建设计系统 包括主色 辅助色 按钮样式 文字规范 制作简单的交互原型 主要是页面跳转 最后分享给开发人员 让他们直接取用标注和切图。

Figma适合设计定稿和多角色协作 但复杂业务逻辑模拟不如Axure。

四 选型建议 你该用哪个

具体情况	推荐工具	理由
产品小白 快速验证想法	墨刀	半小时上手 手机演示方便
需要模拟复杂业务逻辑 例如审批流 支付 AIGC生成等	Axure RP	条件判断 变量 动态面板是刚需
团队有专业设计师 重视视觉和开发交接	Figma	设计和演示一体化 开发体验好
创业项目需要走完整流程	三者结合	墨刀用于初期验证 Axure用于逻辑演示 Figma用于视觉与开发交付

五 总结

原型设计工具没有绝对的好坏，关键是根据项目阶段和需求选择合适的工具。不同工具各有侧重，墨刀上手快，适合快速验证想法和页面流程；Axure RP功能强大，适合需要模拟复杂业务逻辑的深度项目；Figma擅长高保真设计与团队协作，是设计定稿和开发交付的利器。
希望这篇以实际项目为案例的文章，能够帮助你在自己的产品设计工作中做出合适的工具选择。