现在很多朋友都不止一个账户,不止一个密码。 忘记账户名、密码,或账户名、密码输入错误也就难免啦。每当这个时候,你是否和我一样会有小小的焦虑产生呢?网站给予了什么样的文字帮助,就显得非常重要 了。什么样的文字更有助于解决问题,同时也让人觉得舒服?以下我们来做些比较:

一、账户名和密码都没有输入,就点登录

问题分析:这种情况可能出现在新手用户身上,或者忘记账户、侥幸点击登录的情况下

文案关键点:照顾到新手

  1. 谷歌

    “此时我们无法让您登录到您的帐户”,本来是用户的操作问题,但语气上把问题归因于google自身,是我们无法让您……,而不是您不能……。

  2. Uk.match.com

    Oops! 是通俗而流行的叹词,适合match偏年轻的用户群。“Please enter”直接提示操作。

  3. 豆瓣

    这里有一段针对新注册用户的帮助文字“如果你刚刚注册……谢谢你的理解。”重点关注已注册而email未被确认的用户,因为按照规则这些用户尚不能登录,而这可能是他们原来不知道或忽视的问题。

  4. msn中国

    最基础的提示,照顾到新手用户,但并不显得罗嗦。

二、密码没有输入,就点登录

问题分析:这种情况可能出现在新手用户身上,或者忘记密码、侥幸点击登录的情况下;也可能是用户没注意到需要输入密码

文案关键点:说明问题(没有输入密码)、规则(必须输入密码)或提示操作(输入密码)

  1. 谷歌

  2. msn中国

    直接说明规则。

  3. 百度

    如果用户没有输入密码就点击登录,那么这里不会出现任何新的文字提示;也就是说,默认用户自知自己没有输入密码,也清楚没有输入密码就不能登录;系统也就没必要多说什么了。

  4. 淘宝

    简短有效的提示,直接说明问题,默认用户知道需要的操作是输入密码。

  5. Myspace中国

    “不能为空”,这看上去更像是开发者的表达方式。

  6. Uk.match.com

  7. 豆瓣

    直接说明所需要的操作。

三、密码输入错误,点击登录

问题分析:出现这种情况可能是因为用户忘记密码,或者密码输入过程中发生了自己未察觉的错误

文案关键点:在明确问题、规则、操作的基础上,尽可能涵盖可能的错误情况;不归罪于用户

  1. 谷歌

    直接说明问题。一个小问号“?”表示“帮助”,代替了更多话语,也符合用户认知习惯。

  2. 百度

    摆明事实,提示操作,直截了当。

  3. 淘宝

    相对于“密码错误”,“密码不匹配”是更加准确和中性的描述。

  4. Myspace中国

    “不太对吧,重试一下?”口语化的提示,用商量的语气。

  5. Uk.match.com

    中文意思是 “啊哟!我们没有认出你输入的用户名或邮箱地址。请确保拼写正确。记住用户名中只能使用字母、数字和下划线。”和谷歌一样,把问题归因于自身,并且预见了用户可能出现的具体操作问题,给予手把手般的辅助。

  6. 豆瓣

    “请再试一次”语气比“请重新输入”柔和了许多。

  7. msn中国

    很多时候,“重新键入”是解决不了问题的,因为用户根本就是彻底忘记了密码。这个时候“或是注册一个新的帐户”就是有效的提示之一。

有些提示文字,像是老师,手把手教你怎么做;有些呢,像是一位工程师,只提供清晰简短的提示,能不说就不说;有的,像是朋友,帮忙的同时不忘开些小玩笑;还有的,什么都不像,就是冷冰冰的系统提示,可它也是人写出来的:)

你喜欢哪一种?

前后端分离的开发模式,原本觉得没什么稀奇的玩艺,在最近参与的一个大型项目中,让我有了更深的理解。

前后端分离的开发模式:系统分析阶段,系分和前端开发人员约定好页面上所需的逻辑变量,进入功能开发阶段,前端开发人员进行前台页面结构,样式,行为层的代码编写,并根据约定好的变量,逻辑规则,完成不同情况展示不同的表现。而后端开发人员,只需要按照约定,赋予这些变量含义,并提供前后端交互所需要的数据即可。

以前自己在php上玩过mvc开发框架,但是没有在这么大型的项目中实践过,所以过程中暴露出一些问题,也说明现实和理想还是存在一定差距的。

对项目中遇见的问题做了如下纪录:

A.对交互白板的理解不足,如:对ajax实现大批量数据交互的实现,没有及时给出改进的建议

B.系分阶段产出的约定变的非常脆弱,开发过程中不时有新的东西和变更的东西出现,这就导致后面的前后端协作开发有些纠结

C.项目过程中,由于前期与需求方,设计师,系分的沟通力度不够,导致开发过程中发现很多考虑的不够周全的地方

