网 站 界 面 （ UI） 设 计 实 训 3 完 成 App项 目 原 型 的 制 作 （ 必 做 ） 实 训 目 的 通 过 制 作 App 产 品 原 型 ， 将 策 划 书 的 内 容 可 视 化 ， 将 每 一 个 页 面 中 的 功 能 可 视 化 ，使 设 计 出 的 UI 符 合 App 功 能 需 求 实 训 内 容 确 定 App产 品 应 用 的 系 统 ， 确 定 UI页 面 的 基 本 结 构 和 布 局 ， 根 据 策 划 书 和 思 维 导图 完 成 App功 能 页 面 的 绘 制 ， 为 相 关 页 面 建 立 超 链 接 。 掌 握 原 型 制 作 软 件 的 使 用 。 实 训 要 求 教 师 指 导 2 学 时 ， 学 生 课 后 8 学 时 或 以 上 。 需 完 成 二 级 页 面 原 型 ， 如 下 图 。 实 训 过 程 记 录 步 骤 简 述 ： 01 框 架 搭 建 1. 新 建 页 面 底 部 导 航 分 为 5 个 部 分 ， 所 以 也 对 应 着 五 个 页 面 。 在 制 作 时 先 不 考 虑 登 录 等 其 他 页 面 ， 只 做主界 面 。 1. 在 页 面 部 分 （ 注意不 是概要 部 分 ） 添加文件 夹命名为 主界 面 ， 放置主界 面 的 页 面 。 2. 在 文件 夹下 面 添加页 面 ， 底 部 导 航 点击每 个 图 标跳转后 对 应 的 页 面 。 由于该原 型 底 部 导 航分 为 5 个 部 分 ， 所 以 在 主界 面 下 是五 个 子页 面 。 每 个 子页 面 可 以 继续添加子页 面 ， 类似下 图中 我——个 人主页 ， 代表页 面 内 跳转的 页 面 。 2. 页 面 布 局 一个简易的页面基本都会包括状态栏、导航栏与标签栏（即底部导航）。 一般来说移动端的页面制作时尺寸设置为 375*667 状态栏高 20（状态栏可以下载 AXURE 元件库进行导入，也可以自己制作。） 导航栏高 44 底部导航高 49 除了这些以外的位置，便是可以放置主要内容的地方。 建议初学者可以直接使用矩形工具包括中间部分，再设置为动态面板。（蓝色框线部分即是放置主要内容的地方，右键设置为动态面板后即可双击此动态面板进入编辑） 注意，在右边样式部分，需要对动态面板进行选择“按需滚动”，这样才可以在预览时看到所有编辑的部分。 02 底部导航+页面...
