17-整合视觉设计about face4
看了about face4一段时间了，感觉看书不做笔记不输出就像白看了，所以学些总结学着做一份笔记，也是借由这个机会督促自己看下去看完。有参考网易云课堂的这个视频讲解系列，看一遍视频再看书效果会比较好，视频的内容非常的精炼，看书的时候正好可以把不懂的地方或者一些一句带过的细节看一遍。目前的这个结构还是书中原本的结构，有少部分也做了概括。
一、视觉艺术与视觉设计
艺术家：表达自我。限制越少越好。
视觉设计师：清晰沟通。（目标导向的方式）努力以易于理解和使用的方式来呈现行为和信息，支撑组织的品牌目标及任务角色目的。
二、视觉界面设计元素
网易云课堂一起学习about face4截图
除了上面这几个还有情景。用户使用产品的环境，黑暗？光亮？走动？坐地铁？边坐家务边使用？把这些当作限制条件去考虑视觉设计。
大小：大小属性在传递层次的时候很重要。大小差异足够大的话完全可以吸引注意力，有序（人们会按照物体的大小排序）和量化（倾向于给这些差异赋予相对数量）变量。
颜色（色相、明度、纯度 ） 色相：色相的巨大差异能够迅速吸引注意力，色相不同各国的含义也均有不同，色相不是有序或者量化的，行业里会计认为红色负、黑色正，证券蓝色买、红色卖这个可以用。明度：对于突出的元素，明度深浅是吸引注意力的好工具。纯度：纯度跟色相明度一样也是吸引注意力的好工具，与较高的明度密切相关。
位置：位置是有序和量化的变量，有利于传达层级消息，F型的阅读顺序，重要内容放在左上角，屏幕上聚集在一起的元素可以当做是相似的。
动效：运动的东西／元素可以迅速吸引的注意，随时间的变
形状：
形状是认识一个对象是什么的首要方式，人们倾向通过轮廓来识别对象。如果目的是抓住用户的注意力则形状不是最好的表达方式。
纹理：纹理能够成为重要的能供性信号，阴影看上去可以点击，恰当的使用纹理能够改善用户界面的易学性。
文字：英文避免全部使用大写，要付出更大的注意力。使用高对比度的文字，80%的对比度；选择恰当的字体和大小，无衬线字体在屏幕上更容易阅读，衬线字体使用平滑技术来缓和，小于10px最好使用锯齿无衬线字体；简洁组织文字。
三、视觉界面设计原则
1、传达风格／传播品牌
在开始设计产品界面之前要理解品牌调性。例如photoshop与creative suite相似与adobe其它的应用软件相似，可以看出是一家的产品；outlook与office其它的产品也有相似性；apple系列产品也是。这种相似性可以理解为品牌的调性，设计在此基础下展开。不过一旦产品线非常多涉及到不同领域似乎就很难把握了。
词云／关键词。也就是一组形容产品的词汇，一般在产品设计开始时期会概括出产品的几个特性然后围绕这几个关键词去展开，确定一些颜色、设计风格走向。
2、带领用户厘清视觉层次
用户界面需要创建清晰的视觉层级。使用基本的颜色、大小、位置这些视觉元素区分层级级别，减弱不重要的视觉元素。
建立关系。经常使用的元素可以放在一起减少鼠标移动，可以让用户清晰地知道这些任务、数据、工具是关联的。不必同时使用但具有相似功能的可视觉上组织在一起。
3、在组织的每一层提供视觉结构和流
屏幕上的每一个元素都要尽可能的水平或者垂直对齐，谨慎做出不对齐元素的决定，实现差异化效果。可通过控制各个元素的视觉重量来实现不对称平衡，眯眼测试。
良好的网格是模块化的，足够灵活、适应变化、保持一致性。布局可精确到屏幕到50%、20%、三分之一，让这种比例很突出、干脆、明确。设计良好的网格可以提高屏幕的可读性，用户可以快速的学习和找到界面元素，减少界面设计的迭代，方便修改和扩展。
布局上构建出高效逻辑路径，F型阅读顺序，从上到下从走到右。相同的元素相同的位置，重要元素次要元素辅助元素之前的流动要有序。
4、在特定屏幕上告诉用户能做什么（能供性）
能共性分解成设计布局的空间和内容分类、图标、视觉符号，以及在可能时预览视间距效果。视觉上将相关功能分组，提供空间上的使用情境。
效率类的程序使用精确、保守渲染的图标更合适。图标同时表达动作和动作施加的对象更容易理解，在图标下标注文字或者提示。注意一些可能会发生各国家歧义的动作图标。
视觉上不同的符号代表不同的对象类型，如单选、复选、滑块。用视觉元素向用户传达结果，尽可能提供预览，可以让用户可以清晰的知道不同设置／功能带来的不同，如改变字体大小之后马上就可以看见，也有些比较复杂的像word里面的边距预览可以直接看出不同。
5、响应命令
hover、click后用户需要看到某种响应。
0.1s－1s之间，提供细微的视觉线索。
达到10s提供线索告知延迟，如使用循环动画和估计使用的时间。
大于10s，显示提示解释原因，显示运行进度更新，配上有礼貌的提示，让用户可以返回任务。
6、把注意力吸引到重要事件上
智能手机上的通知栏可以让用户知道一些信息。吸引力的机制不在我们的意识控制之下，在屏幕上用强烈的对比来呈现就能把用户从现有的工作中吸引过来，但要注意合理使用，误用会显得粗鲁。
7、保持简单 最小化视觉工作量
使用简单的几何形状、有限的色盘、颜色以较为不饱和的颜色或中性颜色为主，适当加入高对比对颜色用来强调。
任何的差异的存在都要有足够的理由，如无必要则可以舍弃。如间距、字体大小差距比较小的时候调成统一。
用最少的视觉和功能元素发挥最大的效能。“杠杆”在界面中使用一个元素来表达多重相关的意图。一个按钮下展开有多个相近的功能。
四、视觉信息设计的原则
“将清晰的思考视觉化”在充分理解观看者的认知任务和遵从一些设计原则才能设计出优秀作品
加强视觉对比。同一个对象不同操作后的前后变化提供预览，同一对象不同时间维度的变化曲线。
显示因果关系。信息图形中，阐明原因和结果，告诉用户其行为的可能结果或提供如何完成操作的暗示。
显示多个变量。在不影响清晰度的情况下，显示多个变量，用户可以选择开启关闭其中的某个变量，使对比更容易，相关性更清晰。
在一个界面中整合文本、图形、数据。多个维度更易于用户理解信息，是高效率的结合。
确保内容的质量、相关性、完整性。高质量的内容利于用户增加信任感。
在相邻空间上显示事物，而不是按时间堆积。静态信息显示，使用动画会更有效地呈现时间轴上的变化。
可量化的数据就要量化。如饼状图能让用户更好的理解相关数据。
五、一致性和标准化
一致性意味着产品的不同模块要有相似的外观、感觉、行为。如苹果微软都乐于鼓励自己的开发人员和第三方开发人员创建运行与自己平台外观感觉都很像的程序，为用户提供无缝而舒适的用户体验。
益处：减少错误、提高产出，提高易用性和易学性；利于软件开发商，降低客户培训技术支持的费用，减少开发时间和工作量；降低维护费用，提高设计和代码复用率。
风险：标准一般强调的是界面外观和感觉，很少涉及到界面更深的行为、高层次的逻辑、组织结构，同时也缺乏使用情境。
界面标准适合作为具体的指导准则和经验法则。因为现有的规范也会不断的修改完善。
打破：当习惯用法被目标用户使用后，大多数人认为明显更好，就是将其用于界面的最好理由。
一致性和标准：一致性并不代表僵化，特别在一致性不恰当时，界面和交互风格指南必须随着软件成长、演化。一个公司多种软件产品时候要考虑的问题。
设计语言：编写风格指南有助于设计师合理和简化设计语言。最好的设计语言以用户为中心，在产品设计过程中演化。如微软metro设计语言的磁贴tiles 网页和移动端均有用到。
