Prower - 记录成长历程 » 体验设计

常见的几种淘宝店主营销手段

摄氏度 — Fri, 30 Jul 2010 15:10:37 +0000

上淘宝有几年，大到笔记本电脑小到小包零食，都在淘宝上买过，见过的店铺不算多，但也还不至于少，于是纪录一下自己常见到的淘宝店主的几种在自己店铺内的营销手段：

1、在淘宝客还没有诞生或是没有广泛的推广时，淘宝店铺的入口很狭窄，淘宝首页以及淘宝搜索是最为重要的两个入口，于是为了能在搜索系统中按价格排行时能排在前面，把物品的价格故意改低，然后把减掉的那部分价格加到快递费用上，补回物品的差价，这是一种成本转移的假象；

2、淘宝购物的很大一部分局限会出在物流上，于是当顾客拍下物品后，店主会先拿快递单号把物品的状态改为已发货，所以经常半夜也能看到发货的提醒，其实这个物品会在一两天后才会发货，但有一部分顾客就会把这个时间算在路途运输上，减少顾客因为对发货速度的不满，这算是一种迷惑顾客的风险转移；

3、在淘宝搜索系统中的排名因素除了操控价格来改变外，还可以通过操作销量数据来改变。当某一样畅销物品买了很多，积累到一定的销量数据，到了下架时间之后，店主会修改物品信息为其他非畅销物品，接着上架，于是前一个物品的销量变成新物品的销量，于是不管是在搜索排名还是物品页面都是漂亮的数据，这就是店铺假数据的来源之一；

4、用户口碑对于物品的销量很重要，于是可以看到很多店铺里关于物品的评论截图举例的比重远大于物品本身的介绍，再加上第3点所说的通过修改物品信息得来的评论数据，进一步的卸下用户的警惕之心；

5、除了通过评论来证明自己的物品以卸下用户的警惕之心外，还可以通过拿所谓的假货仿货来做对比，引导用户进行所谓的真假货对比，以增加用户对自己物品的信心，虽然两个对比的物品都可能是假货；

6、在物品的介绍内容里推荐关联的物品，比如在耳塞的介绍内容里推荐耳机套、延长线，这是一种小成本的关联推销，推荐的几样东西价格都不贵甚至可以说是便宜，但却是能与当前物品紧密配合使用的，这样的关联推销相比同类物品的推销成功率要高；

设计上的小细节（二）

摄氏度 — Thu, 15 Jul 2010 13:54:14 +0000

边看视频边做其他事情是很多人在上网时会做的，而播放视频时去掉播放器多余的边框减少干扰是体验中很重要的一步，于是有了播放器的精简模式，而当显示器的分辨率越来越大时，一般精简模式提供的1倍、0.5倍的尺寸大小显然有些不合适，这个时候我们需要手动播放器的边角或是边框来放大播放器。迅雷看看播放器对此做了一些优化，当选择精简模式在默认的情况下视频尺寸是1倍大小的，但此时播放器的工具条会提供0.5倍以及1.5倍两个尺寸选择，当通过播放器本身提供的这两个规格进行绽放时，两个值都会跟随着变化，每次变化以0.5为单位递增或是递减：

很多在线网页视频播放，为了速度会将一部分视频文件缓存在本地，这个时候就需要使用到插件来帮助完成这件事，所以经常可以在访问视频网站时在IE浏览器的顶部弹出安装插件的请求，同意之后会弹出窗口来确认安装，确认之后只到安装完成后自动刷新当前页面，这段安装的时间是长是短，安装的结果如何，用户几乎是完全不知情的。这个时候来看看迅雷看看的插件安装过程，利用处于空闲时几乎无用的任务栏来即时的显示插件的安装情况：

同样是视频播放，本地播放器可以通过精简模式来消除视频之外的干扰，但网页版的视频播放显然就无法通过精简模式来减少视觉上的干扰了，于是有些视频网站的网页版的播放会提供一个功能——开灯/关灯，当使用关灯时会用黑色来遮盖所有除视频之外的元素，使视觉干扰减小到最少。当然，土豆网的那个开灯/关灯不算，此类的例子要看奇艺网或是音悦台。

设计上的小细节

摄氏度 — Mon, 14 Jun 2010 04:55:07 +0000

1、卓越亚马逊的首页轮换图片，每刷新一次，都是随机不同的顺序显示，这样的设计解决了对于较多图片轮换而靠后的图片信息很少被看到的问题，这点对于电子商务等时效性不是很讲究的网站来说尤其重要；

2、最初的时候是点击照片跳转到下一张，再然后是点击照片的左边是上一张，点击照片右边是下一张，当我们习惯了这样的照片浏览方式之后，似乎我们的鼠标就会被限制在照片的范围之内。百度空间里的相册浏览页面扩大了鼠标的可点击范围，使得照片翻页不在只是局限在照片里面，而是整个页面的宽度，以及在中间部分加入了照片放大功能。还有就是侧边预览图的滚轮支持；

3、而腾讯网内容页里对照片这块的处理则有更多的细节，比如图片下方的预览图、比如图片底部的可隐藏的说明文字。当一块有限的空间被堆叠更多的功能时，好与坏开始变成一个相对的事情；

4、当在页面的链接处用鼠标右键点击时，弹出的菜单：IE从上下到是“打开”、“在新选项卡中打开”、“在新窗口中打开”；Firefox从上到下的顺序是“在新窗口中打开”、“在新选项卡中打开”；而Chrome的则是“在新标签页中打开链接”、“在新窗口中打开链接”。IE的第一项“打开”完成就是左键单击的行为，实则无意义；Firefox对这个顺序的处理似乎仍停留在浏览器还未引进标签页的设计上，标签页正是为了解决桌面上铺满浏览器窗口而设计的，所以在这个顺序上，Chrome的设计则是最好的；

5、当页面中需要出现页码时，可以看到很多网站对这个翻页的设计都做了处理，比如减少“上一页”的可点击区域，增加“下一页”的可点击区域。很长一段时间来，浏览器的前进与后退两个按钮是同样的大小，但在页面中翻页时用户更多的操作是在“下一页”，同样的，对于浏览器的前进与后退，用户更多的操作行为会是在“后退”，所以Firefox对这两个按钮的设计做了处理，增大了后退按钮，更便于用户的频繁操作；

烂大街的用户体验

摄氏度 — Sat, 22 May 2010 15:08:20 +0000

不知从何时起，国内的很多软件在更新日志里都会附上一条“改进用户体验”之类的话。要说这用户体验即不属于功能更新，也不属于Bug修复，但它就是堂而皇之的出现在更新日志里。只因为商业是需要噱头的，在功能无法成为噱头的时候，用户体验这个正火热而又显得虚无飘渺的词就肩负起了噱头这个责任。所以即使这些软件暗地里在用户的电脑上耍流氓，却仍要明着说自己的用户体验好。

用户体验是个很虚的词汇，虚到没有界线可以去界定它，小可以到某个界面中某个功能按钮的文字，大可以到贯穿用户使用过程以后之后对其的影响。而事实上当前很多的设计职位都是没有明确的界定的，比如交互设计、比如产品设计，但用户体验这个则更像是飘在空中落不到实地的。