D.项目开发过程中前后端开发资源的配比上较为悬殊,在后期频繁需求变更中,前端一直处于:勉强应付状态


More »

1. 不要让用户先注册再去选商品。

顾客们是来买东西的,不是来填表单的。所以需要确保用户在付款过程中完成了注册,而不是付款前就去注册,也不是让用户把商品放到购物车里之前去注册。注册表单的需要用户花功夫去填,注册过程中还可能有问题,所以这会成为用户顺利完成购物的障碍。

Taget这个网站就是当用户真正要把钱付了的时候,才让他去注册的。

在 购物流程中,把注册这个麻烦往后面移,能使最后购买商品的用户大大增加。用户既然一开始就花了很多时间选购他们想买的东西,那如果在付款的时候因为注册麻 烦而离开,前面选购商品花的时间久白费了。但如果用户还没开始选商品酒让他去注册,这时,他们还没花时间成本,就更容易选择离开。

2. 如果这个商品有货,明确地告诉用户

对商品有的库存数量需要明确地告诉用户。如果商品没货了,要早些让用户知道,避免用户购买时往后操作了好几步才发现原来商品没货了。不仅要在商品介绍页面显示库存数量,在用户搜索商品的结果页面也要显示出来。

Overclockers 在商品列表中,就列出了详细的库存数量信息。

另外,如果某个商品现在缺货,但最近就会进货了,可以提供给用户一个预定的功能,这样不急着买这个商品的用户,过几天来就可以买到了,他也不用担心过一阵子来买时,商品又售空了。

3. 让用户很方便地修改订单

每个人都可能出错,用户有可能在购物车里放错了商品,或者要付款的时候改变主意了。这时,要让用户在付款的过程中能修改他们购买的商品,如果不能修改他们可能就离开了,而能修改的话,就赢得了许多潜在用户。

IconDock 就让用户通过输入框中的数字,很方便地修改购买的数量。

如果用户想把商品从购物车中删掉,不要让他们在输入框中输“0”这个数字来删掉。还是提供“删除”这个链接比较好,通过点“删除”,可以让他们把商品从购物车中删掉,这样修改既快又简单。

4. 在用户操作过程中,提供给他们实时的帮助

因为付款过程需要用户输入信息,而用户很可能在这个过程中碰到问题,这些问题不一定能靠有限的几个界面来解决。这种情况下,提供给用户专业的,一对一得帮助,要比给他们一个宽泛的帮助(比如“常见问题”的页面)好很多,类似“常见问题”的页面不一定能解决用户碰到的问题。

在“戴尔”的购物网站上,用户就可以通过咨询电话和在线客服获得帮助。如果用户在付款过程中碰到了问题,她可以立刻咨询客服获得帮助,问题几分钟内就轻松解决了。

在用户付款过程中,提供在线客服或电话咨询的帮助是个非常好的主意。不过不是所有公司都能负担得起那么多客服成本的,大中型公司可以考虑这个方法,特别是那些网上付款流程比较复杂的公司。

5. 使“返回”按钮充分起到作用

“返回”按钮是网页浏览器中最常用的按钮之一,所以许多用户可能在付款过程中也会经常用到。一些网站不提供返回上一页的功能,当用户点“返回”时,页面会自动重新指向某个页面或是报错,这样会对用户的体验造成负面影响。

Ticketmaster 中,点“返回”按钮出现这样的报错,就会让用户有受挫感。

当 用户点“返回”按钮时,不仅不能老让他们碰到出错提示,而且如果前一页是表单的话,要保存他们之前填的数据并再次显示给他们看。这样用户只需要在原来填的 内容上做修改,而无需重新填写整个表单。的确,有些情况下,用户点“返回”已经为时已晚,比如他点了“确定支付”的按钮。不过别的一些页面都能支持“返 回”按钮的话,既节省了用户时间又减少了他们的挫败感。

亚马逊网站,说明了商品的颜色和详细情况,比如精装书/平装书,还提供链接返回查看原商品详细信息。不过他没有提供商品的缩略图。

Oxfam 提供了每件商品的缩略图,让用户能快速浏览。另外,如果用户想确认这个商品是否确实是自己想买的,还可以通过链接返回原商品介绍页面。

6. 提供操作流程的指引

付款通常是一个包括多步操作的流程。这意味着用户完成支付前会经过好几个页面。所以最好加一个操作流程指引,告诉用户他们现在的位置,即他们目前走到付款流程的哪一步,哪个页面上了,以及离完成过程还有哪几步。

苹果网站在所有付款页面上,都放了一个简洁的流程指引。

让用户知道自己在流程中的哪个位置,会给他们一种控制感,从可用性角度来说,这是很有必要的。当然,让用户知道后面还有哪几步操作,就可以完成了也会减少他们的疑惑。这样他们在完成付款前,根据自己的情况和想法,来调整或取消订单的自由度更大。

