jerry的交互设计

一、概念

A、信息架构 (information architecture) [名词]

什么是「信息」？

信息，数据与知识。 数据是事实和数据；知识是人脑中的东西；信息正好处在数据和知识之间的混乱地带。

因此，信息架构的工作在本质上就是将一些数据转化为让人看了或是接触了就可以转化为知识的东西，或者是将某种知识化为数据，让知识可以传递，再利用，或是两者都兼具的设计过程。

而架构呢？简单的说，它包含三件工作：

1. 架构设计 (Structruing) –首先他必须决定网站中信息的单元 (atom) 的大小 (或是称为粗细程度, granularity)，并决定这些单元之间的关系。

2. 决定组织方式 (Organization) — 将这些组件组合成有意义的，具有特色的类别。有时又称为逻辑分类。

3. 归类（Labeling) — 给这些你所产生出来的每一个类别一个合适的名称。

B、信息架构，即信息组织的方式结构，在网站里，信息架构是一个站点对内容进行分类，并且建立交互来导航这些内容的设计。

一个有效的信息架构可以让人们按照逻辑直观的，毫无阻碍的一步步地接近他们需要的信息。而设计网站信息的分类，页面的位置，并且协助设计师和程序员完成系统，建立这个有效的信息架构的人，就是信息架构师。

大多数人只有在找不到他们所需的信息，或者在寻找信息时出现困惑了，才会注意到信息架构的存在。（这意味着你在使用一个设计良好的系统时，感觉不到阻碍，也就不会注意到信息架构的存在）

二、信息架构设计的思考方式

1. 自上而下，在定义网站的整体结构前，先广泛了解商业意图和用户需求，最后来才考虑具体内容之间的关联。

2. 自下而上，先理解内容的联系，通过遍历，剧情设计等手段，让该系统能够满足特殊用户的需求，然后才考虑更高层次的结构需要支持这些需求。

在一个完整的项目实施过程中中，这两种方式都很重要，忽略前者，网站内容组织可以很好，但是并不一定符合用户需求，忽略后者，用户可以容易找到他们需要的东西，但是很难有机会接触到相关的内容。

三、分阶段的方式建立有效的信息架构

1. 理解客户需求，背景和用户需求，阅读所有的现有文件，与利益群体作沟通，并且做出内容清单。

2. 引导测试用户参与卡片分类活动。

3. 通过卡型分类活动评估之前设计的分类，从中寻找分类的趋势。
合理划分类别的重点和相关的次序，通过分析找到工作流程的梳理过程。

4. 做一个信息架构的草案出来。

5. 使用卡片评估的方式来测试设计出来的架构。
我们的卡片是每个流程的重点，信息架构草图是流程的框架，两者结合验证工作的重点是否有偏离；有计划还可以请相关人员进行可用性测试，对用户角色调研起到很重要的补充；

6. 不要对第一次设计就成功带有过多的期望，寻找合适的措辞和分级可能会需要好几次重复的设计与评估。
可以分三次考虑，首先，初稿，了解信息架构的粗框架，类似与uml图示；

再次，从下到上的梳理用户的需求和流程的衔接；

最后，从上到下，整理导航和系统使用框架，确定信息架构；

7. 把信息架构记录成网站的地图，当然这不是最终的网站地图，只有页面设计都完成以后，网站地图才会定稿。

8. 使用剧情设计测试你的网站设计。(情景模拟)

9. 让开发团队的其他成员也参与剧情设计和遍历，并且与他们分享测试的结果。

10. 如果有可以，在进行正式开发之前，多做一些纸面原形或者低拟真原形的测试。.
通过visio制作demo

11. 建立一些文档，把关键的用户操作点都标注起来，这样可以给视觉设计和程序开发人员一些提示，保持开发能够充分利用前期设计的结果。

四、设计过程中的产品

有很多方法来记录信息架构设计的结果和收获，这里有几种常用的：

1. 网站地图，它可以很好的表述一个网站的组织结构，但不一定要反映导航的结构。

2. 带有注释的页面设计，页面设计决定了页面上的导航，内容，功能等元素，视觉设计和程序开发者可以根据这些注释更好的理解设计意图建立整个站点。

3. 内容矩阵，站点所有的页面都放在一个内容矩阵里，并且为每一个页面都定义了应该显示的内容。

4. 页面模板，页面模板在设计大型的站点或者企业内部站点的时候才会需要，它定义了某一类页面的内容的类型，全局的导航，栏目内的导航灯等。这个东西使用最多的就是CMS，内容管理系统。

五、设计过程中的副产品

1. 角色，角色设计为系统的设计提供了典型的用户目标，它能够把用户研究的开销缩减的最小。

2. 原形，这是最终作品的模型，原形可以很简单，简单到用几张图片来表示未来复杂的网站（低拟真度原形），也可以比较复杂，拥有最终产品的一样的交互能力（高拟真度原型），纸面原形的测试效果其实已经很不错了。通常原型设计会让整个信息架构活起来，所以，请尽量在设计定稿前多做原型的测试！

3. 剧情，剧情设计时另一种可以让信息架构设计活起来的技术，它模拟了一个用户执行具体任务时如何体验整个信息架构的过程，也能够让团队的其他成员很好理解设计的意图。

补充下：

想了解信息架构是一个过程

1. 了解为什么要做信息架构

2. 弄清楚为谁做信息架构（包括使用者与提供信息者）