当我们浏览一个购物网站时，该网站的购物体验做得非常好，那么就能说该网站的用户体验好吗？显然是不能的，购物体验只是整个用户体验中的一个环节，如果在商品质量上让用户失望或是提高售后服务的门槛，那么显然以用户体验好来称赞这个网站是个伪命题。当然，该网站可能对外宣称自己的用户体验好，但这个好仅限于用户的购物体验，也就是让用户掏钱消费的部分。

用户体验不应只是某一环节的问题，而应该是一个圆环状的从头到尾有着紧密的衔接，更应该是一个战略层面的事情，是与品牌息息相关的一环。

经常可见某些人指着某些产品的某点说用户体验不好，但是我们说不能因为某人一某一个小缺点就否定某人，对产品也应该是如此，对一个产品的评价应该站在一个全局的角度来看，而这其中首位重要的应该是该产品是否切实解决了用户的问题，否则一个产品即使再易用但不能解决用户的问题，那就是白扯蛋。

所以，用户体验应该商业需求之后的事情。如果将用户体验架在商业需求之上，显然这会是一个短命的产品。

让我们收起用户体验这把大斧子，好好做点事吧。

网址站的2.0玩法

摄氏度 — Fri, 12 Mar 2010 09:28:58 +0000

hao123的成功引领了一批的网址站，然而辉煌却是很难复制的，复制了模式却复制不了成功，市场一旦被垄断就很难再超越。网址站的成功也在一定程度上表达出中国互联网的成熟度，很多越乎基础的基础应用还是有很广扩的前景，关键在于如何去解读用户的需求。

网址站的模式似乎已经被固定在了hao123身上，太多的网址站都是搜索一批网站的网址然后就摆在那里，任由用户去发掘，平静得犹如一潭死水，最终也真的成了死水。

当市场已经稳固很难成长的时候，产品就应该试着换一种玩法。

虽然在设计上来说，不要轻易的改变用户的习惯，然而面对千年不变的网址站，那些密密麻麻的铺开的链接也在一定程度上阻碍着初级用户对互联网的认知与学习。

面对初级用户可以默认页面内容，但用户在成长，这个时候是否应该试着把主动权慢慢的交一部分给用户？网址站到收藏夹，这是一对孪生兄弟之间的距离，网址站帐户也许是个好桥梁，自定义网址站页面可能是个更好的互联网入口。

当然，对用户的引领将是很困难的一件事。

浏览器插件、API数据调用，也许这是更高级一些的玩法，用户面相对较窄，但不能说没有。

与时俱进才能更好的发展，虽然这个步伐可能会相当的慢。

豆瓣的Url结构方式一览

摄氏度 — Sun, 28 Feb 2010 03:15:06 +0000

网站域名一般都会选简短易记的，因为这对于网站宣传来说也可以省不少力。而被很多网站忽视的站内Url结构则在一定程度上反映出网站的整体架构。

当设计走向越来越轻的时候，网站Url结构的设计也越来越清晰明了化，很大程度上已经可以通过Url结构来获知该页面的大致内容。

豆瓣就是这样一个网站。

豆瓣的Url结构除了清晰明了易识别外，还有很多很有意思的地方：比如上一篇日志中说的豆瓣的搜索Url结构；比如豆瓣的所有翻页都是以当前内容页面Url+?start=100的形式，再往下是?start=200，这一点不像一般的网站直接就是标示1、2、3之类的，这种翻页的Url结构方式在一定程度上向用户展示列表中内容的数量，也弥补了豆瓣对列表中的内容数未显示的设计。

豆瓣在Url的格式的递进设计上也有点意思，你日记、相册之类的在Url结构上只归属大的分类，比如某个日记的Url格式是 www.douban.com/note/yyyyyy/ 而并非是常理下的该日记归属某个用户 www.douban.com/people/xxxxxx/note/yyyyyy/ 的结构，这一个设计也延用至书评影评乐评之类的内容上。

花了一些时间，整理出了豆瓣的整站Url结构，当然肯定是有些许遗漏的，但主体的都在了，也能大致的看得出来豆瓣的整站架构了。

有高清无码图及mmap文件可索取。

新豆瓣的搜索系统设计初探

摄氏度 — Sat, 27 Feb 2010 11:01:34 +0000

新豆瓣将社区独立出来强化后，除了改变最大的导航外，还有搜索系统。豆瓣开始将以前的综合搜索拆分设计，社区、书籍、电影、音乐有了各自独立的搜索，原来的综合搜索也进一步被淡化成社区搜索。这样设计的出发点应该是基于对搜索结果准确性的追求吧，因为原来庞大的搜索条件使得搜索结果的准确性大大降低。

也许是因为目前豆瓣正经历着架构的改变的原因吧，豆瓣的搜索系统也变得很有意思，比如搜索周杰伦：

搜索：周杰伦
http://www.douban.com/search?q=周杰伦

豆瓣条目搜索：周杰伦
http://www.douban.com/subject_search?search_text=周杰伦

书籍搜索: 周杰伦
http://book.douban.com/subject_search?search_text=周杰伦&cat=1001

电影搜索：周杰伦
http://movie.douban.com/subject_search?search_text=周杰伦&cat=1002

音乐搜索：周杰伦
http://music.douban.com/subject_search?search_text=周杰伦&cat=1003

将书籍、电影、音乐从综合搜索里淡化后，综合搜索里的结果基本上被小组垄断了，豆瓣小组的庞大数目开始在这里显现出来。

条目搜索是个隐蔽的功能，因为并没有在页面上的某个地方显示出来，只能通过修改Url结构来打开，搜索的条件也很限制，仅限书名、影名、唱片名。在做了这样的条件限制后，搜索结果也要相对的精确许多，也许没多久后豆瓣可能真正推出这个功能来。

虽然从Url结构上看，书籍、电影、音乐三者的搜索是位于各自站点下面的，但事实却并非如此。1001这个数值对应的是书籍搜索，1002对应的是电影搜索，1003则是对应的音乐搜索，当需要改变搜索类型时并不需要去修改前面的book、movie、music这三个子域，只需要改变后面的数值即可，也就是说将book、movie、music这个三直接换成www，只要后面的数字不变，结果也是一样的，唯一改变的就是头部的导航，也就是说使用二级域名的搜索时只是为了显示不同子站的头部。

新豆瓣的三个子站的搜索Url结构还有另外一种：

书籍搜索: 周杰伦
http://book.douban.com/search/周杰伦

电影搜索：周杰伦
http://movie.douban.com/search/周杰伦

音乐搜索：周杰伦
http://music.douban.com/search/周杰伦

当然，这三个Url结构就没法再改变二级域名而不改变搜索结果了。

什么是好的设计

摄氏度 — Tue, 23 Feb 2010 00:35:36 +0000

每个产品诞生的背后都凝结着一位或是多位设计师的心血，在产品的诞生过程中文化、科技、环保、创意等这些方方面面的细节集结成一个绚丽的故事，因为有了这些故事的铺垫，诞生出来的产品才变得更有意义，影响并改变着人们的生活。

比如秦始皇为了减少战争的损耗而采用统一制作工艺的弓箭；比如牙签顶部的圆槽可以折断以表示使用过，还可以将折断的部分当成牙签的搁置台；比如大剪刀手柄上的凹槽是为了让剪刀不易脱手掉落；比如iMac显示器的铝板中间液晶屏的部分可以制作成两个键盘框架；比如更环保的可更换刷头的牙刷；……

这些应该是《工业设计纪录片》（也叫《设计面面观》）想要表达的核心所在。

