邮件系统评测(上)—yahoo!

十二月 15th, 2005

一、发信主界面
uploads/200603/07_005858_e1.gif
用户的心智模型:
1.填写地址 (填写抄送地址) (密送地址)
2.填写主题
(3.添加附件)
4.撰写正文
5.发送或保存
在这里界面设计给出了符合用户心智模型的布局。
阅读全文 »

浏览量:19,567 views 1 条评论 »

邮件系统评测(下)—263

十二月 15th, 2005

一、发信主界面
uploads/200603/07_010745_e9.gif
同样的用户的心智模型:
1.填写地址 (填写抄送地址) (密送地址)
2.填写主题
(3.添加附件)
4.撰写正文
5.发送或保存

在263的邮件界面中可以看到不合理的布局。

二、地址簿
uploads/200603/07_010810_e10.gif
首先,当用户需要同时填写“收件人”“抄送”“暗送”三个地址时,需要分别点击右侧对应的图标,先后打开同一个“地址簿”。

打开地址簿后,
uploads/200603/07_010842_e11.gif
用户的心智模型:
1.选择联系人
2.确定

因为没有提供更多的功能,263的地址簿界面比yahoo的更为清楚明白,用户更容易操作。

三、粘贴附件
uploads/200603/07_010910_e12.gif
当用户要上传附件时,却发现附件的输入框样子上虽与“收件人”、“主题”等项目的输入框相同,但前四个可以输入,而附件后面的输入框却不行。负责添加附件功能的按钮距离输入框如此之远,如上图所示。
阅读全文 »

浏览量:111,609 views 14 条评论 »

相册走在“奔小康”的路上—相册的显示与管理中的交互设计

十二月 9th, 2005

许多网站都提供“个人相册”这种服务。用户只需要申请一个帐号就可以在互联网上拥有一个自己的相册了。提供一个能够达到温饱水平的相册需要有稳定的服务器,健壮的程序和足够的带宽,要想提供一个“奔小康”的相册,那就需要在交互设计上做更多的工作了。

图片的浏览从设计上可以分为两类:列表式和幻灯式。

列表式是指:相册中的各个图片文件以列表排列,点击后在新的页面中显示完整的大图。列表可以是文字列表,也可以是所略图列表,显然所略图的列表更便于使用。这种方式的特点是文件列表和最终的显示在不同的页面中显示。

幻灯式是指:相册中的各个图片文件或横向或纵向在页面中占用一小部分空间排列,页面中的主要区域作为“图片显示区域”,用于显示实际的大图,点击文件列表中的某一项,其实际大小的图片在页面中的图片显示区域显示。文件列表和大图显示在同一页面中。

下面针对这两种显示模式各选一个代表加以分析:列表式的代表是“yahoo!相册”,幻灯式的代表是“MSN Space相册”。

yahoo!相册的浏览界面主要由三个页面组成:
1。相册的首页,用所略图显示全部的相册;
2。XX相册页,显示某一相册内的全部照片的所略图;
3。最终显示页,显示某一张照片,并提供照片的相关信息和功能。
阅读全文 »

浏览量:19,038 views 暂无评论 »

搜狐博客后台评测

十二月 5th, 2005

总体问题:

1.在某一个blog中,搜狐网站“印记”过多。这些“印记”主要在页头和页脚中—搜狐博客logo,ChinaRen 、17173 、焦点房地产 、GoodFeel 、页脚的10个链接和搜狐版权声明。

用户希望自己的blog是一个属于自己的空间,而不喜欢其中贴满服务商的广告,况且在用户的blog中显示搜狐自身的链接并不见得能收到好的效果—有多少用户希望在访问搜狐的某个博客过程中看到搜狐“焦点房地产”呢?

与完全独立建设blog相比,使用服务商提供的现成服务最大的缺陷就是blog中留有服务商的“印记”。因此,“印记”越少就越能赢得用户的好感。搜狐博客、新浪博客、博客中国、MSN共享空间……相比,搜狐博客是“印记”最多的。

服务商付出的是网络空间和服务,用户的使用本身就是对服务商的回报。

2.当用户A访问用户B的blog时,“欢迎您:A 管理我的博客 离开 帮助”这些内容都是针对用户A的,不应该出现在用户B的blog页面内部。
阅读全文 »

浏览量:110,809 views 9 条评论 »

我们到底需要多么美丽的网页?—从google的设计风格说起

十二月 3rd, 2005

近来google的一系列动作让人眼花缭乱,gmail、gtalk…通观google的界面,g氏风格如此强烈,极劲简洁之能事,甚至是略现粗糙。

你是否琢磨过为什么google的设计风格会是这个样子?---几乎没有设计,只是使用不同的大小的文字排版,在必要的时候加一道黑线。

如果你是一名网页设计师,你是不是也抱怨过人家为什么能够使用这样的设计,而自己的公司老板或客户却完全不能接受这样的设计,以至于你根本不敢做这样的尝试,因为那样你很可能马上就丢掉工作,只是会给你的老板留下很糟的印象---这个家伙根本不会设计。那样做无异于自杀。

是的,我也在琢磨,直到我想到了前苏联的两种轻武器:AK47和ppsh41(波波沙冲锋枪)。

请相信我,我不是在信口开河或者哗众取宠。先让我们来回忆一下这两种武器:
AK-47
uploads/200603/07_004007_ak47.jpg
阅读全文 »

浏览量:114,681 views 13 条评论 »

文字,你到底能多大?—分析网页文字的字号

十二月 2nd, 2005

文字在网页上的应用:

(只看小标题您就能知道这一部分要说什么了,为了避免罗嗦,在此文发布前决定把此处300余字删除,只保留了下面这一句。)
对于一个设计的好的网站来说,用户浏览时间最长的是文章正文。

中文网页文字的现状:

中文网页普遍使用12px和14px的宋体(simsun),这两种文字都可以加粗(font-weight: bold)。这个规范似乎也成了网页设计师的基本常识。

中国的网页设计师有这4种可供选择的文字表现方式,仅仅是4种,只有这4种,4种很小的文字。其中12px的宋体加粗效果还并不太理想。

危机逐渐显现了,文字在变小!

显示器在逐渐变大,分辨率在逐渐提高,尤其是液晶显示器的普及—pc液晶显示器技术日趋成熟,笔记本电脑也开始家用化了。
液晶显示器根据不同的尺寸往往需要一个特定的分辨率,以17英寸液晶显示器为例:最佳的分辨率是1280×1024,在这个分辨率下,显示文字才是清晰的。

下面用两台显示器来做个比较:
阅读全文 »

浏览量:110,120 views 3 条评论 »

谁是按钮?它在干嘛?—网页按钮的功能与表现

十一月 29th, 2005

目前在网页中普遍出现的按钮可以分为两类:一种是有提交功能的按钮---真正意义上的按钮;另一类是仅仅表示链接的按钮,在这里将其称为“伪按钮”。

真正的按钮

真正的按钮有两个作用:
1.实现提交功能;
2.标明当前操作的目的。

说明:

无疑按钮实现着提交功能。当用户输入了关键字后会点击“搜索”按钮,网页中将出现搜索结果;当用户填写了用户名和密码后,点击“登录”按钮,系统将打开自己的邮箱页面。

按钮上的文字说明了整个表单区的内容,比如,有“搜索”按钮的区域显然标明这一区域内的文本输入框和按钮都是为搜索功能服务的,不需要在另外添加标题进行说明了,这也是设计师为提高网页可用性而普遍采用的一种方式―――逐字斟酌按钮文字。

按钮的表现形式可以大致总结为两种:
1.系统标准按钮
2.使用图片自制的按钮

对于真正的按钮应当使用系统标准按钮还是自制的图片按钮?

笔者认为应当使用系统标准按钮。系统标准按钮的设计起源是模拟真实的按钮,无论是真实生活中的按钮还是网页上的系统标准按钮都具有良好的用户反馈。
阅读全文 »

浏览量:117,727 views 11 条评论 »

长、闪、挤、花—有中国特色的网站首页

十一月 28th, 2005

中国网站首页设计有四大特色:“长,闪,挤,花”。

先说这个“长”,中国网站的页面真是长啊,以至于我坐在电脑前浏览的时候经常会想,这个页面的最低端会不会已经搭拉到我的脚面上了。我们的万里长城是第几大奇迹来着?反正中国的网站应该紧排在她后面。

我们的大型门户网站恐怕应该是长页面的领军者吧。现在能生存下来的大型门户各个实力不凡,又纷纷上市,其他网站能与他们页面相似应该也能说明实力相似吧,这几家大型门户已经给用户形成了“长则是好”的印象,于是众多网站都纷纷“长”起来了。无论是综合性网站还是专业性网站,只要有内容,就能做多长就做多长,没有内容,抄袭别人内容也要做长,以至于不少实力有限的网站只是首页很长,到了栏目页面(二级页面)就简陋的可怜了。

长的基础就是要内容要多,这些众多的长网站在组织内容的思路上基本是一致的,就是把二级页面的内容摘要的放在首页上。首页分成若干个相应的通栏的大块儿(这样可以逐个部分的下载页面,易于显示),再在每两块之间加一条广告,最后再在页面的最上面加一个更综合的区域,所谓的重中之重,这样以来页面想短都短不了。
阅读全文 »

浏览量:111,347 views 10 条评论 »

也许那是一个广告?

十一月 28th, 2005

广告总是令人厌恶的,但也还可以理解,毕竟这是网站赢利的一个手段,人家免费提供那么多资讯,还不许人家登几幅广告?

但是,有一种广告不仅是可恶的,简直令人发指!
uploads/200603/06_220949_1.gif
想必您也见到过网上的这种广告吧,或许您也上过它们的当。被骗过的肯定不只您一个,至少还有我。

这种欺骗性广告的设计思路可以分成三种:
1。内容的欺骗。
这种欺骗比较直接,以文字为主,加上下划线,但都是在一张图片里实现的,整张图片指向该广告页面。
uploads/200603/06_221025_2.gif
阅读全文 »

浏览量:19,016 views 9 条评论 »

表单元件在说什么?—分析表单元件的语义

十一月 28th, 2005

在文章的开头有必要先定义一下,什么是“表单元件”。本文所说的表单元件是指form(表单)中的文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框以及表单按钮(包括提交按钮、复位按钮和一般按钮)等的统称。

每一种元件都能实现一种特定的功能,这自不必说,本文要探讨的是,一个表单元件作为界面上的一个元素,能传达给使用者什么信息。

表单元件在实现一种特定数据采集功能的同时,元件本身也向使用者传达着语义。以单选框为例,界面中如果出现若干条选项,每一条选项由一个单选框引导,此时,不需要任何文字说明,使用者便可以很清楚的理解:“选择其中一条”。这个道理似乎是显而易见的,然而在实际的应用中却不是总能被正确的理解和运用。下面来看两个实例:
阅读全文 »

浏览量:110,170 views 1 条评论 »