01. 产品功能结构图
- 功能结构图,侧重点在于功能:
- 制作方法:
- 先根据产品的一级页面,找到产品的主要功能模块;
- 在根据主要功能模块,逐级展开
- 使用场景:
- 在产品规划初期,考虑产品功能细节时使用
02. 产品信息结构图和产品结构图
- 信息结构图:强调脱离实际页面,主要体现产品某种类型的信息字段;
- 产品结构图:
- 根据页面层级制作,从上到下,从左到右;
- 重点功能重点制作,层级尽量深;
- 产品经理一定要绘制产品结构图;信息结构图,以了解为主,如果需要制作,更多的是考虑产品中的信息字段;
03. 产品结构图制作案例
- 以微信为例,制作部分内容的产品结构图;
- 根据页面层级进行制作;
04. 结构图与原型的关系
- 产品结构图的使用场景:
- 做产品规划时使用,通过结果图梳理产品框架,
- 竞品分析时,也需要制作产品结构图
- Xmind软件使用:建议记住采用操作的快捷键
05. Axure采用元件01
- 矩形的圆角设置:
- 拖动矩形元件左上方的黄色小三角
- 在“样式-圆角半径”中进行设置
- 图片的导入:
- 原尺寸导入图片:当图片元件的四角为黄色的小正方形时,导入图片为原尺寸
- 根据给定尺寸导入图片:当图片元件的四角为白色的小正方形时,导入的图片会根据给定尺寸进行压缩
06. Axure常用元件02
- 文本框:注意,可以设置文本类型,
- 下拉框:可以批量设置选项
- 单选、多选;如果要制作单选的效果,需要设置单选按钮(选中全部的选项,右键,选择“设置单选按钮组”)
07. Axure常用交互
-
鼠标悬停、鼠标按下、选中、禁用:
- 属性-形状-交互样式设置
- 选中:为了设置选中的交互效果,要先设置选中的效果,再添加选中的交互事件
- 当我们需要给某个元件添加交互动作时,需要给元件命名
-
设置toggle效果:
1.属性-交互-鼠标单击时-选中-true下拉框改为toggle就可以
08. 元件库和母版
- 元件库、母版最大的作用:
- 极大地提高原型制作效率
- 最好的元件库,都是自己做的
09. 常见的原型规范
- 在企业中制作原型时,只制作iOS端原型
- 产品经理在制作原型时,需要遵循的规范(移动端):
- 手机框大小:375*667px。某些页面比较长,比如说淘宝首页,这个时候,可以忽略667的限制
- 状态栏:高度20px;
- 导航栏:高度44px;
- 标签栏:高度49px,字体大小10,图标大小25*25px;
- 一级按钮,高度40px;
- 推荐材料《ISO交互设计规范》
10. 页面流程图、泳道图
- 使用Axure可以制作页面流程图
- 使用Axure可以制作泳道图