好的设计应该是创新的，好的设计应该令产品实用，好的设计是美的设计，好的设计令产品易于理解，好的设计是诚实的，好的设计是不显眼的，好的设计是耐用的，好的设计贯穿每一个细节，好的设计是环保的，最后但同样重要的是，好的设计是尽可能少地设计。

这一段诠释什么是好的设计的话，也在叙说着设计的真谛。

从最初产品材质的甄选，到制作工艺的提升，再到寿终正寝时的回收利用，设计师们正努力的让自己的设计贯穿产品的始末，为产品提供完整的解决方案。

设计在为人们带来更好的产品时，也在为企业带来更多的商业机遇。更好的生活是人们不变的追求，而更多的商业机遇也是企业不变的追求，现在这两者正通过设计越来越紧密的结合在一起。

好的设计不在于外观的新颖，好的设计不在于功能的强大，好的设计不在于定位的高端，好的设计是取与舍的平衡，好的设计在于还原事物的本质，好的设计在于对人的关注。

真正好的设计在于改善和提升人们的生活质量。

新功能的帮助与破坏

摄氏度 — Fri, 15 Jan 2010 14:50:17 +0000

之前有看过一个博文写的是白社会的设计很好但运营却有些遭，因为对每一个WebGame的推出时间把握不准，会有几个应用同时上线造成影响力的冲突，也会有很久没有新应用上线来吸引用户，基本上同意这个观点。

白社会从推出起，就一直是以用户体验好著称的，很多的细节做得很到位，但同时也有很多的细节没有到位，今天就接上篇日志说一下白社会里的“梦幻城”的最新功能设计——照相。

不可否认，这个功能的确是给用户的游戏更增娱乐元素，轻点一下鼠标，就可以为自己的“梦幻城”截图并上传到相册里，然而对于这样一个可有可无的功能是否真的值得上呢？

自从这个功能上线后，好友新鲜事里的照片基本上就被这些游戏的截图占据了，导致好友的正常照片几乎都看不到了，于是这些截图就成了毫无作用的垃圾信息，原本的好友信息流被完全的扰乱。

试想一下，看到满屏的游戏截图，用户做何感想？

一个新功能的上线，是否应该对其带来的影响做好充分的评估呢？只是考虑局部而忽略了整体的影响，最终这个功能是失败了。

Microsoft Live Labs新作Pivot初探

摄氏度 — Mon, 30 Nov 2009 13:25:57 +0000

话说微软的IE系列产品都被众多的前端开发者臭骂，除去其对于WEB标准化的支持问题外，再者是因为其同一款产品的存活型号太多，从IE6.0-IE8.0，3个版本的浏览器，结果对同一个页面有着三种不同的表现，结果据说IE9.0已经开始开发中。但这些都只是在页面的性能及呈现的方式上，除去浏览器中的内容来看一下浏览器本身的设计，Microsoft Live Labs新近推出的浏览器新作Pivot则是一款很酷的产品。酷在它对于传统浏览器操作方式的改变，但这种大幅度的改变用户的操作习惯，则注定了它只是能实验室的产品，不过这不并能妨碍Pivot成为一个很酷的产品，也许未来的某一天它真的就公开发布出来了。

Chrome的诞生，改变了以往浏览器对于标签栏的设计，而且也简化了浏览器头部的设计。但在简洁这点上Pivot做得更彻底，仅只保留几个必不可少的功能按钮及地址输入框。

将当前页面加入书签后，就会激发进一步的行为，那就是页面描述的Tag，而且Pivot将当前页面标签显示在了标签后面：

很酷的是Pivot在“前进”与“后退”两个按钮中提供了当前标签的浏览历史，而且历史页面是以预览图的形式表现的：

为了头部的足够简洁，Pivot甚至将标签栏都从头部移到了底部，而且提供了标签页面的预览图，当然这个功能在之前的Opera中已经使用上了。当标签栏中的宽度超过限定宽度后，则会浮现出滑动的按钮，只是这个按钮不明显，也很小，也许将其显示在标签栏的两侧边会更好一些。

在标签栏的左边还可自行加入快捷方式，这让人不得不猜测，这个原型是根据Windows的任务栏来设计的吗？

只是地址输入框与标签标签栏的距离如此之大，一个在头部，一个在底部，操作上实有不便之处：

既然单个标签页的历史纪录都启用了预览图，那整个电脑的历史纪录当然也要使用预览图的形式了，这样才足够酷。而事实上，图像化也正是Pivot的特色，大部分时候，图像总是比文字更能有表现力。

还可以自己定义历史纪录中的排序是以月还是以日来表现：

每一个图都是可以再放大的，而且这里还针对当前预览图里的页面内容引入了微软自家的搜索引擎Bing的搜索结果，这应该是目前为止，微软的浏览器与自家的搜索结合最好的一次，当然以前的方式几乎是没有任何的结合点的。

这样一款以图形化表现为主的酷的浏览器，不是一般的电脑能承受的，所以这款产品首先对操作系统就作了限制，只支持Windows 7，而且以我在Windows 7里运行的状况来看，还是比较卡。

当然，必须说明的是，这款浏览器的操作的确是很酷，交互方式也完全超越了现在的浏览器，如果配上触摸屏进行操作的话，嗯，那应该是科幻片里常见的镜头！

浅谈Twitter及尝试Following列表的改进设计

摄氏度 — Sat, 21 Nov 2009 08:39:26 +0000

对于即时通讯软件而言，讲究的是时效性与封闭性，发出去的消息需要至少有一个接收者，而且最好是能取得对方的回复，这个消息也许没有什么实在的内容，也许只是打声招呼而已，但这些内容的传播是在一个相对封闭的空间内的；而对于博客而言，讲究的是内容与传播，内容需要言之有物是思想的沉淀，展现出来的这份沉淀的思想，可能影响到很多人，也可能甚至没有一个接收者，仅仅只是自己的自吟自唱，所以时效性对于博客来说是其次的。

于是在即时通讯软件与博客之间就产生了一个新的需求，那就是在追求时效性的同时也对传播有一定的要求，追求时效性的内容要求自然相应的降低，无法做到像博客那样长篇大论侃侃而谈。于是微博客应需而生了。时效、传播、内容，三者皆占有。

Twitter则是微博客中的代表，其在全球范围内的影响已经深入到非常多人的日常生活中。

相对于即时通讯软件的隐私性而言，Twitter与博客一样是开放的形式，正是这种公开性使其内容得到最大程度的传播。在地球一端发生的事情很快就能传达到地球的另一端，这也就是Twitter被称为“地球的脉搏”的原因之一。

但相对于这种大范围的事件传播而言，Twitter上更多的则是朋友之间的小范围信息交流，内容上偏向于生活中的琐事多一些，这也是Twitter最初的口号“What are you doing”的宗旨，是与朋友分享自己在生活中的琐事。当然随着Twitter在全球影响力的越来越大，对于新闻事件的传播也越来越多，Twitter的口号也做了相应的更改“What’s happing”。但对于大多数Twitter用户而言，突发事件的信息获取仍然只占很小的比例，在获取的所有信息中占最重比例的仍然还是生活中的琐事。

Twitter的用户之间通过Follow的方式来表示关系，这种关系也影响着信息的交流。用户与用户之间的关系变得很简单，单向的Follow与双向的Follow，这也在一定的程度上表示出用户之间的关系情况，类似于跟随者与朋友。

