简单就是美 - gchflying - 网易博客

注册界面体验分析和ERP系统中新增资料模块改进分析
分类: 行业软件易用性分析  |  标签: 易用性 字号 [大 中 小]
注册界面体验分析和ERP系统中新增资料模块改进分析
分析此内容的主要目的是寻求对目前系统的一些模块进行优化：如销售系统的新增机会，新增客户模块：
目前市场上面有一些典型的注册流程如下：

最理想的操作模式应该在一个界面里面一次性把这些信息全部填完，避免需要填写多个界面才能完成此步骤。目前我们自己系统的注册界面是采用向导的模式，完成整个业务需要三个界面：增加客户>>>>确认客户>>>>填写基本资料，操作过于复杂，一点也不友好。下面我们可以分析一下现在比较常见的注册界面，如：google，baidu,yahoo, Windows Live,163,sohu：

google注册界面比较友好的地方如下：
1．   在每一个需要说明的输入框下面都加一些提示信息，提示信息都是用灰色，这样色彩不会太突出从而干扰用户主要的视觉关注点（输入框）。
2．   在密码输入框后面加上一个密码强度提示信息，比较友好的告诉用户当前输入的密码是否足够安全（采用Ajax技术，即使刷新）。
3．   同时提供保存用户信息的功能，这样注册完后以后就可以自动登录，比较适用于用户个人电脑。
感觉不理想的地方：

1．所有信息填写完后点注册按钮后才开始校验用户名和密码是否有效，这样会增加用户的挫折感。
2．如果密码无效，输入框会自动清空密码，用户需要重新填写2遍，好麻烦。
3．需要填写验证码，验证码字符不太容易辨认，特别是一些老人和视力不好的人，验证码很容易打击他们的积极性，影响他们的心理感受。
4．没有焦点定位功能，应该默认定位到第一个修改的输入框里面，提高用户的操作效率。
5．没有判断键盘的Caps Lock是否处于大写状态，因为密码是不可见的，如果用户不小心输入了大写的字母，也没法得到明确的反馈。

上图是baidu的一个注册界面：在用户名输入框后面加了一个按钮，可以点此按钮来查看用户名是否有效，我试了一些，判断用户名是否有效的时间间隔有时很长，建议在速度上面再优化一下。
缺点和GOOGLE相似：1。需要填点击最注册按钮页面刷新后才能判断密码有效性。
2．需要填写验证码，不过验证码比google好辨认些。


上图是Yahoo邮箱的注册页面，Yahoo它把注册用户名和其他信息分开，和我们现在系统的做法类似。如果用户名无效的话，默认焦点会定位到用户名输入框，同时在上面给出相关提示。在用户名输入框下面，不应该把广告信息放在很显眼的位置，而且用红色加粗显示出来，用户体验很差。
当用户名注册有效后，即进入基本信息注册界面：
1．   姓和名分开填写，典型的直接搬国外的方式，和国内文化不符，应该直接合并起来。
2．   验证水印难以辨认，增加注册的难度。
3．   如果密码填写太简单，会直接用红色文字显示出来，如上图，感受还不错。
4．   点击问号图标，会显示详细的说明信息，这样也避免在界面上显示太多的解释性文字，这点值得称赞。
5．   如果邮政编写没有填写六位，系统也不会自动校验，必须点注册按钮页面刷新后才告诉用户，体验不是太好，应该用户填写完后，系统直接给出提示，就像填写密码一样。


