结构层界定了产品用什么方式来运作,框架层确定用什么样的功能和形式来实现
结构层-较大的架构和交互设计;框架层-独立的组件及组件间的关系
习惯和比喻
让你的界面与用户早已养成的那些习惯保持一致很重要,更重要的是,界面要与它自身保持一致。
将产品特性和人们在真实世界中曾有的经历建立联想——>即使这些特性和它所代表的的比喻之间的关系,对你来说是显而易见的,它也仅仅是你的用户可能会联想到的、众多比喻中的一个——>尤其当这些用户来自于和你完全不同的文化背景时——>可以提供一些上下文/背景环境辅助用户决策——>避免用户在猜测过程中错误操作/感到困惑
1. Interface Design
“选择正确的界面元素”——> “帮助用户完成任务”
容易被理解和使用:一眼最看到最重要的东西,不重要的东西不会被注意到
Structure决定哪个功能在哪个界面上完成,Skeleton决定这个功能在界面上如何被感知和操作
应对极端情况的界面对于普通情况下的用户而言是设计不良、过于复杂的
EX1:考虑默认值
EX2:自动记住用户最后一次选择状态
Check Box 复选框:选项独立,可多选
Radio Button 单选框:选项互斥,选一个
Text Field 文本框:允许输入文字
Dropdown List 下拉菜单:从下拉选项中选择一个
List Box 多选菜单(含滚动条):从滚动选项中选择一个/多个
Action Button 操作按钮 触发/执行某个操作
2. Navigation Design “去某个地儿”
导航提供给用户一个在网站内部跳转的路径(点击任意标签能否到达目标位置?)
导航设计必须传达出导航标签和对应包含的内容之间的联系(点击某个导航标签可以获得哪些内容,完成哪些任务?)
导航设计必须传达出导航标签与当前浏览内容之间的联系(点击不同导航标签可以对我当前要解决的任务提供什么帮助?)
用户初次访问网站,可能到达网站内的任意页面,所以每个页面的导航最好是相对独立的。
Navigation System 导航系统
Global Navigation 全局导航
并非贯穿整个网站(固定导航),固定的元素不一定是全局的
不管你想去哪儿,你都能从全局导航中(直接/间接)到达那儿。
Local Navigation 局部导航
可能只提供一个页面的子级、父级、兄弟级通路
如果你的架构反应了用户对这个网站内容结构的思路,那么局部导航很方便。
Supplementary Navigation 辅助导航
辅助导航提供全局、局部导航无法快速到达的相关内容的快捷途径。
Contextual Navigation 上下文导航/内联导航
嵌入页面内容的导航
EX: 页面文字中的超链接
用户需要额外信息的时候,恰恰是他们读文本的时候,不如放一些相关链接到正在阅读的文本里。
Courtesy Navigation 友好导航
提供给用户他们通常不会需要的链接...
联系信息、反馈表单和法律声明的链接通常都放置在友好导航里。
Remote Navigation 远程导航
主导航系统没法让用户满意的时候可以考虑远程导航。
Site Map 站点地图
常见的远程导航工具之一
通常不会超过2个层级的导航(更详细的内容超出用户需求,不然就是结构设计不合理)
Index 索引表
按字母顺序排列的、链接到指定页面的标签列表
对于涵盖了不同主题、大量内容的网站有效(如维基百科)
3. Information Design “传达想法”
如何呈现这些信息,让人们能很容易地使用、理解信息。
用一种“反应用户思路”、“支持用户任务和目标”的方式来分类、排列目标信息元素。
错误提示是在设计界面是经常要考虑的信息设计问题。
Wayfinding 路标:
结合信息合计和导航设计,帮助用户理解“你在哪儿”&“你能去哪儿”&“哪条路能最快到达目的地”
页面布局:将信息设计、界面设计和导航设计呈现出来,生成页面示意图/线框图Wire Frame
页面布局就是Skeleton这个阶段的最终产物