当Follow的用户越来越多的时候，自然就会想到利用分组来标示不同的用户群体，于是Twitter推出了List功能，这一点对于用户而言有着很大的意义，通过List列表快速的Follow自己喜欢的群体。

如果回到以个人为中心的形态，Following里面的用户对Follower也很重要，用个成语解释就是“爱屋及乌”。但Twitter的Following列表设计只是按时间顺序来排列，并没有其他的元素来表达出“你”与列表中的其他用户之间的关系亲密性。

Following列表这里的设计除了按时间排序外，还可以增加按关系亲密的程度来排序，关系的亲密程度由是否双向Follow以及双方之间对话的次数来决定。在视觉上则可以从上自下的颜色渐变来传达关系的亲密程度。

试着用Axure画了一下线框图：

群组功能代替论坛的可行性

摄氏度 — Wed, 11 Nov 2009 09:25:26 +0000

很大意义上的传统社区指的论坛，论坛是伴着一些老网虫们共同成长起来的，泡论坛成了网虫们的爱好之一，从个人主页的时代到现在SNS满天飞的世界，论坛依然坚持着，可以说论坛见证了国内互联网的发展。

然而坚持的论坛却不一定坚挺着。

因为有了康盛这样的公司，所以搭建一个论坛仅是几分钟的事情，这在一定程度上促进着互联网的发展，当然也一定程度上损害着互联网。论坛似乎已经不是技术上的事情，而是成了营销上的事情。相同的程序架构比的就是差异化的营销方式了。

然而也正是这样的对技术的看轻，再加上康盛在论坛程序上的一家独大，导致论坛的功能一直在徘徊不前，鲜有创新的功能在论坛上出现，仅有的更新也只是在性能优化上着手。与论坛功能止步不前相反的是，用户的需求一直在前进着，不断的有新需求需要找到承载方，于是各种差异化的网站开始出现，这些也就是所谓的WEB2.0式的网站。

在这些兴起的WEB2.0网站中，有一个功能设计是与论坛相似的，甚至可以说主要功能上是重叠的，那就是群组功能。

因为在SNS网站中的大量用户需要划分，众多的用户中有共同的特征需要划分，所以类似论坛版块划分功能的群组成了SNS网站中的必配组件。而相较于论坛的版块划分来说，群组功能是内嵌于SNS网站中的，而且功能也是轻量级的。虽然论坛里的版块划分可是完成用户群体的划分，但论坛的功能已经变得很臃肿，整个架构也庞大无比。

对于一个产品来说，基本上都需要走从加法到减法的过程，如果只加不减，只会造成产品的越来越臃肿。

很多网站依然配备着论坛以划分用户群，这样的配备与本身的内容结合将变得比较困难，而且也做不到真正的用户群划分，因为用户无法轻易创建或是只关注自己关注的内容，而论坛的架构也不允许用户随便的创建版块。

当然，群组与论坛只是两个相似的产品，但却不是相同的产品，所以如果网站是以内容为主，那么试着将群组功能内嵌到网站，这对于内容的消费而言肯定是要强过论坛的；而如果本身就是以论坛为主，那就拜托康盛早点将论坛SNS化吧。

写到后面发现思维乱了，呵呵，就算是胡思乱想吧。

从网页向客户端的挺进

摄氏度 — Tue, 10 Nov 2009 13:43:16 +0000

随着浏览器的更迭越频繁功能越强大，很多以前只在特定客户端实现的功能也纷纷依托浏览器在网络上重生，网页办公套件、网页游戏、网页IM……一时之间，繁花似锦，大有一台电脑只需要安装一个浏览器之势。

而依托于浏览器的在线软件的便捷性也的确是那些客户端所无法比拟的，所以在网页端上的发力也是各大公司的产品发展趋势。而做为国内最大的互联网公司的腾讯，自然更是不能落于人后，于是Web QQ应势而生。但做为一个以客户端起家的公司而言，自然是不会忘根。于是在将QQ群很大一部分功能搬上网页后，又开始试着将网页上的内容搬到QQ群里去。

如果论SNS里的群组的话，QQ群应该最成功的群组设计，做为QQ软件里至关重要的功能也是腾讯三维SNS化重要的一个棋子，因为QQ群有着明确的用户分类。

针对特定用户群体，制定特殊功能，这是产品成功关键的一步。

正是因为有着明确的用户群体分类，这些相对较单一的群体有着最大的共同点，所以QQ校友的内容出现在班级QQ群里了，所以星座内容出现在星座QQ群里了，接下去还会有更多的内容出现在QQ群里，QQ群已经从最初单一的交流工具晋升为SNS的基础。

网页为客户端提供了内容，而客户端则为网页内容提供了消费者，虽然这些消费者的面可能窄，但相较于那些广层面上的消费得而言，这些消费者是精准的，是更具有粘性的，换句话说就是更有消费可能的。

内容与用户的精准匹配，将内容有效的转化为流量，这应该就是网页与客户端结合的魅力所在。

关于腾讯软件的2个困惑问题

摄氏度 — Fri, 30 Oct 2009 02:56:19 +0000

1、QQ影音与QQ Live

两者都是视频播放软件，不同点在于QQ影音专注于本地播放，而QQ Live则专注于在线视频播放，然而本质都是视频播放，为何两者不合并呢？

QQ影音诞生在QQ Live之后，为何当初设计的时候不是考虑基于QQ Live的功能增加而是选择独立出来呢？

从两者的功能特性来看，QQ Live可做为QQ影音的一个附加组件存在的，QQ影音可如QQ Music一样实现本地网络双重功能的。这一点最新的迅雷看看播放器做得要比QQ影音更出色。

这两者之所以没有合并，我猜最大的问题应该是在于满足不同用户群体的功能需求上，做功能单一专注的满足一部分用户群体的软件。

2、TM2009与QQ2009

据说这两者是基于同一个内核的，是在之前QQ版本上的内核重新开发的，在性能等各方面都做了优化的。由于TM2008比QQ2009更早推出来，所以TM2008就成了QQ2009的前身，在早期时这两者几乎是没有区别的，功能一样，界面一样。随着这个新内核的不断完善，更多的功能也被增加进来，于是QQ2009的体积开始增加，这时与TM2009的区别就显示出来了。除了在功能上的区别外，TM2009还重新设计了界面，以偏向于办公环境的商务化。

既然是TM的设计是偏向于办公环境的，是偏商业化的IM，那这个界面的头部是否过高了呢？这个头像的尺寸是否过大呢？迷你资料卡是否过大呢？（据说这是为了承载显示更多内容）。

如果只从界面视觉上看，阿里旺旺2009的设计显然要更加的简约清新吧。

TM即想成为办公IM，又想成为娱乐IM，结果两边都不怎么成功。

知情的你，快来告诉我答案吧：）

两家餐馆的竞争：换个盘子装菜

摄氏度 — Thu, 22 Oct 2009 12:55:24 +0000

在某个地方有两个餐馆：餐馆A开得很大，所有岗位的员工都配足，虽然做的菜式不是很好，但也算菜式丰富；餐馆B则是个小餐馆，人手捉襟见肘，做出的菜式单一，日常来的客人也是少之又少。

话说某日，有个美食专家要过来吃饭，而且只吃指定的菜式，恰好这个菜式两家餐馆都会做，于是两个餐馆的老板都去邀请美食专家来自家的餐馆吃饭。由于两个老板的盛情难却，最后美食专家决定让两家餐馆都做，他分别去品尝。