3. 透彻地了解你要处理的数据以及所需要的数据以及各样的内容

4. 设计结构

5. 决定组织方式

6. 归类与设计浏览机制

今天上海太平洋设计部，制作部，技术部举办了一场户外大型活动——“共青森林公园”烧烤。

烧烤一项蛮有意思的团队活动，大家的目标都很一致，都为了烤出最美味的食物。我们以小组的形式活动的。所以竞争让这个游戏更加有趣。除此之外，因为烧烤的技术含量也不是很高，大家成长起来也很快，通常第二批烤的食物就比第一批要好很多。很多人可以很快从烧烤菜鸟变成别人口中的“大厨”。品尝自己的劳动果实，和享受别人的赞誉可以给人们带来满足和喜悦。

我被安排的任务是采购公共设备（这个工作一共3人完成）和协助我组组长完成烧烤。整个烧烤过程都是充满笑声的，大家都玩得很开心。要求自己仔细观察生活的我，看到了这次活动中的一些瑕疵，在这里总结了一下经验。

1.前期规划

由于活动是多部门的，分组式的。所以前期的规划一定做好，我们这次的规划还是蛮不错。首先确定活动人数非常重要，这决定了采购设备和食物的数量，和活动的场地，和预算。其次是明确每个人的职责。谁是那个组的组长，组长和组员的职责是什么（当然不用像员工手册那么具体），这关系到后面活动的安排和开展。比如谁先去占地方，谁负责采购。

2.采购

个人认为采购也是烧烤最重要的一个环节，它直接影响到整个烧烤过程的质量和效率。我这次的采购包括两部分，公共设备的采购和各个小组内各组的采购。我们是这样安排的：抽三个人（离活动地点比较近的）在活动当天负责公共设备的采购。我们有一份采购清单，上面有所需购买的东西。关于采购清单，最好能标注出购买的大概数量，特别是当采购员对烧烤没有什么经验时。比如说需要买多少木炭，多少炭精。我们这次活动因为没有标明数量，所以在考虑买多少的问题上也花了不少时间。采购物品的时候应该以烧烤行为为中心进行思考：

（1）烧烤架是否适合烧烤场地和人数，比如说有些可以烧烤的公园是不允许带自己的烧烤用具的；或者烧烤用具需要工具（螺丝刀）安装；烧烤架最多可以几个人一同操作；烧烤的地方是否有风。

（2）采购烧烤的能源，通常有木炭，炭精，如果对生火引碳不是很有经验的话，酒精是比较方便的生火工具。扇子在前期也挺重要的，当然有可以扇风的东西替代也是可以的。

（3）采购的食物应该尽量选择已经处理过的，比如腌制好的、已经调过料了。或者提前买好处理好也可以的。但不要等到烧烤的时候才准备清洗、切割和腌制，这就太迟了。试想大家都闻着附近其他人烧烤的香味，而自己的食物却迟迟不能吃是件很痛苦的事。在采购食物的时候还可以购买一些可以直接食用的蔬菜。比如我们用生菜来包住烤出肉享用，这可是相当好的主意。

（4）采购调料，应该选择易与烧烤操作的包装。比如盐，孜然，胡椒，辣油。最好是哪种带有小空可以喷洒的那种小瓶装的，而不是那种袋装的或大瓶装的。在烧烤的过程中，用带小空的小瓶装的胡椒粉给食物添料绝对会比用袋装胡椒粉操作起来更容易控制使用的量。而且这样的包装也容易管理，袋装的盐用过后，很容易撒出来或者被打翻。

（5）采购餐具和辅助设施，一次性碗、杯、筷、竹签、桌布（最好是加厚的，这样不会被风吹得乱七八糟）都必不可少。除此之外，还有刀，一次性围兜，刷子，纸巾，湿纸巾，旧报纸

3.进行烧烤

（1）进行烧烤前，要把采购来的物资进行按组分配，而不是把所有的东西的都放在一起，等到要用了再去拿，这样可以提高烧烤的效率。

（2）烧烤的第一关应该是生火引碳了。要让碳燃烧起来首先要让它能够接触足够的氧气，所以如何摆放碳也很有讲究，我们的经验是把引火的东西放在碳的下面，将碳架空起来，然后通过扇风增加碳与氧气接触的机会进行生火引碳。这次的活动没有买酒精，我想如果有酒精就会方便很多了。

（3）分工合作，负责管理火源和补充碳的人与负责烧烤上料，刷油的人共同合作。管理火源和负责加碳的人往往都是弄得灰头土脸的，十指乌黑。他们并不适合负责管理食物。负责烧烤的人应该专心的对待食物，很多食物很容易烤焦，所以要将食物不停的翻身和刷油，为了能让食物更入味，负责烧烤的人还需要用到将食物多划两刀。我们这组的人员安排是，一人负责火源，两人负责食物的烧烤，我负责吃，哈哈….

（4）交换各自组的食物，增加组与组的互动。分享和竞争可以使得烧烤变得更加快乐，将自己组得意的食物和其它组分享，努力将自己组的食物烹调出比其它组更优秀的食物会使烧烤变得更具参与性和互动性。除此之外，最好不同组买的食物都略有不同，这样任何一组就算烧烤技术再差也有自己独有的美食。

（5）烧烤的安全，烧烤中可能会有意外，比如说烫伤或者被餐具划伤，所以准备一些用于应急烫伤和划伤的医药物品可以有备无患。

