1、UI 设 计 系 统 分 析 及 国 内 行 业 调 研UI 即 User Interface(用 户 界 面 )的 简 称 。 UI 设 计 则 是 指 对 软 件 的 人 机 交 互 、 操 作逻 辑 、 界 面 美 观 的 整 体 设 计 。 好 的 UI 设 计 不 仅 是 让 软 件 变 得 有 个 性 有 品 味 , 还 要 让软 件 的 操 作 变 得 舒 适 、 简 单 、 自 由 ,充 分 体 现 软 件 的 定 位 和 特 点 。 UI 是 什 么软 件 设 计 可 分 为 两 个 部 分 : 编 码 设 计 与 UI 设 计 。 编 码 设 计 大 家 都 很 熟 悉 ,
2、 但 是 UI 设 计 还 是 一 个 很 陌 生 的 词 , 即 使 一 些 专 门 从 事 网 站 与 多 媒 体 设 计 的 人 也 不 完 全 理 解 UI 的 意 思 。 UI 的 本 意 是 用 户 界 面 , 是 英 文 User 和 interface 的 缩 写 。 从 字 面 上 看 是 用户 与 界 面 2 个 组 成 部 分 , 但 实 际 上 还 包 括 用 户 与 界 面 之 间 的 交 互 关 系 。 界 面 设 计 。 在 漫 长 的 软 件 发 展 中 , 界 面 设 计 工 作 一 直 没 有 被 重 视 起 来 。 做 界 面 设 计的 人 也 被 贬 义
3、 的 称 为 “美 工 ”。 其 实 软 件 界 面 设 计 就 像 工 业 产 品 中 的 工 业 造 型 设 计 一 样, 是 产 品 的 重 要 买 点 。 一 个 友 好 美 观 的 界 面 会 给 人 带 来 舒 适 的 视 觉 享 受 , 拉 近 人 与 电 脑的 距 离 , 为 商 家 创 造 卖 点 。 界 面 设 计 不 是 单 纯 的 美 术 绘 画 , 他 需 要 定 位 使 用 者 、 使 用 环境 、 使 用 方 式 并 且 为 最 终 用 户 而 设 计 , 是 纯 粹 的 科 学 性 的 艺 术 设 计 。 检 验 一 个 界 面 的 标准 既 不 是 某 个 项
4、 目 开 发 组 领 导 的 意 见 也 不 是 项 目 成 员 投 票 的 结 果 , 而 是 最 终 用 户 的 感 受。 所 以 界 面 设 计 要 和 用 户 研 究 紧 密 结 合 , 是 一 个 不 断 为 最 终 用 户 设 计 满 意 视 觉 效 果 的 过程 。 UI 设 计 师 是 做 什 么 的UI 设 计 从 工 作 内 容 上 来 说 分 为 3 个 方 向 。 图 它 主 要 是 由 UI 研 究 的 3 个 因 素 决定 的 , 其 分 别 是 研 究 工 具 , 研 究 人 与 界 面 的 关 系 , 研 究 人 。 研 究 界 面 -图 形 设 计 师 Gra
5、phic UI designer 国 内 目 前 大 部 分 UI 工 作 者 都 是 从 事 这 个 行 业 。 也 有 人 称 之 为 美 工 , 但 实 际 上 不 是单 纯 意 义 上 的 美 术 工 人 , 而 是 软 件 产 品 的 产 品 外 形 设 计 师 。这 些 设 计 师 大 多 是 美 术 院 校 毕 业 的 , 其 中 大 部 分 是 有 美 术 设 计 教 育 背 景 , 例 如 工 业外 形 设 计 , 装 潢 设 计 , 信 息 多 媒 体 设 计 等 。 研 究 人 与 界 面 的 关 系 -交 互 设 计 师 , interaction designer 在
6、 图 形 界 面 产 生 之 前 , 长 期 以 来 UI 设 计 师 就 是 指 交 互 设 计 师 。 交 互 设 计 师 的 工作 内 容 就 是 设 计 软 件 的 操 作 流 程 , 树 状 结 构 , 软 件 的 结 构 与 操 作 规 范 ( spec) 等 。一 个 软 件 产 品 在 编 码 之 前 需 要 作 的 就 是 交 互 设 计 , 并 且 确 立 交 互 模 型 , 交 互 规 范 。 交 互 设 计 师 一 般 都 是 软 件 工 程 师 背 景 居 多 。 研 究 人 -用 户 测 试 /研 究 工 程 师 User experience engineer任
7、何 的 产 品 为 了 保 证 质 量 都 需 要 测 试 , 软 件 的 编 码 需 要 测 试 , 自 然 UI 设 计 也 需要 被 测 试 。 这 个 测 试 和 编 码 没 有 任 何 关 系 , 主 要 是 测 试 交 互 设 计 的 合 理 性 以 及 图 形 设 计的 美 观 性 。 测 试 方 法 一 般 都 是 采 用 焦 点 小 组 , 用 目 标 用 户 问 卷 的 形 式 来 衡 量 UI 设 计的 合 理 性 。 这 个 职 位 很 重 要 , 如 果 没 有 这 个 职 位 , UI 设 计 的 好 坏 只 能 凭 借 设 计 师 的经 验 或 者 领 导 的 审
8、 美 来 评 判 , 这 样 就 会 给 企 业 带 来 严 重 的 风 险 性 。 用 户 研 究 工 程 师 一 般 是 心 理 学 人 文 学 背 景 比 较 合 适 。 综 上 所 述 UI 设 计 师 就 是 : 软 件 图 形 设 计 师 、 交 互 设 计 师 和 用 户 研 究 工 程 师 。 UI 设 计 在 中 国 的 现 状目 前 在 国 内 UI 还 是 一 个 相 对 陌 生 的 词 , 即 便 是 一 些 设 计 人 员 也 对 这 个 词 不 太 了 解。 我 们 经 常 看 到 一 些 招 聘 广 告 写 着 : 招 聘 界 面 美 工 、 界 面 美 术 设
9、计 师 等 等 。 这 表 明 在 国内 对 UI 的 理 解 还 停 留 在 美 术 设 计 方 面 , 认 为 UI 的 工 作 只 是 描 边 画 线 , 缺 乏 对 用 户 交互 的 重 要 性 的 理 解 ; 另 一 方 面 在 软 件 开 发 过 程 中 还 存 在 重 技 术 而 不 重 应 用 的 现 象 。 许 多商 家 认 为 软 件 产 品 的 核 心 是 技 术 , 而 UI 仅 仅 是 次 要 的 辅 助 , 这 点 在 人 员 的 比 例 与 待遇 上 可 以 表 现 出 来 。 但 这 不 是 UI 设 计 真 正 的 价 值 体 现 , 只 是 UI 设 计 发
10、 展 的 一 个 必经 过 程 。 我 们 以 物 质 产 品 手 机 行 业 为 例 , 当 手 机 刚 刚 进 入 市 场 的 时 候 不 但 价 格 贵 的 惊 人, 而 且 除 了 通 话 以 外 没 有 什 么 其 他 功 能 。 由 于 当 时 的 主 导 是 技 术 , 所 以 大 家 都 把 精 力 放在 信 号 、 待 机 时 间 、 寿 命 等 方 面 , 对 于 产 品 的 造 型 , 使 用 的 合 理 性 很 少 关 心 。 事 过 境 迁, 如 今 技 术 已 经 完 全 的 达 到 用 户 的 需 求 , 于 是 商 家 为 了 创 造 卖 点 , 提 高 争 力
11、 , 非 常 重 视产 品 的 外 观 设 计 , 除 此 之 外 还 频 频 推 出 短 信 ,彩 屏 , 和 铉 , 彩 信 ,摄 像 头 等 等 。 这 样 一来 产 品 的 美 观 、 个 性 、 易 用 、 易 学 、 人 性 化 等 等 都 成 了 产 品 的 卖 点 。 软 件 产 品 与 物 质 产品 的 发 展 是 相 同 的 。 过 去 由 于 计 算 机 硬 件 的 限 制 , 编 码 设 计 成 为 软 件 开 发 的 代 名 词 , 美观 亲 和 的 图 形 化 界 面 与 合 理 易 用 的 交 互 方 式 都 没 有 得 到 充 分 的 重 视 , 实 际 上 这
12、 个 时 期 的软 件 叫 作 软 件 程 序 , 而 不 是 软 件 产 品 。 现 今 随 着 计 算 机 硬 件 的 飞 速 发 展 , 过 去 的 软 件 程 序 已 经 不 能 适 应 用 户 的 要 求 。 软 件产 品 在 激 烈 的 市 场 竞 争 中 , 仅 仅 有 强 大 的 功 能 是 远 远 不 够 的 , 不 足 以 战 胜 强 劲 的 对 手 。幸 运 的 是 在 国 内 一 些 高 瞻 远 瞩 的 民 族 企 业 已 经 开 始 意 识 到 UI 给 软 件 产 品 带 来 的 巨 大卖 点 了 , 例 如 金 山 公 司 的 影 霸 、 词 霸 、 毒 霸 、
13、网 标 , 由 于 重 视 UI 的 开 发 与 地 位 , 才使 得 金 山 产 品 在 同 类 软 件 产 品 中 首 屈 一 指 。 联 想 软 件 的 UI 部 门 积 极 开 展 用 户 研 究 与使 用 性 测 试 , 将 易 用 与 美 观 相 结 合 , 推 出 的 双 模 式 电 脑 、 幸 福 系 列 等 成 功 UI 范 例 ,为 联 想 赢 得 全 球 消 费 PC 第 三 的 称 号 等 等 、 等 等 .实 践 证 明 , 各 商 家 只 要 在 产 品 美 观和 易 用 设 计 方 面 很 小 投 入 , 将 会 有 很 大 产 出 。 其 投 入 产 出 比 ,
14、 要 比 在 功 能 领 先 性 开 发 上的 投 入 大 得 多 。 我 们 不 得 不 承 认 现 阶 段 中 国 在 很 多 领 域 都 与 西 方 发 达 国 家 有 相 当 大 的 差 距 , 如 何 赶上 并 超 过 他 们 是 我 们 这 代 人 肩 负 的 历 史 使 命 。 软 件 产 品 领 域 不 象 物 质 产 品 那 样 存 在 工 艺、 材 料 上 的 限 制 , 软 件 产 品 核 心 问 题 就 是 人 。 提 高 软 件 UI 设 计 师 个 人 能 力 减 小 人 员上 的 差 距 是 中 国 UI 发 展 首 要 关 键 的 问 题 。 目 前 国 内 各
15、 院 校 还 没 有 设 立 相 对 健 全 的 UI 设 计 专 业 , 所 以 提 高 UI 设 计 师 能 力 关键 在 于 提 供 一 个 良 好 的 学 习 与 交 流 的 资 源 环 境 。 国 内 已 经 有 很 多 交 流 设 计 网 站 , 介 绍 工业 设 计 、 平 面 设 计 、 服 装 设 计 、 绘 画 艺 术 、 多 媒 体 flash 等 , 但 是 UI 设 计 一 直 没 有受 到 应 有 的 关 注 , 仅 仅 被 放 在 数 码 设 计 或 者 平 面 网 页 设 计 的 一 个 栏 目 里 , 这 仅 有 的 资 源对 培 养 优 秀 的 设 计 师
16、是 不 够 的 , 必 须 有 一 个 信 息 快 捷 、 资 源 丰 富 、 设 计 水 平 一 流 、 专 业权 威 的 UI 设 计 学 习 与 交 流 的 地 方 才 能 适 应 日 益 发 展 的 UI 设 计 师 们 的 需 求 。 UI 设 计 的 流 程确 认 目 标 用 户 在 软 件 设 计 过 程 中 , 需 求 设 计 角 色 会 确 定 软 件 的 目 标 用 户 , 获 取 最 终 用 户 和 直 接用 户 的 需 求 。用 户 交 互 要 考 虑 到 目 标 用 户 的 不 同 引 起 的 交 互 设 计 重 点 的 不 同 。例 如 : 对 于 科 学 用 户
17、和 对 于 电 脑 入 门 用 户 的 设 计 重 点 就 不 同 。采 集 目 标 用 户 的 习 惯 交 互 方 式 不 同 类 型 的 目 标 用 户 有 不 同 的 交 互 习 惯 。 这 种 习 惯 的 交 互 方 式 往 往 来 源 于 其 原 有 的针 对 现 实 的 交 互 流 程 、 已 有 软 件 工 具 的 交 互 流 程 。当 然 还 要 在 此 基 础 上 通 过 调 研 分 析 找 到 用 户 希 望 达 到 的 交 互 效 果 , 并 且 以 流 程 确 认下 来 。提 示 和 引 导 用 户 软 件 是 用 户 的 工 具 。 因 此 应 该 由 用 户 来 操
18、 作 和 控 制 软 件 。 软 件 响 应 用 户 的 动 作 和 设定 的 规 则 。对 于 用 户 交 互 的 结 果 和 反 馈 , 提 示 用 户 结 果 和 反 馈 信 息 , 引 导 用 户 进 行 用 户 需 要 的下 一 步 操 作 。一 致 性 原 则 设 计 目 标 一 致 软 件 中 往 往 存 在 多 个 组 成 部 分 ( 组 件 、 元 素 ) 。 不 同 组 成 部 分 之 间 的 交 互 设 计 目 标需 要 一 致 。例 如 : 如 果 以 电 脑 操 作 初 级 用 户 作 为 目 标 用 户 , 以 简 化 界 面 逻 辑 为 设 计 目 标 , 那 么
19、该 目 标 需 要 贯 彻 软 件 ( 软 件 包 ) 整 体 , 而 不 是 局 部 。元 素 外 观 一 致 交 互 元 素 的 外 观 往 往 影 响 用 户 的 交 互 效 果 。 同 一 个 ( 类 ) 软 件 采 用 一 致 风 格 的 外 观, 对 于 保 持 用 户 焦 点 , 改 进 交 互 效 果 有 很 大 帮 助 。 遗 憾 的 是 如 何 确 认 元 素 外 观 一 致 没 有特 别 统 一 的 衡 量 方 法 。 因 此 需 要 对 目 标 用 户 进 行 调 查 取 得 反 馈 。交 互 行 为 一 致 在 交 互 模 型 中 , 不 同 类 型 的 元 素 用
20、户 触 发 其 对 应 的 行 为 事 件 后 , 其 交 互 行 为 需 要 一致 。例 如 : 所 有 需 要 用 户 确 认 操 作 的 对 话 框 都 至 少 包 含 确 认 和 放 弃 两 个 按 钮 。对 于 交 互 行 为 一 致 性 原 则 比 较 极 端 的 理 念 是 相 同 类 型 的 交 互 元 素 所 引 起 的 行 为 事 件相 同 。 但 是 我 们 可 以 看 到 这 个 理 念 虽 然 在 大 部 分 情 况 下 正 确 , 但 是 的 确 有 相 反 的 例 子 证明 不 按 照 这 个 理 念 设 计 , 会 更 加 简 化 用 户 操 作 流 程 。可
21、用 性 原 则 可 理 解 软 件 要 为 用 户 使 用 , 用 户 必 须 可 以 理 解 软 件 各 元 素 对 应 的 功 能 。如 果 不 能 为 用 户 理 解 , 那 么 需 要 提 供 一 种 非 破 坏 性 的 途 径 , 使 得 用 户 可 以 通 过 对 该元 素 的 操 作 , 理 解 其 对 应 的 功 能 。例 如 : 删 除 操 作 元 素 。 用 户 可 以 点 击 删 除 操 作 按 钮 , 提 示 用 户 如 何 删 除 操 作 或 者 是否 确 认 删 除 操 作 , 用 户 可 以 更 加 详 细 的 理 解 该 元 素 对 应 的 功 能 , 同 时
22、可 以 取 消 该 操 作 。可 达 到 用 户 是 交 互 的 中 心 , 交 互 元 素 对 应 用 户 需 要 的 功 能 。 因 此 交 互 元 素 必 须 可 以 被 用 户控 制 。用 户 可 以 用 诸 如 键 盘 、 鼠 标 之 类 的 交 互 设 备 通 过 移 动 和 触 发 已 有 的 交 互 元 素 达 到 其它 在 此 之 前 不 可 见 或 者 不 可 交 互 的 交 互 元 素 。要 注 意 的 是 交 互 的 次 数 会 影 响 可 达 到 的 效 果 。 当 一 个 功 能 被 深 深 隐 藏 ( 一 般 来 说 超过 4 层 ) 那 么 用 户 达 到 该
23、元 素 的 几 率 就 大 大 降 低 了 。可 达 到 的 效 果 也 同 界 面 设 计 有 关 。 过 于 复 杂 的 界 面 会 影 响 可 达 到 的 效 果 。 ( 参 考 简单 导 向 原 则 )可 控 制 软 件 的 交 互 流 程 , 用 户 可 以 控 制 。功 能 的 执 行 流 程 , 用 户 可 以 控 制 。如 果 确 实 无 法 提 供 控 制 , 则 用 能 为 目 标 用 户 理 解 的 方 式 提 示 用 户 。手机中的信息架构设计。手机中牵涉到的信息:手机是一个聚合功能性的移动产品,它在信息的展现方式上很大程度受限于屏幕的尺寸,小屏幕是我们在针对手机做信息
24、架构设计(为了方便,我下面简称 IA 设计,虽然不严谨,但我相信大家能看懂)前必须考虑的问题。“小”屏幕带来的优点和缺点是显而易见的,即使分辨率在不断提升,小的物理尺寸也限制了功能展现的复杂性,容易在单向操作反馈中进行功能的实现,一 般用户会主动放弃过于复杂的多任务处理,这使得 IA 设计的难度有所降低;而“小”本身也带来了信息组织方式的困难,如何处理图片,文字,行距,间距,操作 区指引和提示,包括信息检索,排序等问题显得比网站更为头痛,一切的原因都是这个“小”。手机中能够常见的信息包括:功能图标,文字选项,操作映射按钮,短信文本和图像,图片,视频,音乐,互联网访问页面和记录,游戏,使用生成的
25、信息(包括未接电话数量等)手机中信息架构设计的要点:图标功能: 图标的映射代表了当前的类似功能集合,这里首先需要考虑的是功能优先级,优先级由使用频度和功能强度决定,图标作为小屏幕上的优先解决方案应该传达准确,美观,更好的利用空间(比如我们常使用的 Matrix 格局),满足一致性;操作按钮:和 ID 外观的映射操作,这方面的要求,手机产品大于 PC 端的要求,因为按键的数量和使用面积有限,这就需要映射更为准确,一般在屏幕端都必须针对当前界面做按钮提示(比如我们一直没有放弃的 softkey 概念),以保证进入和退出机制的完整;图片,音乐,视频等用户文件:重点强调预览和文件基本信息的展示,文件的
26、排序方式应支持用户自定义的情况,无论是升序还是降序,都需要提供基于用户 个性习惯的排列方式,而检索在智能手机系统中的重要性也被逐渐重视。系统再识别和重新智能分类在这里不建议采纳,仅提供用户储存入口即可;短信文本:目前基于联系人的对话分类方式被大多数平台沿用开来,感谢 iphone 为我们做了这个设计模型,而需要注意的是,在针对分辨率较小的屏幕时(比如低于176X220),这种短信文本组织方式的优势将会不明显,更多会采取按时间顺序排列以及未回复状态做综合属性。设计的原则:其实我们一直讨论的信息架构的方式都局限于“组织者”提供给“访问者”更优的信息组织方式,显然没有任何一种信息组织方式是适用于任何
27、人的。在不远的将来,我们可以预见,对于信息架构的“自定义”化会被越来越多的提到。手机端呈现出来的优势就是大多数的信息都是可以被用户自定义的,用户可以对产生的信息或者系统本身的信息(比如主题等)进行修改,增加,删除等操作,这使得初始的IA 设计变得“简单”。更多的手机端 IA 设计集中在“如何满足用户显而易见的需求,并针对这些需求展现相应的功能”,手机作为一个个人化的设备,更多的是满足个人的需求与应用,因此在信息量上是有一个极限的。(如果你通过手机访问互联网参与了社区运用,那么这个时候 IA的出发点已经转变)设计的误区:提供过多的信息: 事实证明,过多的信息会引起信息的焦虑症,特别在手机端上,可
28、视范围的缩小让用户更容易产生对信息的排斥,因此只解决用户需要解决的问题是进行IA 设计的重要前提;提供过多的分类: 过多的分类导致了过多的目录,过多的目录导致了过多的返回步骤,这些都在降低信息的有效到达,控制同一屏幕中的分类数量是 IA 设计首先要解决的问题,如果实在无法取舍,应首先保证通话与短信的信息被重视;设置过多的层级: 这经常出现在二级或三级菜单中,一些设置选项被隐藏得过深,导致用户无法找到,某些功能项的命名和分类出现问题,而层次又让用户进一步迷路。为解决这种问 题,手机功能的设计中,每项设置应该尽可能的和功能界面本身绑定到一起,而不是单独罗列出来作为一个“设置”项。SNS 的关系网络
29、、用户心理及功能设计分析SNS,Social Networking Services & Social Network Site 社交网站本身最重要的两点:以人为本、关系网络化。之所以强调以人为本,从 web1.0 到 web2.0 还是所谓的 web3.0,这都是互联网普及,基础服务的不断完善下,用户参与度提高,互联网已成为人类不可缺少的信息媒介平台和通信工具。(图一)SNS 中的关系网络、互动机制、用户需求几个关键词:目标用户、归属感、内容体系。不展开,找准目标用户,构建信息或内容体系,让用户找到归属感。这很重要!产品交互上步骤简单,条例清晰即可。 SNS 的关系网络主要有四层:1. 已存
30、在的关系网络:即用户在生活中已经形成的朋友圈、生活圈等,这是不需要拓展的人际关系;2. 社交拓展2.1)同一类人:很自然地,在生活中,我们习惯将用户按人群划分,如:校友、老乡、留学生、创业者等,准确地说,应该成为“同一群人” ;2.2)志同道合:这跟“同一类人”有些相似,但这里更强调内容,这也比同一类人的关系更下一层,如游戏玩家、皇马球迷、网球爱好者、数码发烧友等等;2.3)陌生人:用户之间互不认识,社交动机多为交友、话题等。对于任何 SNS 网站来说,以上四种关系皆有,但各有侧重,四种关系从上至下用户之间的信任度逐渐降低,四种关系也并不是互相独立,也存在转移和关联。一,已存在的关系网络这类关
31、系已经形成,用户在网站之外已经通过长时间培养,所以信任度较高,用户之间的默契不需要通过网站培养,这大大提高了用户对于网站的认知度,用户通过低廉的成本互动,其行为主要体现为:1. 实时关注:随时了解身边正在发生的事情,用户通过关系网络可以很快了解朋友的新鲜事和最新动态,知道他们在做什么,在关注什么。用户通过这种低成本的方式就可以让自己“置身其中” ,不再寂寞,拉近了与好友之间的距离,所谓“海角天涯零距离” ;2. 渴望被关注以及自我表达:用户可以通过文字、视频、图片等方式随时发布自己的动态、所见、所得,并分享出去。在这种分享的过程中,用户获得反馈和交流,得到尊重和自我实现;3. 交友:在这种信任
32、度较高的关系网络中,用户通过 SNS 特性可以很轻松地认识更多的人,并且能很快建立友谊,这也是情感需求的一种体现;4. 线上娱乐:游戏这一话题,从小谈到大,独乐乐不如众乐乐, Social Game 应势而生,朋友之间通过这种轻松的方式互动,娱人娱己。这种社交关系是传统关系的网络化,并通过互动来培养感情,巩固人际关系。而且传统关系网络本身的互动需求成本太高,这也是 SNS 能很快进入市场的根本原因。这种熟人社交最大的特点在于:玩什么不重要,跟谁玩很重要!而且用户需要很快的反馈。所以在功能设计上应更侧重于分享、评论和 Mini Blog。分享:对于熟人来说,省去了认知过程,互联网上的大量内容和话
33、题可以随时与朋友分享和互动,带给朋友快乐,也带给自己快乐;评论:来自于熟人的评价,这个评论本身的可信度较高,用户的接受程度自然会高;Mini Blog:相对于陌生人来说,在朋友之间发布简短言论和新鲜事,能很快获得回复,而且熟人之间本身就存在心情、话题、意见的即时交流,所以这也是用户需求的归纳,是合理的。再来看看 Social game:开心网上火过的开心农场、朋友买卖、争车位等,这种游戏本身并没什么,如果是在一个陌生人群中,或许只能被闲置,这种游戏互动不仅能消磨时间,而且也是“跟谁玩最重要”的体现。二,同一类(群)人该类一般体现在学习、生活和工作中,相对于“已经存在的关系”来说,同一群人之间可
34、能存在陌生人,相对于“陌生人”来说,也有“已经存在的关系” ,但跟前者一样,同一群人之间并不需要太长的时间培养感情和认知,即可展开互动,即所谓“触景生情” ,这也算是一种熟人社交吧。这类网站的社交关系建立一般依靠人际网络的精细分类来区分,用户可以通过分类很快找到“组织”以及“组织”里的人。这类人群的互动行为跟“已经存在的关系”差不多,只是在互动上要求更高,跟谁玩很重要,玩什么也很重要,同时,日志等 UGC 的功能也应适当强化,因为在这类关系中,用户为了提高自己的影响力和实现自我表达,需要付出更多的成本,比如用户需要通过发布观点表达自己的意见和想法, 。在功能设计上,应注意群体的特性,因为这种群
35、体关系很容易随着时间和空间的变化而变淡。所以应强化内容分享,因为内容是持续地、更新的、有很长“保质期”的。而 Social game?WebGame?如校内网,本身就存在同学(熟人)关系,所以 social game 是合理的,有市场的。但由于这种群体关系本身存在生命周期,所以 social game 的生命周期也会缩短。解决办法不在于开发更多的游戏,而是通过 WebGame 来弥补,WebGame 游戏性较强,则会适当减弱对关系网络的依赖。三,志同道合用户由于相同的爱好、兴趣、话题或经历等凑在一起,如豆瓣网,在这个用户群体里,用户之间的关系变得不那么重要,用户之间共同关注的内容显得重要起来,
36、跟谁玩不重要,玩什么很重要。这跟熟人社交不一样。所以这类网站应侧重于分类、话题。相对于前两种关系,这类关系里的线上娱乐,似乎变得不那么活跃。在志同道合的用户世界里,用户对于信息的获取需求显得迫切,这也决定了该类网站的用户层次较高。用户忠诚度较高。所以在功能设计上,强化搜索、智能分析、收藏对于网站的黏度有很大帮助。搜索:有海量内容,自然存在搜索,这就是必然性和关联性;智能分析:因为是社交网站,因为长尾用户较多,所以数据分析和智能推荐对于用户消除“孤独感”很重要。因为志同道合的网站,用户不依赖于人际关系,依赖于内容。收藏:内容为主的网站,就像网摘、reader 那样,需要对内容搜集整理和再利用。在
37、志同道合里,有一个比较特别的群体:游戏群体。对于游戏群体的用户分析,请参考:(官方)游戏玩家社区产品设计思想!而对于非官方的游戏社区,暂不讨论。四,陌生人陌生人社交,这里的陌生人有区别于志同道合,即原则上是没有共同的爱好和兴趣的,引用别人的一句话“一切为了泡与被泡” ,如果不谈社交,那么 BBS 就是 web2.0 时代最好的一个例子。既然是社交,是“为了泡与被泡” ,那么在设计上就应提倡交友搜索,信息真实,强化相册和个人主页。交友搜索:道理很简单,来这里就是为了找人的;信息真实:增加泡妞的成功率和降低筛选成本;强化相册:提升照片存储速度和读取速度,正如所说“集中展示美女帅哥” , “哥就是来
38、找乐子的!”个人主页:出来混,总得有个绚丽的地儿,这也是为什么 跟 QQ 空间那么相似的原因,因为一定程度上,QQ 本身也可以实现“泡与被泡 ”,MSN 就不行了。上面提到的日志等 UGC 功能是否需要强化?在陌生人交友网站中,用户的主要动机在于交友,交友已经满足了第一层也是最主要的互动,而如果需要在交友的基础上深入沟通,一般体现为 IM/邮件/留言等。日志等UGC 功能应该从交友这个概念中提取出来,作为丰富个人主页的元素。还是有很多用户愿意通过个人主页向外发布自己的观点和意见。在人和机器的互动过程(Human Machine Interaction)中,有一个层面,即我们所说的界面(int
39、erface)。从心理学意义来分,界面可分为感觉(视觉、触觉、听觉等)和情感两个层次。用户界面设计是屏幕产品的重要组成部分。界面设计是一个复杂的有不同学科参与的工程,认知心理学、设计学、语言学等在此都扮演着重要的角色。用户界面设计的三大原则是:置界面于用户的控制之下;减少用户的记忆负担;保持界面的一致性。 用户界面设计在工作流程上分为结构设计、交互设计、视觉设计三个部分。 结构设计 Structure Design 结构设计也成概念设计 (Conceptual Design),是界面设计的骨架。通过对用户研究和任务分析,制定出产品的整体架构。基于纸质的的低保真原型(Paper Prototyp
40、e)可提供用户测试并进行完善。在结构设计中,目录体系的逻辑分类和语词定义是用户易于理解和操作的重要前提。如西门子手机的设置闹钟的词条是“重要记事”,让用户很难找到。 交互设计 Interactive Design交互设计的目的是使产品让用户能简单使用。 任何产品功能的实现都是通过人和机器的交互来完成的。因此,人的因素应作为设计的核心被体现出来。交互设计的原则如下: 1)有清楚的错误提示。误操作后,系统提供有针对性的提示。2)让用户控制界面。“下一步”、“完成”,面对不同层次提供多种选择,给不同层次的用户提供多种可能性。3)允许兼用鼠标和键盘。同一种功能,同时可以用鼠标和键盘。提供多种可能性。4
41、)允许工作中断。例如用手机写新短信的时候,收到短信或电话,完成后回来仍能够找到刚才正写的新短信。5)使用用户的语言,而非技术的语言。6)提供快速反馈。给用户心理上的暗示,避免用户焦急。7)方便退出,如手机的退出,是按一个键完全退出,还是一层一层的退出。提供两种可能性。8)导航功能。随时转移功能,很容易从一个功能跳到另外一个功能。视觉设计 Visual Design在结构设计的基础上,参照目标群体的心理模型和任务达成进行视觉设计。包括色彩、字体、页面等。视觉设计要达到用户愉悦使用的目的。视觉设计的原则如下:。 1)界面清晰明了。允许用户定制界面。2)减少短期记忆的负担。让计算机帮助记忆,例:Us
42、er Name,、Password、IE 进入界面地址可以让机器记住。3) 依赖认知而非记忆。如打印图标的记忆、下拉菜单列表中的选择。4)提供视觉线索。图形符号的视觉的刺激;GUI(图形界面设计):Where, What, Next Step。5)提供默认(default)、撤销(undo)、恢复(redo)的功能6)提供界面的快捷方式。7)尽量使用真实世界的比喻。如:电话、打印机的图标设计,尊重用户以往的使用经验。8)完善视觉的清晰度。条理清晰;图片、文字的布局和隐喻不要让用户去猜。9)界面的协调一致。如手机界面按钮排放,左键肯定;右键否定;或按内容摆放。10)同样功能用同样的图形。11)色
43、彩与内容。整体软件不超过 5 个色系,尽量少用红色、绿色。近似的颜色表示近似的意思。西门子 6688:“确定”按键设计的不一致性用户界面设计构筑了产品设计的基础。如只有首先确定了手机菜单的交互 形式,才能在造型设计上决定是采用五项键或上下键。10 款交互设计原型开发工具 所谓“工欲善其事,必先利其器” ,尽管小米加步枪可以也可以打败敌人,但如果朱棣有了坦克装甲部队,那岂不是更容易平定安南?关于原型开发工具,各有哥的使用习惯,有人喜欢 axure、photoshop ,也有人喜欢手绘,robert 还见到过高人直接用 excel 制作的交互原型,不仅能够布局,还具有基本的链接和跳转功能,相当佩服
44、。工具只是实现目标的一个手段,因此选用何种工具完全基于个人的习惯及方便。当然在某些公司为了便于不同的设计师之间进行交流以及重用而规定使用相同的工具,那就另当别论。下面只是个人所使用过的并且认为值得推荐的工具,我尽可能的将其便利性与不足写出来。1、Axure RP ( Rapid Prototyping)Axure(读音为 Ack-Sure)无疑是目前最受关注的原型开发工具,其能通过组件的方式帮助网站或软件设计师快速建立带有注释的原型(流程图、线框图) ,并凭借自定义可重用的元件、动态面板以及丰富的 script 能够建立基本功能或页面逻辑的动态演示文件。Axure 借鉴了 office 的界面
45、,能够让用户快速上手,并且提供了丰富的组件样式修改,使得通过其能够创建低保真、高保真甚至接近于实际效果的界面。然而最让人称道的是,Axure 的丰富的脚本模式,可以通过点击和选择能够快速完成界面元素的交互,如链接、state 切换、动态变化等效果,使得 Axure 能够生成十分接近于真实产品的原型。另一方面,Axure 能够导入其他人创建的元件库,使得 Axure 能够满足绝大多数类型产品的设计。但 Axure 仍然有一个让人头痛的问题:对于中文的支持不太友好。在小部分元件上输入中午的时候,经常需要像碰运气似的反复切换输入法,破坏了咱们设计师的用户体验。瑕不掩瑜,Axure 仍然是交互设计师的
46、首选原型工具。2、Microsoft Office VisioVisio 在 2000 年被微软收购,并在 2002 年成为 office2003 套件中的一个组件,最新版本是 2007。Visio 能够获得推荐的原因是因为 Visio 的适用性非常之广,从网站界面、数据库模型,到平面布置图到工艺流程图,Visio 都提供了相应的元件库和模板来进行快速创建。相较 Axure 而言, Visio 更适合于传统行业的生产或流程设计,或者软件及互联网行业中的信息、数据和流程的说明,而不太适用于 web 界面。因为其的基于 web 的元件库还是比较少,并且形式和结构也更类似于 word 中的图形工具,
47、因此在原型开发效率上都有所不足。3、Balsamiq Mockups这个基于 Adobe AIR Runtime 的工具实在是有让人眼前一亮的感觉,手绘风格的元件样式粗犷淋漓,能创建接近于纸上手绘的原型文件。其提供了丰富的手绘风格的 web常用元件,包括常用的 html 控件、以及一些组合控件,如多媒体控制器、标签页、列表、Iphone 界面元件等。Mockups 最值得赞赏之处在于其提供的多数组件都可定制外观,对于中文的支持也不错(选择 View Use System Fonts) 。4、MockflowMockflow 和以上工具最大的不同在于 Mockflow 是一项基于 Adobe F
48、lex 技术开发在线服务,提供了与 Balsamiq Mockups 基本相似的功能,甚至更丰富的组件,虽然其元件定制化不够强大,但其提供的元件库默认样式却非常适合用来做商业产品原型的搭建。有一个让我爱不释手的功能是模板,可以设置基于任何页面的模板来进行新的页面设计。与其他模板工具相比,mockflow 有一个非常特色的功能,基于 web 的存储可以在任意电脑上联机打开,同时可以其他人进行快速的分享,并收集在线反馈意见,非常适合虚拟团队的原型设计交流。虽然在线服务的基本帐号只能创建一个文件,但单个文件却没有限制页数,因此也基本上足够使用。5、Pencil sketchPencil 是一款基于
49、Firefox 的扩展组件,安装之后即可在 Firefox 的工具菜单中打开Pencil 的绘图面板。功能比较简单,仅能用以日常简单工作的辅助 说明。提供的默认元件都是基于软件工程,因此更适合用于 windows 桌面程序的简易界面搭建,或者是基本的页面功能说明,并不适用于严肃的原型开发,但 好在体积小、又轻便,能够方便将网页中的元素直接拖到或者复制到当前的画布中,这也是 Pencil 安装在 Firefox 所带来的便利之一吧。更多工具.在以上列举的原型开发工具都是较为常用的,也是在国内的交互设计师们比较常讨论的,但其实和 Axure 功能相似的软件还有很多,下面也就一些简单说明:6、GUI Design Studio这 是一款真的非常强大的原型制作工具,没有在上面推荐的原因是因为我还没有实际体验过,但冲着这工程级的界面设计就没有去尝试的冲动,但是从官方网站的截图 和视频演示来看,这款软件的操作模式和前面的原型工具大有不同。Axure 之类多是基于页面的原型设计,对于 web 网站尽管很实用,但是对于软件界面的流 程设计却略显繁琐。而GUI Design Studio 却另辟蹊径,直接以建立元素与元素之间的关联的方式来自动化的创建动作流程,而从视频演示来看,这样的确很大程度上提升了软件界面原型搭建的 效率。7、Prototype ComposerS