两老板各自回去后，餐馆A招呼厨师伙计搬出菜谱开始烹制，而餐馆B却没有厨师，菜谱更是残缺不全的，烹制就很难开始。

于是餐馆B的老板想了一个办法：等餐饮A的厨师将菜肴做出来后，派伙计过去弄了一份过来，然后再找个精美的盘子装上稍做点缀。

于是，两个餐馆的菜肴都做出来了，美食专家品尝过后认为两家餐馆都不错。

于是，餐馆B的老板心里暗自高兴了，因为他觉得自己的餐饮可以和餐馆A站在同一水平线上竞争了。

哇！恭喜您找到了一个独一无二的文章。

再谈网易首页的改版

摄氏度 — Mon, 12 Oct 2009 05:45:06 +0000

之所以说再谈网易首页的改版，是因为去年临近奥运会的时候，网易首页做过一次改版，奥运会之后网易首页做了一下小调整，调整后的首页让人感到很困惑。今天在没有任何预告的前提下，网易又上线了新首页。

其间有个小插曲是，新首页刚上线后，很多地区突然无法访问网易首页，我访问的时候是服务器返回500。

网易就此次改版的说明是：“本次改版从整体到细节都有一个质的飞跃，新版继承了网易一贯简约、大气、包容的设计品质，达到以用户为中心提高用户体验、促进频道发展的改版设计目的。”

此次改版促进频道发展的目的似乎是达到了，因为首页上的频道更多了；然后到底是否真如网易自己所说以用户为中心提高用户体验呢？似乎从用户的评论来看，这个目的并没有达到。

改版后的网易新首页主要新闻字号从12px上升到了14px，这的确是一个提升，对用户的显示器分辨率越来越大是一个很好的解决方案，然而有一个问题是，字体变大了，整体的结构宽度却并没有变，既然宽度不变那么只有从加大高度来满足字体变大的空间需求了。

新首页头部按不同功能信息使用不同颜色的字体，有灰色、深灰色、蓝色之分，看似字体颜色的不同的确是可以区分信息区。然而蓝色字体是用在广告信息上，很显然的这些蓝色的字体完全抢占了功能、导航的视觉焦点。

再加上这个类似新浪的头部诺大的广告区，网易新首页改版的目的应该加上一条，提升首页的广告容量以收入，甚至这才是此次改版的真正目的。

再看“网易产品入口重新设计排版，新的icon设计提供更佳的标识感与用户体验；一行三个产品入口，提高使用快感，免除频繁换行的顿挫感。”。

将自己的产品入口堆叠在首页似乎是腾讯起的头（末曾考证），网易上一次改版即套用这个设计，然而做的却不如腾讯首页上的安静干扰少。网易首页此次的改版更是突出了这一块的设计，然而深灰的、蓝的、红的三色字体，再加上“new!”的角标，好杂乱！

对于内容版块结构的调整，网易官方的说明是“内容与广告布局更加明晰，新版网易首页从分栏布局上对内容和广告进行了优化，左栏中栏以频道内容为主导，右栏以广告为主导，这样改善后用户在左栏与中栏可享受阅读”纯粹”内容资讯并有利于内容搜索。”

除去左栏的图文混排的广告对阅读产生的干扰不说，右栏仍然不是以广告为主导的，“世博”、“聚焦”、“网易论坛”等这些栏目的分量明显要远重于这一栏中的广告，只是这些栏目之间全被广告间隔着，的确容易被当成广告忽略。

从去年三栏式的网易首页上线后，我就开始怀念更早之前的二栏结构的网易首页，再到这次的改版，我只能更加的怀念那个二栏结构的版本了。

四大门户网站的首页，终于只剩一个真正简约时尚的首页了——腾讯网首页。

导航与搜索合并的可能性

摄氏度 — Fri, 25 Sep 2009 06:20:14 +0000

网站内容的入口很大一部分都是依赖于导航系统，而网站的入口很大一部分依赖于搜索系统，这也在一定意义上证明了导航与搜索之间的重叠性。搜索系统可以完成导航的功能，而导航在一定意义上也可以完成搜索的功能。

网站的导航在一定意义上可以看做是对搜索系统中的关键词类别的提取，这个类别可大可小。比如众多购物网站中的“手机”类别，这是一个大的类别，而“手机”类别下的“索爱”品牌则是属于小类别。这两个类别可以通过导航系统的上下级关系表现出来，同样也可以基于搜索系统的范围搜索展现出来。

即使搜索系统在功能上几乎可以完全替代导航系统，但是导航系统却仍然是网站中不可缺少的组件，预先以网站主题为核心提取搜索系统中的大类别做为导航，将用户获取特定信息的范围进行类别的筛选。这是从让用户在最短的时间内获取特定信息为出发点的需求。

然而几乎所有网站的导航系统与搜索系统的表现形式都是区别开来的，以便于用户快速准确的区分哪里是导航，哪里是搜索。既然导航系统可以做为搜索系统中的一部分，那为何两者不能在表现形式上也进行叠加呢？

如上图，直接将导航系统中的类别以下拉框的形式表现，这个下拉框本身是搜索系统中的一部分，是对搜索范围的筛选。

第二类的导航与第一类实际上是形式上的差距，但第三类采用联动的下拉菜单方式则更趋向于搜索系统中的范围筛选，同时这样的导航设计也可以兼顾到指引用户路径的面包屑导航，然而这个导航的限制是大类别不能进行交叉筛选，只能是线性的范围筛选。

于是尝试带有维度的第四种导航跟搜索的合并方式：

当然，这样的导航与搜索的合并方式有很大的局限性，那就是网站中的类别不能多，如果是垂直性质的购物网站也许是可行的，用户可以通过交叉维度的筛选方式去寻找一定范围内的信息。

如果用户是有着明确的目标的，比如说知道新闻的标题，或是知道即将购买的物品的名称型号，那么用户只需要一个搜索框，导航在这里都是显得多余的。

搜索系统与导航系统的关系

摄氏度 — Mon, 07 Sep 2009 03:32:11 +0000

Google以其简洁的搜索框引领着互联网，搜索系统似乎成了每个网站必备品，甚至于是那些本身几乎是由静态页面组成的企业网站都要来个搜索功能，这真的是必要的吗？

搜索功能的目的是帮助用户寻找到自己所需的信息，这与导航的目的其实是一样的，都是为了解决用户信息获取的需求，或者可以说搜索功能是对导航系统的一个补充，弥补因导航系统的限制而无法快速获取信息的问题。

导航系统的设计需要在深而窄及宽而泛之间取得一个平衡点，偏向于任何一端都会带来不良的影响，事实上这就是一种博弈的过程，是否胜利取决于设计师是否真正了解用户。而不管导航系统如何在深而窄及宽而泛之间取得平衡点，必定会舍弃某些方面。

搜索系统则可以弥补导航系统在设计上的缺憾，可以帮助用户绕过导航快速到达目的地。这在结构复杂的网站中尤其重要。

然而搜索系统并非是所有网站的必配品，在网站中加入搜索系统意味着需要加大对网站的投入，而一个好的搜索系统需要的投入更是庞大。这些投入对那些结构简单信息单薄的企业网站是否值得，这些企业网站只需要一个设计良好的导航即能解决用户的信息获取需求，搜索系统只是个额外的装饰品。