（6）烧烤的善后，通常指定的烧烤地点都有人负责烧烤的善后，不需要活动者做这些工作。但我觉得善后工作往往体现了一个团队的素质和修养。烧烤完成后我们应该处理好剩余的木炭和烧烤过程中产生的垃圾。我觉得这次的活动在这个环节我们做得还不够。

昨天在和死猫聊天的时候谈到了SNS。之前对SNS的理解就是社区类网站。今天在百度百科里看了关于SNS的一些介绍，对SNS又有新的认识。

这里摘录了一些对与SNS基本的介绍，全部文章可以去百度百科里搜索

———————————————-

SNS：Social Network Software，社会性网络软件，依据六度理论，以认识朋友的朋友为基础，扩展自己的人脉。并且无限扩张自己的人脉，在需要的时候，可以随时获取一点，得到该人脉的帮助。

SNS是一个采用分布式技术，通俗地说是采用P2P技术，构建的下一代基于个人的网络基础软件。SNS通过分布式软件编程，将现在分散在每个人的设备上的CPU、硬盘、带宽进行统筹安排，并赋予这些相对服务器来说很渺小的设备更强大的能力。这些能力包括：计算速度，通信速度，存储空间。

社会性网络（社会网络，Social Networking:SN）：是指个人之间的关系网络,这种基于社会网络关系系统思想的网站就是社会性网络网站(SNS网站)。现在许多WEB2.0网站都属于SNS网站，如网络聊天（IM）、交友、视频分享、博客、播客、网络社区、音乐共享等。社会性网络的理论基础源于六度理论（六度分隔理论，Six Degrees of Separation）和150法则（Rule Of 150）。

SNS的技术起源：在互联网中，PC机、智能手机都没有强大的计算及带宽资源，它们依赖网站服务器，才能浏览发布信息。如果将每个设备的计算及带宽资源进行重新分配与共享，这些设备就有可能具备比那些服务器更为强大的能力。这就是分布计算理论诞生的根源，是SNS技术诞生的理论基础。

SNS的商业空间：当普通人通过安装SNS软件都可以拥有媲美网站服务器的计算及通信资源时，那些投资了大量服务器的互联网公司将怎么办呢?他们的优势在什么地方?会不会有更多的新型的互联网公司出现，而且他们的后台他们的前端有没有可能完全不是现在的Google、EBAY、新浪模式呢?甚至包括盛大网络游戏这样的运营商，他们引为骄傲的强大的3万台服务器集群，是不是他们的核心竞争力呢?当一个漫画作者家里的那台机器，就可以让他通过SNS视频器播放他的作品，他还需要去管理一个网站吗?或许一个家庭主妇不需要懂得Html编程，不需要懂得网站这个词汇，只通过SNS菜谱发布程序及一台厨房里的PC就能让千百万人掌握她的手艺，而且她在厨房的灶台上的一招一式都清晰可见。这个时候，您会想到什么? 现在的互联网中，作为客户端的我们就像个蠢蛋，只能通过服务器才能干些奴隶般的事情，看别人的网站，玩别人的游戏，发发邮件，除此之外，我们没有自由。现在是开始革命的时候了!革命中心任务就是：如何让10多亿台电脑发挥他们自己的作用，让用户去创造和控制自己的信息。中间不需要公司的服务器来摆布我们。

SNS网站：就是依据六度理论建立的网站，帮你运营朋友圈的朋友。六度关系理论：美国著名社会心理学家米尔格伦(Stanley Milgram)于20世纪60年代最先提出，在人际脉络中，要结识任何一位陌生的朋友，这中间最多只要通过六个朋友就能达到目的。就是说你想认识一个人，托朋友找朋友找认识他的人，之间不会超过六个人。

现实社会中，人与人的交流是通过人与人之间的介绍、握手来形成一个朋友圈、联系圈的，每个人不需要直接认识所有人，只需要通过他的朋友，朋友的朋友，就能促成一次握手。而普通的网络交际，则大多数通过某些平台来实现，比如将自己放到一个平台中去，让很多人看到，并且联系你认识你。两者的优缺点明显，社会性交际优点是可靠，彼此关系建立在可靠的人际网络上，缺点是产生握手的时间长、代价较高；平台式的网络交际优点是成本低，但不可靠。
那么在网络中将这套机制拷贝，即在理论上，获得可靠与低成本的双重优点。还有一些优点就是，SNS中，在朋友圈内关系往往真实度很高，非常可靠，互相之间不存在所谓网络的“假面具”，因此，比较容易实现实名制；sns基于人传人联系网络，一传多，多传多，利用网络这一低廉而快速的平台，网络建立的速度会非常快，这又使得建立人脉网络的成本进一步降低。

先说个题外话，其实有关web2.0，除开技术细节，完全由网民去发表内容、形成舆论，在我看来，并非完全行得通。如果是服务信息性的还好，但敏感信息呢？把舆论不加控制地放任自流，在一个完全理想化的民主社会是可能的，但目前还不行，这里面有多种原因。并且，网民实名制目前未能推行，每个人在网上说话不需要负责这种想法到处都是，如何控制不负责任的言论？所以web2.0在现实环境中，不可能放得很开。
说了这么多题外话，其实只是说，如果真要做不需网站管理员控制的言论网站，SNS算是一个较为理想的web2.0手段。理由很简单，SNS较为贴近实名制，线上线下的身份比较一致。由此可看出来，SNS是未来一个有前景的东西，至少在国内是如此。这方面的市场缺口很大，既然传统媒体都转向网络了，社会交际，又如何只能光靠见面吃饭打电话呢？

