案例-核心工作流实践

百闻不如一练,和MG一起创建一个B端后台界面吧!

以实际页面为例,我们将逐步演示从创建文件、绘制原型、调用资源,到设置交互、协同协作、文件管理的完整流程,帮助你快速上手!

20250423-171446.jpeg

一、创建文件

Axure 操作方式MasterGo 操作方式
新建文件至本地支持将文件新建至草稿箱或项目中,项目内文件对团队成员配置查看与编辑权限。

二、 绘制原型

1、画板定义

Axure 操作方式MasterGo 操作方式
一个页面对应一个画板一个页面中可创建多个容器,容器可当作画板使用,便于说明画板间的逻辑关系。
容器可作为画板使用,同时可作为基础形状工具设置样式,以及作为编组使用,容器内可嵌套容器并使用自动布局。

2、图层编组

Axure 操作方式MasterGo 操作方式
创建编组容器与组
容器支持通过画布拖拽或左侧图层树来移入移出子图层,比编组更加灵活。

3、图层布局

Axure 操作方式MasterGo 操作方式
1.对齐
2.整理
1.对齐分布与调整大小
可以实现图层不同的对齐方式。
2.智能排列
通过智能排列,可以:
调整多个图像之间的垂直或水平间距。
将选择的图像排列为均匀和非均匀网格。
将图像重新排列或排序。
3.自动布局
通过自动布局,可以:
按钮:通过调整文本内容来控制整个按钮的大小。
列表:通过添删内容、调整内容顺序来重新排列布局。
元素:通过复杂的调整设置来响应布局容器。

4、状态切换

Axure 操作方式MasterGo 操作方式
1.动态面板1.动态面板
通动态面板能够集合一个或多个元素,每个集合被称为一个“状态”,支持通过交互更改不同状态的可见性。
动态面板无需创建母版,动态面板和副本间自带关联关系,可实现“一处改,处处改”的特性,并支持取消关联。

4、表格设计

Axure 操作方式MasterGo 操作方式
1.表格
2.中继器
1.智能表格
智能表格可结合团队库组件,进行个性化定制。

5、需求注释

Axure 操作方式MasterGo 操作方式
1.文本+连接线
2.注释
1.连接线
在不同组件和页面之间创建连线,并添加文字说明,连接线自动跟随页面、图层移动。
2.卡片注释
注释支持显示或隐藏,在预览时,可与评论进行交替展示。

三、资源调用

1、交互控件

Axure 操作方式MasterGo 操作方式
资源栏拖拽使用资源栏拖拽使用
目前支持下拉选择开关按钮输入框动态面板树形控件表格图表等。

2、设计师组件库

Axure 操作方式MasterGo 操作方式
设计师使用Axure制作元件库订阅设计师组件库
产品经理可订阅设计师组件库,制作高保真原型,设计师更新组件库后,产品经理可一键同步更新。

3、大厂资源

Axure 操作方式MasterGo 操作方式
自行寻找内置Ant Design、TDesign for mobile、Arco Design Mobile Components等大厂资源库和样式,灵活配置组件属性。

四、交互预览

1、交互预览

Axure 操作方式MasterGo 操作方式
交互面板选择事件交互-触发和动作
添加交互:可直接拖拽交互连线,或在交互面板中添加交互。

2、动画效果

Axure 操作方式MasterGo 操作方式
固定过渡动画,如:“淡入”、“滑动”等。交互-动画和效果
目前有 “即时”、“溶解”、“滑入”、“滑出”、“移入”、“移出”、“推入”、“智能动画”等动画形式。
智能动画:智能动画可以根据两个关键帧之间位置、颜色、形状等因素的变化自动填充补间,形成一个渐变过程。

3、溢出滚动

Axure 操作方式MasterGo 操作方式
仅动态面板支持交互-滚动和固定
当容器内元素溢出时,可以为容器添加滚动行为,且支持子图层设置滚动时固定。
所有容器均支持滚动和固定。

4、演示流程

Axure 操作方式MasterGo 操作方式
1.生成HTML文件本地预览1.预览模式
预览时,可以设置背景颜色,并选择合适的设备模型。
2.演示流程
可创建多个流程,在演示时,支持只演示特定的某个流程。
3.分享原型
支持一键生成在线预览链接,当画布更新后,预览自动同步更新。

五、团队协同

1、需求评审

area_comment.gif

Axure 操作方式MasterGo 操作方式
1.导出PDF/HTML后,进行本地评审及反馈1.开始评论
2.校对工具
3.圈话工具
画布内可直接@成员进行评论, 评论将关联具体图层,同时支持文本、圈话、校对多类型。
版本更新后实时同步,无需手动发送最终版本。

2、权限控制

Axure 操作方式MasterGo 操作方式
1.无精细化权限管理1.分享文件
2.团队版席位说明
3.企业版席位说明
4.企业版角色说明
文件支持按角色分配查看、编辑权限。
支持设置文件链接访问权限、时间限制,可查看文件访问记录,并转让文件所有权。

六、 管理文件

1、交付状态管理

Axure 操作方式MasterGo 操作方式
动标记开发进度区域工具
使用区域工具标记模块状态,如:进行中、已验收,实时同步进度,降低沟通成本。

2、版本管理

Axure 操作方式MasterGo 操作方式
手动备份多个版本文件历史版本管理
文件自动保存历史版本,并可按时间线回溯,支持对版本进行标注和恢复。

3、文件管理

Axure 操作方式MasterGo 操作方式
本地手动管理团队资产管理
可按照组织架构、业务模块创建团队与项目,并分配席位与权限,进行精细化管理。

评价此篇文章:👍🏻 有帮助 👎🏻 无帮助

👉本篇文章对你是否有帮助?👍🏻 有帮助 👎🏻 无帮助,我们期待着你的反馈。