在决定是否需要搜索系统之前，先试着重新审视导航系统的设计。

从Vista地址栏到网站导航菜单

摄氏度 — Fri, 04 Sep 2009 03:09:13 +0000

在Windows vista之前的微软操作系统的地址栏与浏览器的地址栏是一样的，也是面包屑般的自上而下的线性等级形，如果想从D盘跳到C盘是不大可能直接到达的，所以微软在vista上重新设计了地址栏，使其脱离了自上而下的线性等级形式，而是成为了多功能形的导航菜单。用户即可以直观的通过路径知道自己当前所处的位置，同样也可以快速的跳转到硬盘里的其他地方。

一般情况下，网站导航会由几种形式的导航组成，诸如主导航、任务导航、情境式导航等，然而即使是如此多样的导航却依然可能造成用户在网站中的迷失，所以还可能看到面包屑式的导航，用以指明用户当前所在的位置。

面包屑导航一般与主导航区分开来，仅是单纯的自上而下的线性等级形式，这样的面包屑导航仅能供用户快速的返回上一级或是上几级，如果用户需要到达与上一级同级的栏目时，这样线性下来的导航就无法完成目的，所以就需要使用到主导航。

然而将这两种导航合并成一种动态式的导航，也可以完成用户的这般需求，当然这样的代价是用户对导航的认知需要更多的时间。

这种网站导航是从桌面到网络的映射，Home相对于计算机，计算机下包含多个硬盘分区，而Home则包括网站下的多个Item。然而这样的一种映射关系似乎有偏差，计算机是各个硬盘分区之间有一个从属的关系，可是Home与Item之间并不存在一个从属的关系。Item2的下拉菜单可以是Item2.1、Item2.2，但Home的下拉菜单却不能为Item1、Item2。

然而如果Item1、Item2在表现形式上不隶属于Home下，那该如何解决呢？

读书推荐：《UCD火花集》

摄氏度 — Mon, 24 Aug 2009 07:28:31 +0000

上个月趁着卓越网搞活动促销的时候，买了几本书，其中有两本是团队型的，或者说是团队博客出版物：《当彩色的声音尝起来是甜的》和《UCD火花集》。当然，从介绍上来说，《当彩色的声音尝起来是甜的》并不是一本单纯的博客出版物，因为这本书里只有三分之一的文章是出自科学松鼠会网站；而《UCD火花集》则是完完整整的一本博客集，是UCDChina团队里的多位成员的博客精选合集。

虽然是博客集，书中的内容都可以在各位作者的博客上找到，但经过整理组织的内容，拥有更明确的结构，有循序渐进的过程，毫无疑问这本书还是值得购买的。

市面上关于交互设计的书不少，关于产品设计的书也不少，关于信息设计的书也不少……然而把互联网产品设计流程归纳在一起的书却不多见。而另外一点就是市面上大部分的书，理论性都很强，其中涉及到的专业性方面的知识也比较深，新手很难从这些书籍中快速的获取知识。

《UCD火花集》是一本比较适合新手来看的书，书中涉及的知识点偏向于浅层面的，是一群热爱着UED这个行业的设计师们自我探索以及成长的过程，再加上博客自由轻松的写作特点，读者很容易理解书中的内容。

虽然书中的知识点偏向于浅层面上的，但正是这些浅层面上的内容，经过合理的组织，形成有效的知识结构，比较大范围的诠释了关于互联网产品设计的方法。从UED人员在团队中的角色定位，到交互设计到底做什么；从用户调查研究，到用户角色的制定；从产品概念设计，到产品评估和测试；从界面上情感化的文字设计，到设计规范的制定；……

除了新手，这本书同样也适合有从业经验的人士来读。新手阅读此书可以更加快速的切入到这个行业中来，而有经验的人士则可以从中获取更多经验之外的东西。

而另一类适合阅读的人士则是那些手里掌握生杀大权的BOSS们，如果他们能了解这些关于互联网产品设计的流程的话，那么在公司里的流程推动无疑比任何员工来推动都要有效。

这是一本值得阅读的书。

《写给大家看的设计书》阅读笔记之色彩

摄氏度 — Mon, 27 Jul 2009 07:23:08 +0000

做设计的时候，如何配色是经常让人头痛的问题，尽管很多时候，很多人都说对于色彩的掌握更多的是靠感觉，但是不得不说，感觉也是要有依据的。所以颜色色轮表实及家中必备的设计良药！

友情提醒：此图压缩后颜色值有误差，只为演示用，请勿以此为准！

首先需要了解是关于颜色的一些基本知识，当然本日志讲的也尽是这些基本知识，高深的等我学会了再告诉你们！

图片中的标注为“A”的即是三原色，也即是红色、黄色、蓝色，这三种颜色是无法通过其他颜色的混合来创建的。而使用这三种颜色的任意两种等量混合则可以创建出三间色（B），比如红色与蓝色的混合得到紫色、黄色与红色的混合得到橙色、蓝色与黄色的混合得到绿色。任一三原色与其相临的三间色的组合成创建出第三色（C）。

在色轮表上，相对的两个颜色即组成互补色，由于互补色中的两个颜色是对立的，所以使用其中的一种为主色，另一种颜色则用来做为强调色，可以形成比较鲜明的对比。

而在色轮表上，彼此等距的三种颜色则形成三色组，比如三原色形成的三色组称之为基色三色组，而三间色形成的三色组则称之为间色三色组。而另一种形式的分裂互补三色组则是由某个颜色与其互补色两边的颜色组成的。

色轮表上彼此相临的颜色组成类似色，不管这些相临的颜色是两种还是两种以上，他们都有相同的基础色。

对于一个设计中的颜色来说，仅仅是依靠这些基本的色调是不行的，设计中有明暗的表现，所以也就有了亮色与暗色。亮色即是向色调中增加白色，同理暗色即是向色调中增加黑色。如色轮表上所显示的，暗色的最终即为黑色，而亮色最后即是白色。

由一种色调及其相应的多种暗色与亮色的组合即称为单色组合。

在单色组合中，如果暗色或是亮色过于接近的话，就会导致画面的模糊不清晰，比如在浅灰色的背景上写上白色的字时，字体会变得模糊不清。其实这不仅是在单色组合中才会出现，这是由于色质太过于接近导致对比过于微弱而引起的。色质即是指某种颜色的特定明暗度、深浅度或是色调。

就像人类有男人跟女人之分一样，颜色也有暖色与冷色之分。暖色即意味着其中包含红色或是黄色，冷色则是其中包含蓝色。对于同等程度的强调意义来说，暖色只需要一点即可达到，而冷色则往往需要更大面积的展示。这在一定程度上与暖色是趋进型的，而冷色是后退型的相关。

哇！恭喜您找到了一个独一无二的文章。

有时用户并不需要引导

摄氏度 — Thu, 16 Jul 2009 06:37:29 +0000

很多时候，我们都在说设计需要引导用户，尤其是在对初级用户的引导上，很大程度决定着产品能否快速聚拢用户的可能；但同样很多时候，用户并不需要引导，比如下面这个表单：

四个选项的内容是相同的，但是顺序却又是不同的，用户每次看完题目又得去看下面选项的内容，几十个题目下来，用户需要重复看几十次选项的内容，仅仅是只为了确认选项的顺序！