目前国内主要的SNS应用网站有以下几种类型:

平台类:
腾讯QQ.com：以即时通讯为基础的SNS平台
百度baidu.com：以搜索为基础的SNS平台
阿里巴巴alibaba.com：以商务应用为基础的SNS平台
一起网yiqi.com：以开放式社会化网络结构为基础的SNS平台(待实践证明)

商务类:
诺邻Wealink：工具化SNS
天际Tianji：特色不明显
联络家Linkist：工具化SNS
海内hainei： SNS社区

社群类：
宅啦网（Zhai.La）：面向时下最流行的宅人族的SNS交流平台

校园与娱乐类:
Xiaonei，占座，51.com，Ipark

新生网站介绍:
zhsns.com(中国SNS网(企内网),采用Ucenter Home程序,主张以校内网为榜样,打造商海中的企内网.)
六度网 (程序未知 )

———————————————-

托CC的福，我有机会可以参加 IxDA Shanghai 的这次聚会。我那糟糕的英语让我有点担心那天的沟通，但还是很期待。

这里帮助宣传一下 IxDA

第二次参加书友会，觉得这次的人数比较合适，大家都有发言的机会。在这里表扬一下CC，她带病（口罩）出席，还担任摄像这样重要的职务。虽被sky说成擎天柱（女版），仍然坚守岗位，完成了这次书友会。这让在场的人无不眼眶湿润，我更是老泪纵横。这次书友会还认识了新朋友（新对手？）。

这次的话题是"排序"。个人认为这个话题比较宽泛了，不容易做功课，也不容易讨论。看了讨论组中白鸦介绍北京讨论的重点，感觉他们的更加具体些。很期待他们的成果。上海这边也讨论了一个具体的话题，就是在分页条件下的用户自定义排序。

我整理的内容稍后放出。

        1.TIME时代
　　美国1923年创刊www.time.com
　　即便是它在今年的美国“国家期刊奖”中一个提名也没有获得，话语惯性与品牌传统以及以红框构成的各式封面积累仍然维系着《时代》的地位。的确，品质沉淀是这本至尊杂志的最可贵底蕴，每年年底的“年度风云人物”评选也许永远都是其最荣耀的时刻。
　　
　　2.National Geographic国家地理杂志
　　美国1888年创刊www.nationalgeographic.com
　　财力物力惊人并不是造就《国家地理杂志》殿堂的根本，不懈的职业态度与拓展性极大地推动了这本超级王牌杂志发展，国家地理频道以及众多衍生产品共同织造着其殿堂的不断扩充。新作“泳衣百年”特刊，显示其锐意改革切合时下市场的难得新派作风。
　　
　　3.FORTUNE财富
　　美国1930年创刊www.fortune.com
　　为全球人熟知的两个杂志运营品牌“财富论坛”和“500强”仍然在继续维持着它们在财经领域的话语霸权。杂志本体操作得仍然让人看不出其有任何老态，即便是在前些年那些锐意改变一切的新经济杂志面前，《财富》仍然保持着可贵的新鲜。
　　
　　4.VOGUE
　　美国1892年创刊www.vogue.com
　　老牌VOGUE的时尚集团地位已不容置疑，在学者中，VOGUE亦已化身为时尚影像历史的代表物。VOGUE在意大利获得更值得称道的发展，结合ITALY人的时尚与热情诞生了时尚杂志超级模范，VOGUE ITALIA发展至今已经建立了5本同样出色的子刊，昭示着VOGUE的惊人魅力。
　　
　　5.The Economist经济学家
　　英国1843年创刊www.economist.com
　　其严谨作风已使其成为这个时代最值得信赖的政经观察家。在全球范围内搭建的观察员队伍素质超群，并在其每年年初发布的全年预测中组成强大的战线；组建各种研究工作机构监测各个经济地区的营商环境和人居环境，都在散布着这本杂志的话语权。
　　
　　6.PLAYBOY花花公子
　　美国1952年创刊www.playboy.com
　　仍然是知名度极高的老牌杂志，有着51年历史的成人杂志，如今更有改版做主流男人杂志的决心，值得尊重的传奇创始人海夫纳是否在考虑PLAYBOY品牌难得，资源优势不应是耗在与《阁楼》以及新兴的MAXIM上？应该更明确地去追逐主流广告商？
　　
　　7.VANITY FAIR名利场
　　美国1913年创刊www.vanityfair.com
　　依然出色地扮演着“从新星到巨星”的全球最华贵舞台提供者的角色，更让人佩服的是，它在国家杂志评奖中在最佳杂志、摄影、专栏、随笔和评论上均获提名。这种浮于华丽世界中却扎实经营杂志本体的内容建设的用心值得称颂。
　　
　　8.Newsweek新闻周刊
　　美国1933年创刊www.newsweek.com
　　相信没有人会忽视这本新闻杂志这两年在新闻报道上作出的富有开拓性的贡献，独家、周密、侧击、旁敲、独到、新知等各种报道模式层出不穷，市场上更积极地开拓着远东市场，学术上在美国期刊奖中屡有斩获，影响力正飞跃提升。
　　
　　9.ELLE
　　法国1945年创刊www.elle.com
　　国际版本达70份的惊人扩充能力，代表着法国桦榭集团的最强实力。相对于VOGUE与Bazaar的较年轻作风，以及贴近时下年轻女性的时尚需求，加上“女性都向年轻看齐”的心理暗合自然法则，ELLE全球开花的经济效益策略正日见其影响力。
　　
　　10.WIRED连线
　　美国1993年创刊www.wired.com
　　曾经被视为是新经济杂志一员的《WIRED》如今证明了它更重大的贡献在于培养了一大帮“技术派”，这本杂志崇尚无线技术及数码并长期坚持此道，实在值得大批数码热血青年的热烈追捧，文化评论家已经把它等同于1960年代由《滚石》带动的一代。
　　
　　11.FHM男人帮
　　英国1985年创刊www.fhm.com
　　近年全球杂志界扩展速度最神速的杂志之一，英国Emap杂志集团的先锋，凭借最畅快淋漓的编辑思路迅速拉拢男性读者的兴趣，俨然成为男人阅读市场这两年来最叱咤风云的新力军。宛如电视传播方式的全新杂志编辑思路如今已经深受追捧。
　　
　　12.THE FACE脸孔
　　英国1980年创刊www.ukmagazines.co.uk
　　以颠覆效果著称的英国青年时尚文化杂志，在1980年到2003年间坚持不懈地在青年文化运动中作着The Face式的发言。今年更在Neil Stevenson领导下进行改版试验，显示这本最代表英伦风格的杂志应对时尚全球化的全新编辑思路。
　　
　　13.ROLLINGSTONE滚石
　　美国1967年创刊www.rollingstone.com
　　曾是一代热爱摇滚文化左派分子的代言杂志，代表了杂志媒体在音乐领域的权威声音。今年挖来FHM杂志原主编埃德·尼达姆酝酿改版调整以适应新阅读趣味的策略，可见其要维系《滚石》作为文化代表之心不息。
　　
　　14.The New Yorker纽约客
　　美国1925年创刊www.newyorker.com
　　它精于透析文化动脉，在政治、文学、艺术各领域中充当思潮流行的先驱角色，其杰出之处是以长久的文学品格与知识分子气质的坚持换取全球大多数欣赏者的崇敬之心，尽管从没有推出其他语种的海外版本，却总会有人来为之作免费杂志文化理念宣传。
　　
　　15.Forbes福布斯
　　美国1917年创刊www.forbes.com
　　以人为报道造榜之脉的Forbes，一个“富豪榜”足以让这本杂志大吃四方。其近年最惹人注目的是在亚太地区声音的增强，热衷于“中国富豪榜”的发布及“全球CEO(首席执行官)会议”，瞄准香港更显示其司马昭之心。
　　
　　16.PEOPLE人物
　　美国1974年创刊www.people.com
　　全球定位最精确又最有效的杂志之一，聚焦主流的风云人物，八卦而不媚俗，强调短小文章迎合时代阅读习惯，由于其编辑方向的精确，便被封为最适合在厕所阅读的主流杂志，足见《人物》阅读适应性之广。
　　
　　17.i-D
　　英国1980年创刊www.i-dmagazine.com
　　杂志领域标识性最强的刊物，一直

