V5.0之后,我们总结了一些得失。首先要说的是改版的动力。产品设计或产品升级的驱动力只有两个:用户需求和网站目标。之前的我们的多次改版,其驱动力更偏向于后者。并不是新改版的规划不考虑用户需求,而是我们还在不断改进和调整网站目标。当然希望下一版,我可以启动用户需求驱动。
接着说一说如何在Web设计中如何很好的实现以用户为中心的设计。就需要有一个基本的逻辑:即UCD是可以和软件工程一样,形成一套科学的方法论,并且需要有效地嵌入到产品设计和开发流程中。
我刚入行的时候把UCD看成一种偏感性的设计理念,我想很多人会跟我一样的观点。比如,我们能指出某个产品设计的不足和某个失败的交互,但这还只是凭借观察体验和一些思路得出的认知。但其实UCD是一们科学的体系。并且UCD已在ISO13407中有非常清晰的定义(同样的可用性在ISO9241-11也有明确定义):
a) 用户积极的融入及对用户和他们的任务需求的清晰理解;
b) 用户与技术之间一个合适的功能定位;
c) 设计方案的迭代;
d) 跨学科的设计。
建立这个逻辑之后,我们聚焦到web设计上来。这里推荐的是Jesse James Garrett在《The Elements of Web Design》的经典web设计模型,非常理体系化。

上图的很多标识不够清晰,更详细版本大家可以点击这里查看。
Jesse提到了web设计的两条线:作为软件的web设计(Web as software interface)和作为超文本的web设计(Web as hypertext system)。前者是任务导向(task-oriented),后者是信息导向(information-oriented)。然后在两条线上有或者交叉或者独立的方法来演进。这个模型狂赞不止哇……
最后说说衡量UCD效果这个问题:用户满意度和用户推荐度。
要想在不宽裕的页面展现丰富的内容,现在通用的做法使用tab,在一块区域通过tab切换来更换该区域的内容。这篇文章分析了tab设计很在理,今天我也谈谈我抓了几个案例,谈谈对tab设计的看法。在实际案例中,我们看到了一些好的设计,也有些我不赞成的设计,稍做分享。
我的意见是合理的tab设计应该是这两种类型:
第1种 鼠标单击切换。此种情形下tab是没有链接的(但是在选中的tab区域内增加 更多或者more链接)。
第2种 鼠标悬浮切换。此种情况下很多tab都加了链接,所以 a:hover 应该生效,也就是鼠标停靠时有下滑下或颜色等提示。其实这也是Norman设计理念里,对于用户恰当Feedback(反馈)的实践。
案例一:yahoo美国首页,属于第1种tab设计,但是注意右下角的框框哦。

案例二:淘宝首页的tab设计有三处,但是仔细看一下,却发觉各有差异。比较疑惑的是,为什么首页只有3个tab设计,但是却各不一样呢?难道一个页面需要多个前端介入?

第一个tab设计属于单击切换,无附加链接。(顶)

第二个tab设计属于悬浮切换,但是没有 a:hover 来反馈tab上的链接。(扁)

第三个tab设计属于悬浮切换,添加了 a:hover 反馈tab上的链接。(顶)
案例三:QQ弹窗。