这让我想起关于调查表单的设计，如果设计表单内容的人别有用心，那么就能得到他所想要的答案。只是不知道这个没有任何目的仅是心理测试用的表单的设计者是想引导什么！

按正常的思维这四个选择保持一致的顺序，用户看过第一个选择的顺序后，后面的题目只需要看看标题就可以很容易的答完。这本来是一件很轻松的事情，结果只因为选项的顺序被打乱，导致用户的负担暴增！

也许这个表单的设计师是想把四个选项按照用户最可能的顺序进行排列，以方便大部分用户能在第一个选项里就找到自己的答案，可是既然这是一个心理测试的表单，那么用户什么样的选择都是有可能的，保持固定不变的顺序更易帮助用户做出选择。

据官方人员给我的回复是改变选项顺序是为了测试结果的更加准确和可信考虑的，我的回复是，为了这个顾虑却增加了用户的负担，到底是否值得。

在表单设计的过程中，应该专注于表单的内容，不应带有任何的功利心，用户更不需要在填写表单的时候被设计人员牵着走，在这里用户不需要被引导！

《写给大家看的设计书》阅读笔记之对比原则

摄氏度 — Thu, 09 Jul 2009 02:12:53 +0000

假如一个页面中的文本采用的都是同样的字体、同样的字号、同样的颜色，做为读者的你能轻易的区分出哪里是标题，哪里是正文内容吗？所以通常情况下，设计师会对标题采用加大字号、加粗字体、改变字体、更换颜色等方式进行处理以使其区别于正文内容。

这就是对比原则的一个表现。

没有对比的页面，在读者的眼里就像是平静的海面，视线可及之处没有一个焦点；当出现了对比，突出了视觉重点，也即意义着平静的海面上有个小岛之类的可以吸引住视觉焦点。

对比要强烈！这是书中一直强调的一个观点，其本意应该是通过视觉上的强烈差异化来增强页面的效果，以及强调元素之间的差异性。可是这个强烈依然涉及到一个度的问题，过于强烈的对比，很有可能导致读者对于在页面中处于对比弱的那些元素的忽视。

纸面及网页这两种载体有着各自的局限性，在对比的处理上，网页所受到的局限性会更大。比如在字体的对比上，这一点尤其是在中文网页上，利用字体进行对比处理的局限性相当之大，因为系统默认带有的中文字体不多，所以很多时候在中文网页上对于文本的对比处理依然是在字号、加粗以及颜色上面。

对比元素可以做为重复元素来使用，而与亲密性原则对元素的归类组织类似，对比原则除了可以增强视觉效果外，同样有助于信息的组织。

亲密性、对齐、重复、对比，这是四个相辅相成的设计原则，单一的处理方式并不能给设计带来多大的改观，但当同时应用这四个原则的时候，虽然不可能说让设计变得非常精美，起码也可以让读者在扫视后快速正确的获取到设计中所想表达的内容。

《写给大家看的设计书》阅读笔记之重复原则

摄氏度 — Wed, 08 Jul 2009 00:30:55 +0000

通过亲密性原则，我们可以将一个页面中的元素按照某种逻辑理解上的差异划分成不同的元素组合；再通过对齐原则，使这些不同的元素组合在视觉上看起来彼此相关。

不同的元素组合之间的关系可以是平等的、从属的或是毫不相关的，这些元素组合之间的关系在视觉上仅靠亲密性原则以及对齐原则并不能完整的呈现。比如两个平等关系的元素组合，虽然通过亲密性原则使其之间保持一定的距离，再通过对齐原则使其在一个页面中看起来彼此相关，但如果这两个元素组合使用不同的字体以及字号，我们依然无法从视觉上辨别出它们之间的关系。

拥有良好的组织性，同时保证了元素间的统一性，但很有可能缺乏一致性。这样的页面设计会成为妨碍读者通过视觉快速获取页面正确的内容的关键。这就需要使用到第三个原则——重复原则。

同样的顶线及底线、同样是两端对齐的方式、同样的字体及字号，还有三角形。这两个页面有太多相同的东西，所以很容易从视觉上快速判断出这两张纸是属于同一本书里的内容。

这就是重复的力量！

重复原则并不仅仅只是表现在字体上，页面中任何一个元素都可以成为设计中重复的对象：字体、字号、颜色、图案，甚至是版式。

犹如在上一个对齐原则中所说的一样，规则是可以打破的。在设计中使用到的重复元素并没有规定必须保证高度的一致性，高度的一致性很有可能会导致页面设计的呆板无趣。

同样的字体及字号，可以使用不同的颜色；同样的形状，可以使用不同的大小……这些都是可以使重复性在页面上的运用不会那么枯燥的方法。

就像大部分单一的设计都会让人感到无趣一样，在设计中使用单一的重复元素，仍然会让设计显得枯燥无味，然而物极必反的道理也是通用的，过多的使用重复元素则会让页面显得凌乱。

这里就涉及到一个对比度的问题。

《写给大家看的设计书》阅读笔记之对齐原则

摄氏度 — Tue, 07 Jul 2009 00:46:30 +0000

如果说亲密性原则是对元素的归类组合，是将元素之间逻辑理解上的差异在视觉上表现出来，是属于信息分类的话，那么对齐原则即是在视觉上串起这些差异化元素组合之间的那根线，即是保证元素之间的统一性。

虽然亲密性原则说的是在逻辑理解上没有关系的元素组合之间应该以更远的距离表现出来，但对于同一个页面内的元素组合而言，它们都是围绕着同一个主题核心的，它们的差异性在逻辑上只是同一个主题的不同属性而已，所以需要一种方式，让页面中的所有元素看上去统一、有联系而且彼此相关，将这些不同元素之间的关联在视觉上表达出来。

这种方式，即是对齐。

对齐的方式可分为左对齐、右对齐、居中对齐以及两端对齐。虽然对齐的方式有多种，但并不意味着可以在一个页面中使用多种对齐方式，那样只会让页面中的元素显得凌乱，而在页面中只使用一种对齐方式将会使页面统一而有条理。

在这四种对齐方式里，左对齐或是右对齐是最经常被使用到的，而对于有一定行长的文本而言，两端对齐也是一个好的方式，而居中对齐则是四种对齐方式中最不推荐使用的对齐方式。因为对于读者而言，居中对齐可能导致视线的跳跃性太大，尤其是当页面中存在大量文本，那简直就是一种灾难。

在明白对齐的规则之后，可以试着有意识的去打破这个规则，然而即使是打破对齐规则的设计，在更大的范围之内依然是遵循着对齐原则的。

从上面这个图中可以看出，那一小段引用的文本，虽然在页面的元素之间是打破了对齐规则的，但是其仍然与标题是左对齐的。

对于打破对齐规则的设计的好坏，关键在于其在对齐性上所针对的范围。

购买链接：写给大家看的设计书(第3版)

《写给大家看的设计书》阅读笔记之亲密性原则

摄氏度 — Mon, 06 Jul 2009 00:39:27 +0000

也许光从字面上来说，版式设计中的“亲密性”似乎不太好理解，正常的情况下，我们都会把“亲密性”理解为人与人之间的关系的一种表现，事实上在版式设计中的“亲密性”的确也有类似人与人之间的关系的意思。

也正是印证了那句话——物以类聚，人以群分！

“亲密性”的原则即是将逻辑上存在关联的元素排列组合在一起，使其被看作是一个密切相关的整体，而不是一堆杂乱无章的元素。