这是第一次薯片会的内容。说了一些关于交互设计师基本的定义，特点、要求之类的话题，是些理论上的。

Web交互设计师的定义

秉承以用户为中心的设计理念，应用“以目标为导向的设计”方法，进行互联网产品的设计。

这是关于交互设计师的一个基本定义。无论是现有的交互设计师或是对交互设计有兴趣正打算入行的人都会考虑这个问题。“到底交互设计师是干什么的？”“怎么干？”“是因为我在网页设计方面有经验有能力于是就能当交互设计师了吗？”交互设计师首先需要认同“以用户为中心”的设计理念。有了为用户着想的观念，接下来就是方法，怎么设计才能很好的为用户服务？在我看来，目前实现UCD最有效的方法就是Alan cooper提出的“以目标为导向的设计”方案。实际上“交互设计”这个名词也是他提出来的。

关于“以目标为导向的设计”可以阅读《软件观念革命——交互设计精髓》和《软件创新之路–冲破高技术营造的牢笼》

交互设计师的特点

交互设计师善于表达，以网页语言表达，以网页语言表达产品要告诉用户的信息，要显示给用户的操作功能。

所以，凡是涉及到表达、传达的问题，都可以找交互设计师来做，也应该由交互设计师来做。

产品经理考虑要做个什么产品才有价值，交互设计师考虑怎么把这个想法最有效的转化成一系列的界面展现给用户。除了展现，还有和用户的交互。这个展现、交互的过程就需要一定的表达能力。这种表达能力并不是我们平时所特指的口头表达，而是使用网页语言表达。我们经常会讨论一个按钮的位置，讨论某个状态下光标的样式，声讨应该写成“登录”而非“登陆”。这些都是网页语言表达。

有些时候，有些交互设计师会问，“网页上的文字要我来写吗？产品经理比我了解的更清楚，他（她）们写吧？”如果说交互设计师的应该具备“善于表达”的特点，那么，网页上的文字就应该由交互设计师来编写，虽然产品经理更了解产品，但是产品经理并不是最懂得如何想用户表达的人，交互设计师是。我们会讨论“你”还是“我”这样的称谓问题，会注意不要在页面上出现“用户”这样的字眼，这些都是文字表达的问题。

对交互设计师的要求

文字表达能力：写邮件，写blog，写各种东西。如前所述，文字表达是页面表达的一部分，具备一定的文字表达能力是必要的。

