说实话，我的高中成绩并不是很好。有些课程的设计和教学太糟糕，经常让我变得迷茫又疲劳。课程内容淹没了我的大脑。学习过程很不愉快，结果在成绩单上也是显而易见。
说实话，我的高中成绩并不是很好。有些课程的设计和教学太糟糕，经常让我变得迷茫又疲劳。课程内容淹没了我的大脑。学习过程很不愉快，结果在成绩单上也是显而易见。
但是有几门课我做的很好，主要是教学风格的原因。现在我是一名移动端的用户体验和UI设计师。在某种程度上，也像是一名教师，要用易于理解的方式向用户呈现信息。我要考虑我的学生（终端用户）如何接受信息，所以这里带着这个目标反思一下高中学习的经验。
我的环境科学和代数课程就是两个极端的典型。环境科学课程给我留下了非常好的回忆。如果一个网站或者应用，能有我这个老师的上课方式一样简单、直观，我会非常愿意使用的。
但是如果一个应用像我的代数老师上课一样，就会很难用。我需要消耗一半的精力去理解如何使用，而不是拿起来就能用。下面来对比一下这两种体验。
一开始还感觉很好，黑板很整洁，老师写了一个问题，然后给出解题方法。“好，这个学会了。”然后慢慢地，黑板变得越来越杂乱。因为老师在黑板上的其他地方又写了一个问题，然后一个接一个。没有擦掉旧的问题将黑板清理一下，因此，黑板变得很杂乱。我还在想10分钟以前的一个问题，他的步调又加快，我跟不上了。我看看自己的笔记本，再看看黑板，仿佛不是简单的代数，而是在看量子力学。我感到很沮丧、很失落，几乎什么都没有学到。然后我就放弃了。
还是一样，一开始很好。我的老师投入了大量精力来安排材料和课程计划。她经常用投影仪，这样每次只展示一页内容，我喜欢这样的投影：把内容投射到教室墙上，让我们专注于吸收课程内容，不被自己课桌上的东西分神。她有独特的方式，用现实世界的例子讲授所教的内容，学习的内容不再感到抽象。我几乎能吸收所有教授的内容。这种使用真实世界的例子，并且是听众能直接联系起来的故事，这样能创造非常好的体验。
我的环境科学课程，明显就像一个精心策划，执行良好的网站或应用，有更好的教育性、娱乐性。老师对课程的设计，帮助学生避免超负荷的认知，让学生专注于需要学习的内容。
我现在学到了什么，怎样把这些应用到用户体验设计中？
1．教师和UX设计师是一样的
教师和UX设计师并没有太大的不同。教师的责任，跟UX设计师一样，都需要教学设计（instructional design）。换句话说，教师和UX设计师都必须做听众分析，避免把所有人都当做一个整体。教师要了解学生的课程水平、目标、能力、学习风格、技能差距和注意力范围，做教案满足每个人的偏好，消除可能的技能差异。还需要了解自己的学生能处理多少信息，以及何时提供信息。
受众分析能揭示很重要的信息，比如学生的目标、挫败、好恶。就像UX设计师，决定哪些内容是相关的，如何在视觉上呈现一样。然后他们设计出既满足学生需求，又不会超负荷的教案。UX设计师也是这样，只是产出的是原型图或者线框图。
２．学生和终端用户也类似
我在代数课上发生的事，用户每天都在面对，网站、Web应用或者移动用户都会遇到。用户访问一个网站，尝试一个应用，功能太多、太快地展示，让用户马上变得不知所措。很多时候用户只会感受到沮丧，想离开网站或者应用。对希望保持和转化用户的公司来说，这是最坏的消息了。
为了这篇文章的目的，我会大致地比较终端用户与学生。因为学生与用户不同，没办法换教师或者课程。但是相同的地方是，他们都需要从外部来源吸收新的信息，处理信息，最终拥有这些信息。
１．内在的认知负荷
这里指的“内在”是说一个任务或者材料固有的复杂性。简单地说，就是一些课程和内容比其他内容更难消化，内容越难，越有可能认知负载。
如果我的代数老师这样做会好得多：一次只展示一个问题，用均匀的速度解题，擦掉黑板再讲下一题，把讲解的内容投影出来帮助去掉重新记笔记造成的分心。
２．外在的认知负荷
这种内容包括多余的元素，如为文字配上没必要的图表，还需要额外的精力处理。还有需要用图表表示的时候用了文字，比如用文字解释正方形不如直接画出来，更快也更方便理解。
我的环境科学老师就避免了这些，她去掉了课本中累赘的内容，用简单的例子解释复杂的思想。
我们把这些认识付诸实践，来介绍下面的这些方法。用户访问你的网站或者应用的时候，怎样避免吓到你的用户。下面是关于在设计时如何避免认知过载的技巧和举例。
1．简洁
检查所有的内容，删除对用户实现目标不是绝对必需的内容。这意味着检查内容本身、内容数量，以及布局、设计和排版。干扰项和不相干的内容最有可能导致认知过载。
装饰图似乎使内容更有趣，但是需要额外的精力处理，增加认知过载。如果内容不符合教学目标，就删掉。运用你的判断力，同时也要注意品牌和设计美学，达到受众的期望。
好的例子
简洁版的 TED（右），是近年来网站 redesign 的好榜样。
与设计公司 HUGE 一起，TED 检查其网站的内容，听取用户的意见，开发出了感觉更个性化、更有探索性的新界面。TED 甩掉了冲击用户的多种类型的导航和过滤器。只挑选必要的内容，给界面更多的呼吸空间，有了更大、更整洁的文字排版，以及更大、更鲜明的图像。
这次改造是一次巨大的成功，网站获得了更多的访问量、更多的赞赏、更多的参与。怎样让人认识到简洁能吸引用户，让功能一目了然，而不是用内容的密度吓到用户，这是一个绝佳的例子。
2．信息分块
如果内容过于复杂，布局太密集，用户可能不会，甚至不想去理解内容。把复杂的内容分解成小块，让用户可以控制消化的量，能更有效地处理信息。
好的例子
Teehan + Lax 对信息分块做得十分出色。他们提升了这种多内容设计的标准，内容多又保持不错的节奏，直观的内容分组（包括视觉和分块），很棒的设计元素（如排版和颜色）。
Teehan + Lax 的 case studies 做得特别好，内容复杂，但是阅读起来轻松、愉快。设计师已经把写好的内容用大字体，有趣的时差滚动特效，惊艳的图形和颜色展示出来。Prismatic 页面就是很好的展示。
糟糕的例子
Y&R 的 “about us”是一个内容复杂，很难让人消化的页面。
这个页面的内容太密集，又有太多内容，容易让人分心。跟 Teehan + Lax 比较，就能看到分块设计好坏的区别。
使用重复的网格主题是个冒险的决定，这样让页面显得混乱。实际上“关于我们”的内容是埋在相关文章和快速链接的大方块下面。字体太小，对齐方式和宽度一个页面变换了三次。太多随意杂乱的图片出现在页面上，又跟内容没什么关系。而“相关内容”链接，出现太多次而且看起来像是随意放置的。所有这些让人分心的内容，强制用户先学习理解页面的布局，才能找到实际想要看的 Y&R 的企业文化。
3．有创意
用不一样的方式展示信息。因为网页是用来看的，试试用图形展示内容，例如图片或照片。这是利用大脑处理信息的方法不同，吸收内容的同时释放用户的头脑，从而降低认知负荷的好方法。最重要的是，设计有意义的方式呈现视觉效果，不要用非主流的设计让用户产生挫败感。
好的例子
精心制作的年度报告，配合有创意的信息图表，华丽的照片和插图能抓住读者的注意力。虽然是数字内容，他们坚持使用已经被很多人遗忘了的印刷祖辈的原则。飞利浦2013年度报告是一个很好的典范：小块的标题和内容、有意义的照片、简单的信息图和良好的布局，帮助用户顺利地吸收信息。
Philips’ annual report for 2013
飞利浦的设计师和文字作者，采用了非常有创意的元素并且用了信息分块。信息架构的的设计，让用户可以通过“Read More”找到新文章，而不是把所有内容都挤压到一起。
糟糕的例子
通用电气2012年度报告也用了时差滚动的故事板形式。不幸的是，这并没有成功地防止认知过载。一开始还好，但是到了“Letter to Shareowners”部分，文本的数量变得势不可挡。即使搭配了信息图和图片，小字体也会让股东一次看到太多信息。如果内容不能减少，起码可以多编辑一下，辅助导航、清晰的标题、合理的分割都会让内容更容易消化。
通用公司赢过设计大奖，他们的年度报告一开始还好，但是从“致股东的信”开始，展示给用户的信息太多，不能消化。
4．保持故事的趣味性，去掉冗余
设计师和策划很容易进入模式化，使用模板的好处有很多，容易编写、设计和开发。特别是要处理多种内容的时候，比如产品介绍和公司部门介绍。同样的模板能让用户意识到正在看什么内容。
另一方面，当每一页的内容都基于同一模板，很容易变成重复。因为每一页都同质化，独特的内容就没有了，给用户造成的感觉就是冷漠、暮气沉沉。为了解决这个问题，可以制作高级的设计，从头到脚都独一无二的页面，让用户保持兴趣。
好的例子
苹果的产品展示页面使用整体的模板和设计风格，又没有感觉重复或者平庸。MacBook Air、MacBook Pro和 iMac都有相同的二级导航、照片和排版风格。但是每个产品都有独特的、新鲜的布局，与用户产生连接，避免认知过载。
苹果官网每个产品都有独特的布局，但是采用同样的设计风格和模板。
糟糕的例子
当然，Sony 的产品目录比苹果多得多，更愿意使用产品模板。使用这种模板，页面变得容易制作，写文案、开发和批量更新都简单。但结果却是失去个性，页面同质化。用户可以方便地阅读和理解内容，但是失去激情。这种激情和能量，苹果最为典型，能抓住用户的注意力和关注点（学习过程中重要的两点）。
Sony 的产品页面采用同样的模板和布局，用户更容易阅览和理解，但失去了激情和个性。
5．多媒体化
当文字与图形结合时，能更好地理解内容。要注意明确两者的关系，要把文字嵌入图形，或是并排摆链接文字放。
好的例子
Airbnb 是充分利用多媒体的典型。普通生活场景的影片在首页循环播放，配合大标题下的“Welcome Home”。人们往往会被视频吸引，所以这种方式（包括上面的标题）非常成功。
Airbnb 的日常生活影片，配合有力的“Welcome Home”标题，非常吸引人。
糟糕的例子
另一家公寓共享公司——HomeAway，没有像 Airbnb一样打动人。HomeAway有一个静态的图片和标题 ——没有动静、没有活力的内容，迫使用户花额外的精力来确定，什么是推广，什么是相关内容。当两个网站都是相似的精心设计，任何额外的精力花费，都对用户有负面影响。
HomeAway有一个静态的图片和标题，缺少移动内容，缺少活力，不能全力吸引用户。
（译者注：现在已经跟本文写作时感觉不同了。第一，现在访问Airbnb网站是幻灯片式图片切换，不是视频。第二，HomeAway网站上的静态图片和上面的查找框区别分明，没有产生混淆。）
6．遵守基本的设计原则
好的设计师都会本能地理解下面的原则，但还是要在这里列出来，因为它们对内容展示和用户体验非常重要。
好的例子
Big Human 为 Time 完全重新设计的网站就是一个很好的例子。它集合了多种优秀的设计，简直就是上述原则的教科书般的重现。该网站易于阅读，很大程度上是由于合理留白，大小合适的字体，垂直以及基线网格。结果是，内在复杂的内容没有让用户信息过载。用户可以轻松地区分头条、导语和段落，并给出相当多的选择，但又最大限度地减少认知过载。
糟糕的例子
New York Post 还在为 Time 已经做好的事挣扎着。布局是由平淡的图片组成的网格，图片上覆盖的字体很难看清，缺乏留白，让用户不容易导航和阅读。总体布局偏向于认知过载。大量的照片、重复的字体风格和很少的留白，用户很可能对这种展示方式不会有很好的反应，甚至会关掉网站。
Time网站清晰，字体易读，大量留白。New York Post网站不够清晰，字体少，留白少。
我以前的环境科学老师可以成为一个扎实的UX设计师。她了解自己的目标受众，知道如何与他们取得联系。她的教案很干净、周到，为复杂的内容设计了合适的视觉效果和支持文档，帮助学生吸收知识。
设计网站或者教案的时候，遵守这六个准则能最小化认知过载，让你的用户或学生更容易接受，更开心。要想简化和分块的信息，消除多余的内容，减少重复，请遵守上面的设计准则。
参考资料
1．UX： User experience，User experience design（用户体验设计，以用户体验为中心的设计）。
2．认知负荷理论
http://baike.baidu.com/view/1914460.htm3．instructional design 教学设计的定义。
教学设计：教学设计涉及的内容有鉴定特定群体的知识、信息和技能差别，创造或者选择合适的学习体验弥补这个差距。教学设计基于认知心理学、教学理论还有最佳实践。
本文由Smashing Magazine独家授权异步社区发布简体中文版。版权所有 禁止转载或建立镜像。