Axure RP 9互联网设计设计制App原型.pdf

AxureRP9互联网产品 设计制作App原型 设计制作App页面原型 案例分析 本App将运行于iOS系统,在设计制作原型 时要遵循 iOS系统地要求规 ,严格控制页面 地尺寸,图标地尺寸与文本地尺寸。为了提高 制作效率,应尽可能使用元件样式控制页面地 文本样式,使用母版制作页面相同地 内容,例如 状态栏与标签栏。 设计制作App页面原型 案例效果 由于App页面很多,本案例按照页面地功能将页面分为启 动页面,会员系统页面,App首页与设 师页面4个部分,案例预 览效果如图所示。 设计制作App页面原型 设计制作App启动页面 新建一个AxureRP9文件。在样式面板设置页面样式。 将 矩形2元件拖曳到页面并设置样式。 设计制作App页面原型 设计制作App启动页面 将 二级标题元件拖曳到页面,修改文本内容并设置其文本 式。拖曳选 二级标题 元件与 矩形2元件,单击工具栏上地 组合 按钮完成编组操作,在 页面面板修改页面名称为主界 面。 设计制作App页面原型 设计制作App启动页面 单击 样式 面板上地 管理元件样式 按钮,在弹出地 元件 样式管理 对话框 建一个名称为文本 10地样式。在对话框 右侧设置元件样式如下图所示。 设计制作App页面原型 设计制作App启动页面 单击复制按钮,分别创建字号为12,14,16地样式 新建一个名称为 启动页 地页面,将 图片元件拖曳到页面并 导入图片素材 设计制作App页面原型 设计制作App启动页面 在 元件 面板选择 iOS11元件库,将 白色地系统状态 元 件拖曳到页面,调整大小与位置如下图所示。单击鼠标右键,在 弹出地快捷菜单选择转换为母版。 设计制作App页面原型 设计制作App启动页面 在弹 出地 创建母版 对话框设置母版名称为 状态栏 。 单 继续 按钮,完成母版地创建。使用矩形元件与文本元件 制作下图所示地图标。 设计制作App页面原型 设计制作App启动页面 将 文本标签 元件拖曳到页面并修改文本 内容,在 样式 面 板选择文本12样式。 将 文本标签 元件拖曳到页面,修改文本 内容并 择 文本 12样式,在样式面板修改文本颜色为白色,对齐方式为居。 设计制作App页面原型 设计制作App启动页面 新建一个名称为开屏广告地页面,将 动态面板 元件拖曳 页面并命名为pop,样式面板如下图所示。双击进入动态 面板编辑模式,新建2个面板状态,在每个状态插入图片素材。 设计制作App页面原型 设计制作App启动页面 返回页面编辑模式,将 标签栏 元件从 母版 面板拖曳到页 面