01. 产品功能结构图

  1. 功能结构图,侧重点在于功能:
  2. 制作方法:
    1. 先根据产品的一级页面,找到产品的主要功能模块;
    2. 在根据主要功能模块,逐级展开
  3. 使用场景:
    1. 在产品规划初期,考虑产品功能细节时使用

02. 产品信息结构图和产品结构图

  1. 信息结构图:强调脱离实际页面,主要体现产品某种类型的信息字段;
  2. 产品结构图:
    1. 根据页面层级制作,从上到下,从左到右;
    2. 重点功能重点制作,层级尽量深;
  3. 产品经理一定要绘制产品结构图;信息结构图,以了解为主,如果需要制作,更多的是考虑产品中的信息字段;

03. 产品结构图制作案例

  1. 以微信为例,制作部分内容的产品结构图;
    1. 根据页面层级进行制作;

04. 结构图与原型的关系

  1. 产品结构图的使用场景:
    1. 做产品规划时使用,通过结果图梳理产品框架,
    2. 竞品分析时,也需要制作产品结构图
  2. Xmind软件使用:建议记住采用操作的快捷键

05. Axure采用元件01

  1. 矩形的圆角设置:
    1. 拖动矩形元件左上方的黄色小三角
    2. 在“样式-圆角半径”中进行设置
  2. 图片的导入:
    1. 原尺寸导入图片:当图片元件的四角为黄色的小正方形时,导入图片为原尺寸
    2. 根据给定尺寸导入图片:当图片元件的四角为白色的小正方形时,导入的图片会根据给定尺寸进行压缩

06. Axure常用元件02

  1. 文本框:注意,可以设置文本类型,
  2. 下拉框:可以批量设置选项
  3. 单选、多选;如果要制作单选的效果,需要设置单选按钮(选中全部的选项,右键,选择“设置单选按钮组”)

07. Axure常用交互

  1. 鼠标悬停、鼠标按下、选中、禁用:

    1. 属性-形状-交互样式设置
    2. 选中:为了设置选中的交互效果,要先设置选中的效果,再添加选中的交互事件
    3. 当我们需要给某个元件添加交互动作时,需要给元件命名
  2. 设置toggle效果:

    1.属性-交互-鼠标单击时-选中-true下拉框改为toggle就可以

08. 元件库和母版

  1. 元件库、母版最大的作用:
    1. 极大地提高原型制作效率
    2. 最好的元件库,都是自己做的

09. 常见的原型规范

  1. 在企业中制作原型时,只制作iOS端原型
  2. 产品经理在制作原型时,需要遵循的规范(移动端):
    1. 手机框大小:375*667px。某些页面比较长,比如说淘宝首页,这个时候,可以忽略667的限制
    2. 状态栏:高度20px;
    3. 导航栏:高度44px;
    4. 标签栏:高度49px,字体大小10,图标大小25*25px;
    5. 一级按钮,高度40px;
    6. 推荐材料《ISO交互设计规范》

10. 页面流程图、泳道图

  1. 使用Axure可以制作页面流程图
  2. 使用Axure可以制作泳道图