语言表达能力：多说，开会的时候要发言，一对一的讨论要花心思。

较好的语言表达能力是与同事沟通的必要素质，更为重要的是，语言表达能力是表达能力的一种体现。如果面对面，一对一的交流都有困难，怎么能保证用页面间接的跟用户交流能交流清楚呢。

(省略掉两个关于内部工作方法的话题)

web交互设计师的工作内容

内容包括：对产品进行行为设计和界面设计。 行为设计是指各种用户操作后的效果设计。Web的操作以点击为主。点击操作又可以分为“表单提交”类和“跳转链接”类两种。除点击外，还涉及到拖拽操作等。  界面设计包括：页面布局、内容展示等众多界面展现。例如：使用按钮还是使用图标？字号大小的应用，如何使用tab…..  之所以特意提出这样一个话题，是为了强调除了“界面设计”，还需要“行为设计”。交互设计在被认识的过程中会有很多误区，常见的是把交互设计理解为一种专业的、高级的界面设计。一个产品不好用很多时候是因为流程上有问题，页面表现的挺合理，但是，点击了一下之后，就会发现“走不下去了”。流程是一系列的操作，也需要设计。

如何进行一个产品的交互设计?

第一步.信息构架设计

深入理解产品的目标、功能需求。将这些目标、需求转化为界面表现。把内容合理的归类整理为若干的界面。信息构架的设计意味着对导航的设计。“导航栏共有几级？每级几项？”这些问题将随着信息构架的设计而确定。

信息构架设计的要求：
1.符合用户心理模型
2.尽量保持窄而浅的信息树这一步工作需要和产品经理充分的交流。

第二步.界面细节设计
在整体信息构架确定的基础上，对界面上的细节进行推敲。界面细节设计的要求：

1.符合web可用性标准
2.符合图形用户界面的基本准则
3.符合现有互联网上业已形成的设计习惯……
（目前只想到这几条）

这些细节设计更像是交互设计的专业，通常其他职位的人不会染指。显然这些工作是很有价值的，但是创造性并不大，价值也不很大。随着互联网这个行业的成熟，细节上的表现会更统一、更规范。也许今天我们今天激烈争论的问题，几年后已经很成型了，不需要再争论了。相比之下，信息构架的设计更具有创造性，自由度更大。

转载地址：http://www.shupianhui.com/?p=18#comment-85

之前在爱枣报上看多过这段话，今天又在南方或周末上看到了。个人感觉挺赞同长平的这段话的：

“最重要的一点是，抵制家乐福的发动者和响应者都应该明白，抗议是你们的权利，不抗议也是别人的权利。你可以尽力说服更多的人来参与，但是不应该以”不爱国”为理由去辱骂旁观者和反对者，也不应该以阻碍、拦截等方式去强制别人参与。甚至有人号召跟踪打击购物者，那更是公然违法的行为。不要忘了抗议的目的，是让法国人知道中国爱国民众的愤怒，而不是让无辜的中国人受到侵扰”。

在设计路上看的网站

http://www.new-synthesis.com/

这个网站收集了摄影，时尚，视觉的国外酷站。收集网站的质量蛮高的，更新速度也很快。

参加了上海关于“怎样设计web‘帮助’更有效”的书友会，收获颇多，平时很少注意的帮助的确值得我们思考。

设计“帮助”的一些想法

1.  “帮助页面“只是狭义的”帮助“，广义的“帮助”应该无处不在，它协助用户了解和使用网站
 用户在使用web服务的时候遇到问题，就可能会想到“帮助页面”。其实“帮助页面”只是狭义的“帮助”，用户在人机交互过程中的任何一个提示，一个说明都属于“帮助”的范畴。

2  用户更喜欢在实践中学习，而不是通过“帮助页面”
用户总是忙碌的，他们所有的操作都是为了完成他们的目标，用户并不关心用什么方式和为什么用这样的方式来完成他们的目标。所以他们对待系统的“帮助页面”总是冷漠的。用户更喜欢在实践中学习，在过程中学习，这对于用户来说是最省时省力的。

3. “帮助”的设计应该从整个信息架构建设开始
“帮助”被人们认为是整个系统建设的一个补充，它的设计往往被独立出来，甚至是在整个系统建设完成后才开始。就像传统的“帮助页面”，他的出现是为了“治疗”用户在使用web服务时的出现的“病症”。可治疗往往没有预防效果好，在治疗的同时也会带来一些不良反应：由于“帮助页面”是独立于用户操作的页面。当用户在操作遇到疑问时，他们不得不暂停手上的操作，然后进入“帮助页面”寻找答案。这样寻求帮助的方式不仅使得用户需要经常在至少两个页面之间切换来解决自己的问题而且还让他们的行为偏离了原有的行为轨迹。这无疑增加了用户行动的成本和出错的机会。
帮助的设计应该不仅仅局限于“帮助页面”，而应该从整个信息架构建设开始。把帮助显性的或隐性（触发式的或者是可选择性的）的嵌入到整个交互过程中。在用户操作过程中通过提示，说明，自我解释等方式帮助用户完成各种操作。减少用户为了寻求帮助过而偏离现有的目标的机会。当然，判断“过程中帮助”该在何时何地嵌入对于我们来说是个很大的挑战。但也是值得我们去思考和解决的。
虽然说“过程中帮助”的终极目标是让用户放弃传统意义的“帮助页面”。但“过程中帮助”仍然不可能完全解决所有用户的所有问题，并且这种帮助对于用户对于人机交互的熟悉程度也相对较高（如部分“过程中的帮助”是通过鼠标触发的），所以传统意义的“帮助页面”还是有它存在的价值的。