最不招人喜欢的QQ弹窗,tab上也没有链接反馈,相信qq.com的流量很多是被这样无辜地骗来的。(扁)
插播一段:我一直对QQ弹窗的设计有微辞,一个只能放5个tab的位置居然间接的放了7个,于是不得不多出一个左右翻滚tab的设计。至于增加一个看起来意义不大却比较显眼的 [您可以拖动该页卡进行排序] 真正价值有多少。
Saidy设计与用户体验是关于最新一期EDM的文章。这个总结很棒,相信会使后续EDM更高效。这里,我站在需求和项目掌控的角度,重新梳理一下发送一封对用户友好的EDM的要点。
1、内容策划。
在我掌管EDM之后,我极力将产品信息提升至重要位置,尽量淡化市场内容。新产品、老产品新功能属于Products信息,价格折扣信息属于Sales信息。但是Marketing内容应该淡化,我的观点很明确,用户不需要软文。(当然,营销类邮件和订阅类邮件的内容部署又有差别。)当然不管你内容多拽,一定要提供邮件的页面阅读地址及提供退订。
2、视觉设计环节与用户调研
详细见Saidy的设计与用户体验一文。
3、前端环节
满足不同邮件服务提供商、不同浏览器、不同邮件客户端对于前端工作是个挑战。本次EDM第一次强大的兼容了126、163、QQ、gmail、hotmail等众多邮件服务商。不过行距处理上还需要再改善。
4、发送阶段
邮件发送工具(这个东西可以提高效率,估计不少邮件Spam有更牛X的工具);
发送时间(两封邮件相差6秒以上,运维同事反馈10秒为佳,这样可以保证EDM达到成功率);
邮件服务器(多几台机器,过几个IP来发送,可以有效防止被当做垃圾邮件)。
5、结果反馈
整体发送使用时间(要知道超过10W以上的邮件数量,这个数量就需要考察时间与效率问题了);
退信数量;
退信中各邮件服务商的退信比例。
其实这个项目很简单,需要协调各部门和各种资源,但是这些基本功一直不扎实。如果成为一家令人尊敬的公司,就要注重产品本身,注重用户体验,精力放在KPI上不靠谱。将职业规划定位在产品经理的我非常坚定的认为优秀的产品 + 社会化口碑营销才是王道。
小朱写了一片非常好的blog《爱恨交加的HTML邮件》。我之前也写过《EDM又被当垃圾邮件了?》。这个话题对于商业类网站而言其实很重要,今天再来叨咕一下。
>>从邮件设计角度看:
1、提供退订地址。
2、提供邮件的网页版地址。比如明显处提供:邮件如不能正常显示请点击这里。这样对邮件样式可能错误的修正。(小朱请回答:现在我们发送邮件样式,是怎么绝对路径加载的,还是直接写在标签里的?)
3、邮件的宽度要窄。邮件宽度应该<800px,否则出现横滚动条,就囧大了。主流显示器分辨率为1024*768,除去各类邮箱界面和邮件客户端的sidebar(竖边栏导航),800px是比较保险的宽度。(啰嗦一句1024*768分辨率下,gmail给真正邮件的宽度约是600px,其余的约424px是边栏和adsense广告。)
>>从邮件制作内容看:
1、客户的响应邮件准确到位。比如会员在执行注册、购买、变更记录等操作时,邮件要发,而且要及时。
2、营销部门(价格策略)、市场部门(会员活动方案)、运营部门(会员积分体系)等需要协调协调邮件内容,邮件出口一定要单一。千万别你妈的几个部门分开发。
3、不要给会员发软文吹自己牛逼,发送折扣信息,通知积分兑换状况等等。比如,我是索尼单反用户,索尼月刊发布的内容基本是与单反有关的信息,索尼发布战略会的内容跟丫用户有啥关系,要以用户为中心。
4、针对不同级别的用户发送不同的电子邮件。 注册用户、购买用户、购买额度超过XX元的VIP用户、深度使用用户,邮件应该有针对性。不过需要建立在整站完善的积分体系上。
分享一下公司管理论坛的《可用性设计的若干重要概念和原则》一些收获,演讲人是人大教授毛基业老师。其实演讲的核心内容是Donald Norman的《The Design of Everyday Things》。我在Amazon上搜到了英文原版,可惜还是邮寄不到国内来。Norman的理念确实很强大,被称为设计者必看书籍之一。
1、Norman对于设计提出的六个重要概念:Affordances (受用性)、Constraints (限制)、Mappings (映射)、Feedback (反馈)、Visibility (可视性)、Mental Model (头脑模型)。
2、用户体验从产品交付那一刻就开始了,包括说明书、帮助文档等。
3、一致性,如果没有更好的理由,坚决不要破坏产品的一致性。
4、designer’s design model应该尽量接近user’s model。
最近参加了不少地面活动,非常遗憾的是没有参加小辛说起的用户体验年会。