7.付款界面保持简洁

付款过程和网站上浏览型的网页不同。在付款过程中,用户并没有在购物。这意味着所有的浏览型操作在这里都是多余的,这只会分散用户的注意力,影响他正在完成的任务。设计时,要把那些不需要的元素去掉—比如,商品目录链接,热销商品推荐等,使界面保持简洁。

戴尔网站的付款页面,就没有商品的目录链接,而是让用户把所有注意力放在付款流程上。

有时用户会返回,再买一些商品,再来付款,所以需要提供一个“返回继续购物”的链接。另外,要确保所有指向“下一步”的按钮都大一些,避免用户找不到。

8.不要让用户离开付款流程

用户在付款过程中不要被打断很重要,比如,把用户引到一个和付款不相关的页面。把用户带离开付款流程会有以下两个问题:1)他们会搞不清自己究竟在哪里,甚至有可能付款的页面找不到了 2)他们可能会因为被打断而没有成功完成整个付款流程。

Laskys 网站的付款页面上,当鼠标悬停在某些元素上,会有帮助信息弹出告诉用户相关的功能说明。

不能打断用户付款流程,那么我们要找到一个方法显示不要的信息。如果需要提供一些帮助信息,而这些信息又不适合在当前页面上显示,可以考虑通过浮动窗口或弹出窗口显示。

9.告知用户商品配送时间

线上购物比起实体店购物,有个较大的弊端:用户需要等待几天才能收到购买的商品。所以当用户购买成功后,需要告诉他们大致需要等待的时间。

苹果网站会根据不同用户的订单显示相应的送货时间。

告知用户商品配送时间有以下几个原因:首先,用户要确保快递公司送货上门时,家中有人收快递。其次,这样用户会对货什么时候到有个心理预期,而不用老担心买 的东西怎么还没送到。送货时间显示得越早越好,最好在商品介绍的页面上就显示。这样的话,想购买该商品的用户,就能根据商品送到时间是否能满足需求,来决 定他们是否购买。

10.告诉用户之后会发生什么

当用户完成了商品购买,并点击了最后一步操作的按钮后,接着会出现什么?以“感谢您购买本商品”为结束语。这对用户来说,是一种礼貌的表示,而用户也一定很乐意接受这些体贴的话。

亚马逊网站,在用户付款完成时,就会显示:感谢您购买了此商品,并且告诉用户接下去可以做些什么。

另外,还要告诉用户接着还会发生什么——比如,当商品发货时,他们会收到一封邮件通知。这会消除用户对订单是否真正成功购买的不确定,他们安心。

11.发一封确认邮件

用户可能完成了商品订购并付款了,但其实还没结束。网站需要发一封确认邮件,告知用户购买商品的详细信息和送货到达的时间。这个信息还是很有帮助的,因为这让用户再次确定他们没买错商品,比较安心。

亚马逊网站会在用户付款后,发送关于购买的商品详细信息的邮件,并告诉用户如果买错,如何在商品发货前修改。

如果用户买错了商品,在商品发货前,需要提供给他们重新登陆并返回修改订单的机会。简单的出错,比如选择错了尺寸,颜色,经常会发生,所以网站需要让用户感觉在线上购物既简单又可靠。

在设计中保持一致性(uniformity)是网页设计中一个重要的组成部分,它能使你的设计有效地传达信息而不会导致用户迷惑或焦虑。保证一致性的一个有效方法是撰写正式的“设计风格标准”文档,也就是俗称的视觉规范。这一文档规定了一个产品或系列产品的图形用户界面设计中都必须遵守的设计准则。遵守这些准则将视觉元素保持大小一致的尺寸,有助于你的需要的时候更容易地将这些元素组合成一个新的设计。
由于网站有时候是被临时或各自独立建立起来的,它们的视觉设计的一致性已经被折腾得千疮百孔了,一般有以下两个问题:
(1)内部一致性的问题。也就是说,在网站的两个不同的地方反映了不同的设计方法。
(2)外部一致性的问题。这是说,在同一个公司的不同产品中反映出不同的设计方法。
在这里我们主要探讨这个主题的一个方面,即购物类网站中同一个产品或主题页面的内部一致性的问题。解决“内部一致性”的问题是建立在对网站框架的深刻理解上的。首先确定有可能在网站的各个界面、导航、信息设计等不同环境中可能反复出现的设计元素,然后试着独立的设计这些元素,然后将整个设计方案应用到整个网站中去,在需要的时候再进行适当的调整。
但这仅仅是第一步,你会发现即使做到了这一点,这个页面仍旧可能凌乱无比,我们可以先看看这个例子:

wow.alipay.com/overseas


More »

Page1...23456...11