Help项目结束了,写了一份心得,与大家共勉。不知道大家是否有用过或看过之前我们的help频道,下面截了几张改版前后的屏幕截图:

help首页:

老版本help首页
改版后help首页根据用户群的不同区分为新用户首页和老用户首页:

新用户看到的:

新用户首页
老用户看到的:
改版后老用户首页

具体为什么这么改,我这里没有讨论,在这里跟大家分享的更多的是做这个项目的过程中所体会到的,所学到的有关如何做项目的一些体会,希望对大家有帮助。下面把我的一些个人感受写下来,其目的一是为了对自己工作的一个总结,项目的心得体会只有总结提炼出来才是自己的宝贵财富,才是自己的积累;其二是想把工作中自己遇到的一些问题写出来,可能这些问题不光我会遇到,其他的同学也会遇到相似的问题,写出来跟大家交流分享。

一、接需求

现在我们在接到一个需求后,先不要急于了解需求具体要做什么要改什么,要先了解了解需求前提,这个需求提出的原因,为什么会有这个需求,为了解决什么样的问题,不解决会有什么后果,解决了会带来什么好处,需要多少代价解决,把需求要解决的问题拿来作为以后项目实施的检验物,在具体做的时候多想一想这样做是否真的能解决问题,项目发布后也可以拿来做结果的验证,通过项目是否真的解决了这个问题。

然后去仔细了解项目/需求具体要做些啥,需求所涉及到的改动范围,涉及到的功能点,针对每一个改动点做细化,深入了解其骨髓。例如:在help改版需求里有一个要增加help搜索功能的改动点,表面上看起来很简单,只要在search框上添加一个help下拉菜单就可以了,实际实现这个改动并不简单,首先我们的help detail数据跟news数据一样,都是通过news后台输入的,如果用户在help里用search,通过什么样的方式过滤掉news 而只调help的数据,如果用户在community里用search来搜news,如果他用的词是newshelp交叉的词汇搜索,会把newshelp一并搜出来,这时候是否要过滤掉help,如果过滤是否技术可行,投入成本如何,如果不过滤那是否要在前台展示层面做区分。这些问题只有做了深入了解并加以解决,需求才能实施顺利。

二、出方案

在仔细了解过需求后,下面就是出方案了,在具体做方案前,先做一个前期的research,这个可长可短,根据项目实际情况而定。但还是要有的,有必要花一些时间去看一些同类网站同类产品做为参考,可以扩展自己的思路。也能为自己穷举方案提供借鉴。

具体出方案要做到全面,之前做需求出方案往往只出个首页,里面页面认为简单就基本省略了,其实线框方案出全面,有两个好处。一,对自己来讲,有利于将自己脑子里想的东西输理一遍形成于纸上,从而让自己的观察角度放在一个频道整体去看,而不是仅仅在做一个首页的改版;其二,对于线框图方案确认后做精确化时间预估时,为前端估资源提供一个明确的依据,在help项目里这点上其实是做的不好的,help基本上是只出了2种状态的 help首页,里面的页面并没有出最终版的线框图,导致后来新前端进来,对要做的工作是不清楚的,也就没有办法做出资源评估。当然最后的解决办法是只让新前端评估和制作首页的部分,其他的页面是只存在在自己脑子里的东西,就只有自己清楚了,这部分工作是只有自己去搞定了。

三、制定可执行时间计划表

方案确认后,根据方案将需求进行拆分,分解出项目/需求各节点/里程碑,拆分的越精细项目就越可控。需要考虑的是每个节点所需的参与方具体参与时间,在这个节点上需要协调的因素,然后就到项目中的执行了。

四、项目中的执行

在这一阶段就是去执行你的时间计划表了。逐一对项目各节点进行把控。就像安装windows的进度表,整体进度拆分成若干段逐段完成控制住了这些节点/里程碑,也就控制了整个项目。要是真的在这中间有什么问题发生,也能清晰的看见是发生在项目的哪个环节,从而方便我们后续分析跟进,找出问题原因并解决。

五、发布后的总结,后期数据检验

项目发布后,看看项目进度表,针对项目各环节里出现的问题,想一想下次如何改进,写项目心得,将体会和感受提炼出来,这样才是自己的。

后期通过数据采集,去检验项目之前制定的目标是否达到了,要解决的问题是否真的解决了,如果没有,需要进一步去分析原因,总结经验。

附注团队里其他同学给的建议的一些节选:

From Panda:

对于所有设计师而言,在“接需求”这个阶段,不但要搞清楚需求方为什么要做这个项目,更要搞清楚这个项目是给什么人看的,这些用户对于这个项目的期待是什么样的,也许是可以写下来,项目发布之后来验证的。

From Heidi:

这些心得,若是我们在书上见到或者听别人说,也许都会觉得稀松平常,经常念叨着,而只有自己亲身经历得到的,才能够引发共鸣,记忆深刻。

Jacky这篇心得,看似也是很简单,但是在日常项目里,也许我们还会不自觉走向反面:

1. 一接到需求不多问几个为什么就迫不及待去做方案

2. 想得不够详细,方案只出了一层皮,日后修修补补

3. 方案缺乏说服力——因为调研不够,在评审的时候,别人问你有没有看过竞争对手的网站,才慌不迭去“研究”

4. ……

最简单的往往是最容易被忽视的,也往往是最重要的,就像所有知识和技能的“基础”一样。

From rita:

喜欢新版本help,附上的心得体会也很方法论,讲求方法可以帮助我们少走很多弯路,顶“先了解需求前提”,往往很多时候被忽略,一开始就钻进细节里,先把握大局可以让方向更准确。