从书中所给的例子，可以看出版式设计中的“亲密性”实际上是对信息的分类整理。即是通过这个“亲密性”原则，对页面中出现的杂乱无章的元素重新组合，使其有一个清晰明了的结构，可以让读者在最短的时间内获取页面中的正确的内容。

进行“亲密性”原则设计的第一步，即是对元素的归类组合，将页面中所需要出现的元素按照某种逻辑进行归类划分，对于同一组合内的元素在物理位置上赋予其更近的距离，而不同组合之间的物理位置显然要更远。

这也是页面留白设计的一个核心。

然而对于一个页面的设计来说，仅仅只是依靠“亲密性”原则并不能解决问题，除了“亲密性”之外，在页面的设计中还需要使用到对齐、对比、重复等原则，“亲密性”只是版式设计的第一步，更多的意义是在于对元素的组织性上。

购买链接：写给大家看的设计书(第3版)

关于淘宝商城新版的一点看法

摄氏度 — Fri, 26 Jun 2009 02:34:31 +0000

虽然淘宝商城的名字中带有“商城”两字，但是很显然的，淘宝商城并不是一个B2C商城，淘宝商城仍只是一个C2C平台，充其量只是个收费版的淘宝。

在淘宝首页努力精简化的时候，淘宝商城的首页依然臃肿，导航臃肿、分类臃肿、商品信息臃肿。犹如国内门户网站一样，恨不得把所有内容都搬上首页。

琳琅满目的商品，花花绿绿的图片。适合无聊闲逛的用户，但却不适合有着明确目标来购物的用户。

淘宝商城这次的新版相对来说则显得更专业，更有B2C商城的味道，虽然本质上其仍然只是个C2C平台。

新版淘宝商城最大的改变当属导航部分的设计，原淘宝商城的首页有众多的导航，头部的大分类导航，中间的类目导航，下部的每个大类目下的细分类目导航，还有头部的搜索（从另一种意义上讲，搜索也是导航的一种）。整个页面中充满了导航，而在这些导航中，大部分都是重叠的。而在新版的淘宝商城中，关于导航这一块则是相当的简洁清晰，只剩分类导航以及搜索，这两个导航处于同一等级上。

而让人无法理解的是，淘宝商城首页的布局采用的是自动伸缩的，限定了最小宽度却没有取定最大宽度，当屏幕分辨率足够大的话，两个商品之间的间隔不敢想像，下图是我在1280分辨率下的截图：

清晰的结构，合理的分类，突显的商品。新版的淘宝商城是个值得学习的好设计。

淘宝商城旧版截图留念：

用户的期望以及背后真正的需求

摄氏度 — Thu, 18 Jun 2009 05:51:09 +0000

很多时候，设计师们都会通过各种渠道去了解用户的需求，然而从这些渠道反馈回来的信息大部分只是用户的期望并不是真正的用户需求，但是很多时候这些期望往往就会迷惑到设计师，从而认为这就是背后的真正需求。

所以，设计师在得到用户的期望信息后，还需要进一步的分析出隐藏在这些期望背后的真正需求。

引用一个古老的例子，当年福特从用户那里获得的信息是用户需要一匹更快的马，这里用户的期望就是一匹更快的马。可是这只是表面上的用户期望，隐藏在这个期望背后的需求其实并不是马，而是更快的“速度”，用户真正的需求是速度。所以福特给用户的不是一匹更快的马，而是更加快的汽车。

大部分用户的期望都是基于眼前的需求，而眼前是一个流动的状态，这个期望是随时都有可能变的，所以只有更加深入的分析挖掘用户期望背后真正的需求，才能设计出用户真正需要的产品。

用户体验在商业利益面前什么都不是

摄氏度 — Thu, 11 Jun 2009 05:32:41 +0000

以用户为中心的设计、用户体验，这两个词现在在互联网上几乎随处可见，除了设计师外，很多的用户也都在说这两个词，于是我们经常会听到诸如“这里用户体验不好”之类的话，仿佛“用户体验”这个词为批评设计差找到了一个着落点，而且这个着落点还很多，动不动就以专业的用户体验来说事。

正如之前说的《以用户为中心的设计思想不完全正确》，用户体验也并非就是王道。

且不说那些点击头条新闻跳转到栏目首页而非新闻内容页的行为，也且不说那些弹窗广告们，也且不说百度搜索结果中掺杂的竞价广告，更且不说为了利益页在用户电脑上留有后门程序导致六省市断网的暴风影音……

用户体验在真正的商业利益面前什么都不是！

在真正的商业利益面前，用户体验只能是折中再折中，一切以满足商业利益为前提。

比如QQ2009中聊天窗口的侧边栏，可收缩的设计本来是个很好的创意，但收缩只能是在当前聊天窗口里，一旦关闭了当前聊天窗口再打开侧边栏仍然是展开的，而在QQ2009 Preview3及之前的两个版本，这个收缩侧边栏是可以一直固定的。

收缩聊天窗口的侧边栏可以在一定程度上的减少对聊天内容干扰，但如果这个侧边栏可以长期固定收缩的话，无疑对QQ秀业务是个很大的打击，直接就会影响到腾讯的收入，所以在QQ2009 Preview4加入商业性质后，这个设计就只能折中了。

QQ2009仅是无数在商业利益面前折中设计的例子中的一个，正如Keso所说的“你连用户体验都舍不得破坏，你怎么能赚钱呢？”！

不要把用户体验看得太高，商业利益才是框住设计的规则。

更新：看到有朋友提示，在QQ2009的设置 – 好友和聊天里面有设置总是收收侧边栏的选项，但这仍不是方便的选择，这依然是个折中的设计。

有啊在设计上相对淘宝的优势

摄氏度 — Thu, 21 May 2009 05:15:00 +0000

任何一个行业里，当有一头近乎垄断的大象盘踞着的时候，生活在大象身后的蚂蚁们既是悲哀又是幸运的。悲哀的是市场已近乎被大象垄断留给他们的空间已经不多，而幸运的则是大象在走向垄断的过程中给他们积累下的可供学习的经验，这可以让他们少走很多的弯路从而更快的接近成功。

淘宝在国内的C2C市场上就是这样的一头大象，有啊则更像是生活在大象身后的蚂蚁们。蚂蚁想要推翻大象，那几乎是不可能的事情，但蚂蚁可以在大象踏平的道路上更快的成长。

当有啊在互联网上诞生的那刻起，就不可避免的要听到“抄袭模仿淘宝”之类的声音。虽然抄袭是种可耻的行为，但模仿却不可耻，相反值得夸奖的是在模仿之后的创新。淘宝在国内C2C市场上已经走过好些个年头，这些年走过的弯路积累下的经验，这些都成为后来者们宝贵的财富。

对于一个好的设计或是一种成功的模式，模仿它并不是什么见不得人的事情，因为模仿之后需要面对更大的压力，那就是如何从这个模仿中做出创新来。一味的模仿即等同于抄袭。

淘宝有着庞大复杂的用户群，所以每一次设计的改变都可能会有着较大的影响，这也就是之前淘宝大规模升级后结果导致众多卖家反对的原因。但是这些出现过问题的设计，到了有啊那里就可以进一步的优化从而得到更好的设计展现。

大象每跨出一步都是艰难的，而蚂蚁则可以在大象踏平整的道路上发现更多沿途的风景。