打字猴:1.700424093e+09
1700424093 用户体验要素:以用户为中心的产品设计(原书第2版) [:1700422498]
1700424094 指示标识
1700424095
1700424096 将信息设计和导航设计结合到一起,有一个重要的作用:支持指示标识(wayfinding),这是用来帮助用户理解“他们在哪”以及“他们能去哪”的系统。指示标识的概念来自于物理世界中公共空间的设计。公园、商场、公路、机场和停车场,大部分都从指示设施中获益。比如说停车场,有时候会使用“颜色编码(color coding)”,来为人们提供线索,帮助他们记住停车的地方。在机场,标志、地图以及其他的指示设施,帮助人们找到他们周围的路径。
1700424097
1700424098 在网站中,指示标识通常会涉及导航设计和信息设计。一个网站的导航系统不仅仅是要提供到网站不同区域的通路,还必须要清晰地传达出这些选项。好的指示标识能使用户能很快地得到一个心理图像,“他们在哪儿”、“能去哪儿”和“哪条路能使他们离自己的目标更近”。
1700424099
1700424100 指示标识的信息设计元素涉及页面元素,并不是以导航功能来执行的。比如说,就像停车场一样,一些网站非常成功地使用了“颜色标识”来告诉用户他们正在看的是哪个部分(无论如何,颜色编码几乎从来没有被独立使用过—相反,它用于在合适的位置强化另一套指示系统)。图标、标签系统和排版是另外的信息设计方式,有时用于帮助用户加强“你在这里”的感觉。
1700424101
1700424102
1700424103
1700424104
1700424105 用户体验要素:以用户为中心的产品设计(原书第2版) [:1700422499]
1700424106 用户体验要素:以用户为中心的产品设计(原书第2版) 线框图
1700424107
1700424108 页面布局是将信息设计、界面设计和导航设计放置到一起,形成一个统一的、有内在凝聚力的架构的地方。页面布局必须结合所有类型的导航系统,每一个旨在传达在不同结构中的视图设计;也必须结合任何一个在这个页面上的功能所需要的所有界面元素;还包括支持以上这些内容的信息设计,当然也包括在这个页面上内容的信息设计本身。
1700424109
1700424110 这一次需要平衡很多东西。这就是为什么页面布局被纳入一个详细的文档,并称为页面示意图或线框图(wire frame)的原因。这个线框图是对一个页面中所有的组成部分以及它们如何结合到一起的、最直观的描述(正如它的名字一样)
1700424111
1700424112
1700424113
1700424114
1700424115 线框图捕获所有在框架层做出的决定,并用一个文档来展现它们。它作为视觉设计和网站实施的参考来使用。线框图可以包括各种不同程度细节—你看到的这个是非常粗略的。
1700424116
1700424117 这些简单的线条绘制的图一般要着重注明、建议读者在必要的时候参考结构图表或其他交互设计文档、内容需求或功能规格说明,或者其他类型的详细文档。举例来说,如果一个线框图涉及个别已有的内容元素,它也许会给出指示,说明他们在哪儿能找到这些内容。另外,线框图通常还包括附加说明,用于说明在线框图和结构图表看得不太明显的网站行为。
1700424118
1700424119 现在,让我们再回去看看结构层的结构图示,它是这个项目的一个宏伟远景;而在框架层,线框图是正是展示那些远景如何完成的详细文档。线框图有时也需要导航规格的支持,以便能更详细、准确地描述各种导航元素的每一个组成成分。
1700424120
1700424121 对于更小或更简单的产品来说,一个线框图就足够作为所有即将建立界面的模板。对于大多数项目来说,无论如何,都需要用多个线框图来传达复杂的预期结果。不过,你不需要为网站的每一个界面都准备一个线框图。正如结构设计流程允许我们把内容要素总结成不同的类别或类型一样,一个数量相对较少的标准界面类型,将根据你的功能或导航的不同,在绘制线框图的过程中慢慢浮现。
1700424122
1700424123 线框图在正式建立网站的视觉设计的流程中,是必要的第一步,但是几乎每一个参与这个开发过程的人都会在其他任务点中使用它。负责战略层、范围层和结构层的设计者可以借助线框图来保证最终产品能满足他们的期望。真正负责建设这个网站的人,则使用线框图来回答关于网站应该如何运作的问题。
1700424124
1700424125 作为信息架构和视觉设计汇集的地方,线框图变成了争论和纠纷的中心。用户体验设计师抱怨创建线框图的设计师将导航系统背后的结构描绘得模糊不清,不能正确反映结构的基本概念。视觉设计师抱怨绘制线框图的用户体验设计师将他们的功能减少成一个数码绘画师的角色,浪费了他们为信息设计问题带来的、在视觉传达方面的经验和专长。
1700424126
1700424127 当你有两个独立的信息架构师和设计师的时候,绘制出成功的线框图的唯一办法就是“协作”。在共同协作做出线框图的细节的过程中,双方都可以站在对方的角度来看待件事,并且在这个过程中还有助于及早地揭示出问题(而不是到后来,在这个网站正在建设的时候,每个人都纳闷为什么没有像计划中那样运作)。
1700424128
1700424129 所有的这些使线框图听起来像是一件非常庞大的工作。这不一定的。文档本身并不是目的;它只是达到目的一种手段。为了文档本身而创建文档不仅仅是在浪费时间—它可能还会降低生产力和打击工作积极性。根据你的需求来撰写正确级别的文档(同时不要欺骗自己可以用较少的文档糊弄过去)才能将文档从一件麻烦事变成一件有益的事。
1700424130
1700424131 我曾经画过一些成功的线框图,仅仅是用即时贴和画在它们上面的架构就完成了。对于一个设计师和程序员座位紧挨在一起的小团队而言,这种级别的文档已经完全足够了。但是当程序员对整个团队负责而不是一个人的时候(甚至这个团队在地球的另一端)那么就需要一些较为正式的文档了。
1700424132
1700424133 线框图是整合在结构层的全部三种要素的方法:通过安排和选择界面元素来整合界面设计;通过识别和定义核心导航系统来整合导航设计;通过放置和排列信息组成部分的优先级来整合信息设计。把这三者放到一个文档中,线框图就可以确定一个建立在基本概念结构上的架构,同时指出了表现层的设计应该前进的方向。
1700424134
1700424135
1700424136
1700424137
1700424138 用户体验要素:以用户为中心的产品设计(原书第2版) [:1700422500]
1700424139 用户体验要素:以用户为中心的产品设计(原书第2版) 第7章 表现层 感知设计
1700424140
1700424141 在这个五层模型的顶端,我们把注意力转移到产品用户会首先注意到的地方:感知设计。这里,内容、功能和美学汇集到一起来产生一个最终设计,完成其他四个层面的所有目标,并同时满足用户的感官感受。
1700424142
[ 上一页 ]  [ :1.700424093e+09 ]  [ 下一页 ]