4. “帮助页面”的设计目的是让用户尽快离开这个页面
与设计其它的页面不同，我们设计“帮助页面”是希望用户能尽快从这个页面离开，回到之前的目标导向。大部分用户，都是在与人机交互过程中出现疑问才会去“帮助页面”的。这时的用户是带着一个还未完成的任务和一些疑问进入帮助页面的。在这样的情况下如果用户在帮助页面停留时间越长（可以认为是无法快速的找到他们需要的帮助内容或者是是被帮助页面中其它一些信息所吸引），那用户放弃这个未完成的任务的可能性就会很大。所以让用户如何能快速找到他们需要的帮助内容是设计帮助页面最重要的目标。

5.  根据你的用户和你的系统来选择你采用“帮助”的方式
大部分网站提供给给用户的帮助形式都是多样的。用户可以通过帮助目录来解决自己的问题，也可以通过帮助搜索来寻找自己的答案。采用哪几种有效的帮助方式才能够让用户快速的找到他们需要的帮助内容？不同的帮助形式有不同的特点（可以参看下面提到的帮助的分类），只有帮助的形式适合用户，适合这个系统时，这样的帮助才是有效的。
举个例子，用户在你的系统中犯错的成本比较高时，那操作过程中的提示就变得比较重要。如果大部分用户都是使用电脑或者网络的新手的话，那帮助搜索或者过程中的帮助（这种方式的帮助可能会增加更多的交互机会）可能就不是你的首选，而更容易上手的图文帮助可能更适合作为你提供给用户帮助的第一课。再比如说用户会与你的网站有商业行为的话，即时性越强的帮助形式效果越好（比如电话，即使通讯软件）。

6.“帮助”的结构应该是清晰、内容应该简洁，尽量避免用户在使用“帮助”的过程中产生新的疑惑
帮助的主要任务是解决用户遇到的问题，一旦用户在寻求帮助中又产生了新的疑惑，他很有可能选择放弃。举个例子，如果你的帮助写得像硕士论文那样，充满了艰涩难懂的专业术语，从表到里仔仔细细剖析一遍你的系统。这样的帮助会吓跑你用户。用户只想知道怎样完成他们的操作，他们并不关心为什么要这样操作或者这样操作有什么好处。所以帮助应该结构清晰，内容简介，能够让用户不费很大力气就完成帮助的全过程。如果无法避免会产生新的疑惑，那最好在容易出现疑惑的地方给出解决这个疑惑的方式。好比说在你帮助描述中无法回避一个专业术语，那就提供这个专业术语的解释或相关帮助。

7.“帮助”的维护和创建同样重要
帮助的维护往往会被人忽视。随着时间的推移，网站功能的完善和用户的成长，当初创建的“帮助”必定满足不了现在网站和和用户的需求。所以设计有效的帮助反馈，即时更新“帮助”是 “帮助”生命的延续。

常见的一些帮助形式
1.  帮助目录（按照一定方式将帮助分类）
2.  常见问题（也可以说成“热点问题”）
3.  论坛支持
4.  搜索（通过输入关键字来查找所需的帮助信息）
5.  客户互助（类似百度知道）
6.  名词解释、定义（对专业术语的诠释）
7.  提供下载线下帮助
8.  即时在线客服（通过IM或者基于web的IM的帮助，提供帮助的可以是专门的客服人员或者是机器人）
9.  客服电话
10. 邮件帮助
11. 博客支持
12. 视频演示
13. 交互式的帮助
14. 交互过程中的帮助（可以是显性的也可以是隐性的）
（ps：后文有这些帮助形式在主流网站的实例）

帮助的分类

按照得到帮助的速度来分
1.  即时性帮
助
这类帮助在用户遇到问题时，可以很快的给出帮助的反馈（并不考虑这个帮助是否真的被解决）。如，用户遇到问题后，进入帮助页面，在FAQ中寻求解决办法；直接拨打24小时客服电话，用IM向在线客服寻求帮助。当用户的帮助需求很紧急时，即时帮助就显得很重要了。
2.  非即时性帮助
这类帮助需要一段时间才能得到帮助的内容。如通过发邮件，提交表单提出帮助诉求。这类帮助往往作为“主要帮助”的补充：当用户在系统提供的帮助中找不到答案的时候可以通过这种方式来寻求帮助。适合高级用户提出复杂的帮助需求，不适合帮助需求很紧急的用户。

按照提供帮助的位置来分
1.  进入系统的帮助页面寻求帮助
用户需要通过进入帮助页面或者通过搜索引擎来主动获取帮助。目前主流的帮助都是建立专门的帮助页面。这样的帮助存在一个问题，当用户在人机交互过程中遇到挫折，便放弃交互时，再好的帮助页面也失去价值。
2.  在交互过程给出相关的帮助
在人机交互过程中系统会提供显性得或者隐性的（如，通过鼠标触发）提示，说明或者进行自我解释来帮助用户完成操作。设计这类帮助的终极目标是让用户忘记所谓的帮助页面，在人机交互过程中对帮助用户学习和纠正用户错误。设计这类帮助的往往是从整个网站的信息构架开始的。这类帮助的设计需要花费更多人力，物力和财力。但这也是体现出信息架构和交互设计的重要性。