From yama:

“人类总得不断地总结经验,有所发现,有所发明,有所创造,有所前进。 ”

通过总结可以把零散的、肤浅的感性认识上 升为系统、深刻的理性认识,从而得出科学的结论,

以便发扬成绩,克服缺点,吸取经验教训,使今后的工作少走弯路,多出成果

继续贴,并预告我们还有续集,也许会写中文版,哈哈

This post continues to showcase how faceted search is deployed with a view of improving user experience. The last post presents a set of websites using left column to narrow down search results. TG would like to show some exemplary sites which take a different approach - faceted search at the top.

First and foremost, TG is particularly thankful to Hbeidi Xie, who contributed and shared her experiences in coming up with a faceted search design solution. Heidi noted that the design should be based on use case; a comprehensive users’ task analysis and user behavior pattern are crucial to the success of creating an effective search tool.

Oftentimes, website functions and features are launched without conducting a prior research. Many would argue that there’s a strong need of time-to-market, hence everything has to be done fast. Right!! only if the product is what users want and how they want it to be.  TG agreed with Heidi that there’s no perfect solution as it may become obsoleted as time passes by. A workable design solution to a particular product is what we care.

Should the faceted search be positioned at the top or on the left?  TG think it does not matter. So long as the tool is simple enough to help users perform their tasks and get what they are looking for, we shall accomplish our jobs.

Wikio.com :

An information portal with a news search engine that searches press sites and blogs. TG is fond of vertical display of faceted search in particular as it does not require any scrolling, all attributes are condensed at the top and accessible in many occasions.

Faceted Search_Wikio.com

Overstock.com :
TG comes across Overstock.com two years ago and keeps using it as a reference. The site is very simple to use, seldom do I have trouble in finding the items I need. Its facets search is one of best I have ever found so far.

Faceted Search_overstock_by Kelikuru.com

like.com :

It claimed to be the fist true visual search engine where the contents of photos are used to search and retreive similar items. Unlike the above two sites, like.com hides all attributes and facets at the top. Hovering our mouse on a row of tabs next to “Refine by”, users will be able to access a wide selection of facets.

Faceted Search_like.com

延续上篇

We have briefly discussed the barriers of designing faceted search and we need some inspirations from current design by other site operators. Actually we are not alone, there are many of them working on different types of solutions in an attempt to offer a painless Faceted Search user experience. This post showcases some of the exemplary websites in shopping category mostly. The first set has its faceted search built on the left.

Yoox.com :

A global internet retailing partner for the leading fashion & design brands. It has a very simple faceted search to begin with – top designers and top categories.

Faceted Search_Yoox

Buzzillions.com :

A product review site. TG found the site is exceptionally clean, stylised wth minimalism design. Its faceted search tells users how many products are found upfront, what filter(s) has been applied during the process of searching

Faceted Search_Buzillions

Yahoo Shopping :

Part of Yahoo! family of site, the site has a clear indication of what the users are looking for _ Women’s Sunglass by using a bold header and small tagline. Tabs on the left hide and show a number of facets on each attributes.

Faceted Search_Yahoo Shopping

Target.com :

An online retail store in United States. The C2C shopping site has a nice play of red and white colors, key items jumps out from the white background.  Site designer tries to control the number of attributes to be displayed above the first fold in the first place, which reduces the painful experiences of scrolling up and down

Faceted Search_Target.com

PriceGrabber. com :

A site that can allow users to compare the prices on all the most popular products. The strength of the sites’s faceted search is to allow multiple selection of filters and do it in one-go. Yet, the knife is not double edges, user may find it annoying to scroll down and click on the Update Results button

Faceted Search_ PriceGrabber


从超级低调的TG同学上COPY过来, 曾建议过他用中文写report, 他说这要把他逼疯掉,呵呵。

Faceted Search- a guided navigation tool with growing popularity in web 2.0 age. There are many ways to call it before: refined search, filtered search, narrow-down search or even vertical search. The naming convention has become a de facto standard for e-Commerce, product-related shopping websites and most often in travel industry.

Being lost in a search maze is a big disaster to many users, site operators have suffered most eventually. With faceted search, it is destined to help increase findability and speed up search for a desirable item.

Get lost in search maze

In designing a usable faceted search, TG found the major hurdles coming from:

  • Too many facets, values and attributes that stakeholders want to display online. They thought the more options provided to users, the more useful and usable they are. Jakob Nielsen in his latest email - “Guesses vs Data as basis for design recommendations” mentioned that excess features can hurt review and users are not quick learner, they tend not to learn

We see how little users care about learning fancy Web techniques. People just want to get in, get their stuff done, and get out. They don’t want to learn.

  • Lack of complete understanding of use cases as a result of not having a full analysis of user’s search patterns and behavior, making it difficult to display facets in different scenarios with levels of importance
  • Attributes are not mutually exclusive as taxonomy is not well-designed. Users will find facets missing while making their choices
  • How to create an effective layout to interact with users? Should it be on the left or at the top? How to capture users’ attention without distracting them from product display? How to create an initutive user experiences in using the facets? How to reasonably group the facets and values according to users’ expectation? How to indicate the facets are selected and unselected. There are many questions to ask in the interactive design level

Authored by Stephanie Lemieux, “Designing for faceted search” gave us a shortlist of Dos and Don’t in using the search tool.  While working on a project to improve faceted search, TG found it a big help in referring to the guidelines.

Another good article is from Jep Castelein, who has done studies in “10 Rules for Faceted Search on Travel Sites”