1 / 31

为移动端特性而设计

为移动端特性而设计. 夏文 超. 用户研究员. 交互设计师. 交互设计师. 移动端产品的特性是什么？. 移动端特性. 绕 着桌 子 做 可 用性测试. Nokia,  A comparison between laboratory and field testing, 2005. 移动端特性. 研 究数据如何成设计信息？. 手机电视用户研究 , 200 6. 移动端特性. 环境是塑造信息的模具. 手机电视用户研究 , 200 6. 移动端特性. Google mobile traffic pattern 2011. 移动端产品的特性是什么？.

ifeoma-waters
Download Presentation

为移动端特性而设计

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 为移动端特性而设计

  2. 夏文超 用户研究员 交互设计师 交互设计师

  3. 移动端产品的特性是什么？

  4. 移动端特性 绕着桌子做可用性测试 Nokia,  A comparison between laboratory and field testing, 2005

  5. 移动端特性 研究数据如何成设计信息？ 手机电视用户研究, 2006

  6. 移动端特性 环境是塑造信息的模具 手机电视用户研究, 2006

  7. 移动端特性 Google mobile traffic pattern 2011

  8. 移动端产品的特性是什么？ • 碎片化的行为 • 不是桌面端的缩小版

  9. 设计移动端产品要注意什么？ 为触按而设计 信息有效传递 最小的输入，最少点击

  10. 为触按而设计 • 注意可按大小 44 Points 44 Points 不同目标尺寸对出错率的影响 http://bit.ly/yJ3N2d

  11. 为触按而设计 • 注意可按大小

  12. 为触按而设计 • 单手操作范围 http://bit.ly/yJ3N2d

  13. 为触按而设计 • 如何增加点击区域 • 增大相应区域 • 滑动手势

  14. 信息有效传递 • 导航信息和理解信息

  15. 信息有效传递 – 导航信息 • 工具型 • 直击内容 • 综合体

  16. 信息有效传递 – 导航信息 • 全景 • 中心枢纽

  17. 信息有效传递 – 导航信息 • 暗示主流程 3:2 16:9 主流程被信息和物理尺寸干扰

  18. 信息有效传递 – 导航信息 • 暗示主流程 3:2 16:9

  19. 信息有效传递 – 导航信息 • 暗示主流程 3:2 16:9 该收紧的空间要收紧 与主流程的控件混用造成主流程不清晰 重要信息不要隐藏

  20. 信息有效传递 – 理解信息 为什么卡片形态的设计那么流行？

  21. 信息有效传递 – 理解信息 为什么卡片形态的设计那么流行？

  22. 信息有效传递 – 理解信息 信息要整齐，层次，留白 图片尺寸 分辨关键信息 3+-2 阅读-理解的成本

  23. 信息有效传递 – 理解信息 信息要整齐，层次，留白

  24. 最小输入最少点击 • 是否有必要打字

  25. 最小输入最少点击 • 如要打字，打有必要的字 是否要遮住密码 是否需要记住我 《Mobile First》LukeW，2011

  26. 最小输入最少点击 • 如要打字，打有必要的字 控件要高效 必选项不要有* 合适的默认值 选填放一起 操作外置就外置

  27. 最小输入最少点击 • 可预期的联动 出错后自己定位 请填写联系人 自动键盘

  28. 最小输入最少点击 • 可预期的联动

  29. 最小输入最少点击 • 可预期的联动

  30. Q&A

More Related