按照提供帮助的对象来分
1.  提供帮助的是机器
如传统的帮助页面，视频演示。这类帮助具有局限性，它只能满足大部分用户的需求，但对于有特殊需求的用户就无能为力了。
2.  提供帮助的是专业的客服人员
如客服电话、论坛、借助即时通讯软件的帮助。比起机器提供的帮助，这类帮助更加灵活，基本上能解决所有的问题。除此之外，像客服电话这样的传统服务方式，更适合不熟悉与机器打交道的人使用。
3  提供帮助的是用户本身
如淘宝互助这样的平台就是通过用户本身的沟通来取得帮助。这类帮助更加开放，更容易了解客户真正想知道的，更有利于建立帮助知识库。

按帮助所采用的形式来分
1.  文字说明
最普通的帮助形式。文字帮助往往是单独，枯燥的。用户往往无法完整阅读大篇幅的文字说明。但如果需要解释专业术语或者名词时，文字形式的帮助无可替代。
2.  图文说明
主流的帮助形式，提供比文本说明更加直观和清晰的帮助形式。可以解决大部分用户的帮助需求，但遇到比较复杂和繁琐的交互过程时，图文帮助并不是最有效的。
3.  视频演示
通过演示人员完整的人机交互演示，让用户更直观的学习整个交互过程。这种帮助形式适合较复杂和繁琐的交互过程。当然这类形式的帮助会对网络带宽有一些要求，所以最好能提供用户在线观看和下载两种选择。除此之外视频演示还有结构不清晰，很难快速定位整个交互过程的其中一个过程。
4.  互动式帮助
通过模拟真实的交互环境，提供引导和说明帮助用户完成整个交互过程。对于较复杂的交互过程，互动式的帮助是目前最好的解决办法。它贴合用户更愿意在“实践”（虽然是模拟的，但基本重现实际交互环境）中学习的意愿。它也能解决视频演示中结构不清晰，难以定位整个过程中的其中一环节的问题。
5.  搜索
通过输入关键字查找帮助的内容。这类帮助形式可以以最快的速度帮助用户找到他们需要的内容。但它对用户的要求也比较高，需要用户能够找到概括他们遇到问题的关键字。所以建立搜索帮助最关键的问题是建立的“帮助知识库”能够涵盖大部分用户所需帮助的关键字。

主流网站的帮助（ps：在选择了解网站的产品中我尽量选择包含复杂交互或者可能出现特殊帮助需求的产品。由于个人能力有限，可能会有疏漏和错误，以下信息收集的时间为：2008年3月16-23日）

Google
Google的产品和服务有自己单独的帮助页面。同时也有自己的帮助中心—“Google帮助”。这里我了解了它产品中的 [地图]，[日历], [论坛] [AdWords]。
1.搜索  [地图]，[日历], [论坛] [AdWords]。
2.帮助目录 [地图]，[日历], [论坛] [AdWords]。
3.5大常见问题 [搜索] [地图]，[日历], [论坛] [AdWords]
4.查找术语(专门针对用户可能遇到的术语的帮助) [AdWords]
5.论坛支持 [日历], [论坛] [AdWords]
6.即时在线的客户服务支持(没找到入口，所以没用过)  [AdWords]
7.博客支持 [Adsense]

百度
百度的产品和服务有自己单独的帮助页面。同时也有自己的帮助中心—“百度帮助中心”。这里我了解了它产品中的 [地图]，[百度指数], [论坛] [百度知道]。
1.帮助目录（感觉有点在像在看说明书） [地图] [百度指数] [论坛][百度知道]
2常见问题 [地图] [百度指数] [论坛][百度知道]
3.百度吧 [地图] [百度指数] [论坛][百度知道]
4.百度帮助电子书下载  [地图] [百度指数] [论坛][百度知道]

QQ
QQ产品和服务有自己单独的帮助页面。同时也有自己的帮助中心—“帮助中心”。这里我了解了它产品中的[QQ]，[拍拍], [财付通] （除了“帮助中心”的帮助，拍拍和财付通还有自己独立的，更加细致的帮助，包括交互的形式的帮助）。
1.搜索  [QQ] [拍拍] [财付通]
2.帮助目录  [QQ] [拍拍] [财付通]
3.热点问题  [QQ] [拍拍] [财付通]
4.会员热线（我不是会员，所以没用过这个）[QQ] [拍拍] [财付通]
5.客服电话（需要向运营商支付市话或长话费用）[QQ] [拍拍] [财付通]
6.咨询中心（通过一系列表单提交问题，用电子邮件或者电话接收帮助信息）[QQ] [拍拍] [财付通]
7.论坛支持 [QQ] [拍拍] [财付通]
8.流程演示（这里提供了图文帮助和交互式的帮助两种形式） [拍拍] [财付通]
（ps：[拍拍] [财付通]我并没有经历过买卖的过程，所以不知道有没有过程中的帮助）

网易
网易的产品和服务都有自己单独的帮助页面。同时也有个帮助中心—“易问易答”。通过帮助中心可以去到网易各个产品和服务的帮助页面。这里我了解了它产品中的[163邮箱]，[博客] 和[有道]（“有道”是自己独立的帮助）
1.帮助目录  [163邮箱] [博客] [有道]
2.FAQ  [163邮箱] [博客] [有道]
3在线回答（机器人“小易”