上图是微软的Windows Live注册界面，总体来说界面汉字字体太小，看着很累，这种字号的英文字母看着还舒服，不过中文就差强人意啦，有时候不能直接把英文版的界面照搬过来，毕竟中文和英文不一样，而且各国的文化不同，相应的表达方式也不一样，需要注重产品本地化研究。微软的这个注册界面也是把姓和名子分开填写，和Yahoo犯了同样的错误。既然整个界面所有输入框都需要填写，那就没必要再前面都加个*号，有点画蛇添足的味道。
当然此界面也有一些值得陈赞的地方：
1．  当鼠标移到需要填写的那一行时，系统会及时地加亮当前行，使得此行信息很突出，用户很自然的就把焦点定位到这里，使得用户不容易被其他信息干扰。同时系统只在加亮行后面显示详细的提示信息，这样就减少了界面的内容，降低了界面的负杂度。
2．   当填写完用户ID后，及时不点下面的校验用户ID有效性的按钮，系统也会自动判断此用户ID的有效性并给出相关的反馈（有效则用绿色，无效用红色加以提示），体验很棒。
3．   在密码输入框下面增加了一个判断密码强度的功能，这个功能是挺好的，但是目前把它放在“输入密码”和“重复输入密码”之间就感觉有些不妥，因为判断密码强度的功能和用户当然的主要的任务流程无关，不应该放在这里干扰用户的正常工作流程，我觉得还是放在“输入密码”输入框后面比较妥。
4．   此时在“输入密码”和“重复输入密码”输入框输入不同的密码时，系统不能立刻校验出来，应该像检查用户名那样，立刻给用户直接的反馈比较好。
5．   出身年份输入框如果用户输入超过4位或者输入字母，系统自动把它屏蔽掉，如果4位数字本身无效的话，系统自动会给出提示，感觉还不错。
6．   国家和省下拉框内容太多，看着好晕，应该用浮动图层的技术来优化，一行显示多列的方式以提高可读性。
7．   邮政编码的错误提示信息太含糊，应该能够给出比较具体的反馈信息。
8．   验证字符太花，易读性太差了，如果用户填错了字母系统也没有及时给出反馈，不够友好。
音频验证功能很有创意，不过光放一个图标这里效果不直观，把图标改成文字效果会更好些。


上图是163邮箱的注册页面，页面上面有个注册步骤，很清晰的告诉用户完成此注册流程需要几个步骤及当前进展到什么程度，降低了用户的焦虑感。每个输入框后面的解释性文字描述比较详细。
当然此界面也存在一些不足的地方：
1．完成此注册需要四个界面，太复杂了，也很费时。
2．除了用户名提供了手工确认校验的功能，其它的都没有校验。只有点击[递交表单]按钮后，才能知道什么地方填错了，而且是以警告框的形式展现给用户，感觉很不友好。如果输入的密码比较简单，系统就不能注册下去，感觉太粗暴了。
3．出身日期输入框的月和日只能选择，不可以手工填写，不友好。
4．校验码竟然是中文的，因为填写前面那些信息时，键盘的输入法都是处理英文状态，现在为了填写此内容，还必须切换一下输入法而且填写中文更费时，或者有时用户也有可能忘记怎么输入这个汉字，目前没有比这更差的检验码。

上图是sohu博客的注册页面，整个注册过程只需要填写当然一个界面，而且填写内容很少，极大地提高了用户的操作效率。每个输入框后面默认没有提示文字，如果当前输入框信息有效，则后面出现一个绿色的打勾符号，如果无效则后面给出红色的提示文字告知用户原因。包括如果2次密码输入不一致系统都会给出提示，这些细节个人觉得做得挺人性化的。
当然此界面也有一些不足的地方：
1．  标题用红色字体显得太突兀，包括按钮也是这样。
2．   界面字体颜色太丰富，使得整个界面画画绿绿，这样反而突不出重点，也降低了用户对信息的识辨性。
3．   最下面的协议内容也属于注册流程的一部分，应该把这块内容移到[完成注册]按钮上面，这样也与用户实际的心理模型保持一致。
目前我们系统新增客户和新增机会模块也存在一些易用性问题，新增客户的业务流程如下：

目前系统是用三个不同的界面来实现此业务操作，易用性感觉比较差，比较理想的模型应该是在一个界面中就可能完成整个业务步骤。
同时业务员输入框默认是灰色也是不合理的，实际上此输入框内容是可以通过后面的按钮进行更改的。
通过仔细考虑，我构思了一个新界面来实现上述业务，界面如下：
(产品保密缘故，所以图略去)
在客户名称和联系电话下面加了相关的灰色解释性文字，同时把相关的客户基本信息也放在了同一个界面中。
业务员后面的输入框改成了蓝色，表明此项是可以修改的。
(产品保密缘故，所以图略去)
当用户输入了客户名称和联系电话后，系统立刻进行判断数据库是否有此客户，如果存在此客户的话，
立刻在界面显示如下信息(刷新速度一定要快，太慢用户也会不耐烦的)。
(产品保密缘故，所以图略去)
用户此时可以进行新增客户资料或者更新已有客户资料操作：
如果是选择更新已有客户资料，则自动从数据库中把此客户的相关信息显示出来，用户可以进行修改；如果是选择新增客户则需要填完下面的客户各基本信息资料。
最后点保存按钮即可完成此业务全部操作。
整个业务操作都是在此界面完成，避免了多个界面切换的烦恼，提升了用户的心理感受。同样的新增机会模块也可以做类似调整，用一个界面即可完成相关操作。