晃晃悠悠~~~: design

《CGArt》第七期发行免费下载

Wed, 08 Feb 2006 12:12:42 GMT

《CGArt》创刊一周年及春节特刊第七期劲爆发行

本期内容导读(共366页，视频3段，文件37M)

NewWebPick电子杂志第三期出炉

Wed, 02 Nov 2005 14:47:31 GMT

Newwebpick网站正式上线于2001年12月8日，是由一群中国人为核心成员的国际性网站，她是一个国际中立的设计平台，让设计师可以跨国界的交流。

关于站长的介绍，请见蓝色的 Newwebpick站长郑伟访谈。

黑色和“他”的“密友”们

Thu, 18 Aug 2005 13:49:52 GMT

come from: 蓝色理想

网页色彩的搭配

Thu, 18 Aug 2005 13:37:43 GMT

网页的色彩是树立网站形象的关键之一，色彩搭配却是网友们感到头疼的问题。网页的背景，文字，图标，边框，超链接...，应该采用什么样的色彩，应该搭配什么色彩才能最好的表达出预想的内涵呢？阿捷这里谈一些心得，希望对你有所启发。首先我们先来了解一些色彩的基本知识：

1、颜色是因为光的折射而产生的。

2、红，黄，蓝是三原色，其它的色彩都可以用这三种色彩调和而成。网页html语言中的色彩表达即是用这三种颜色的数值表示例如：红色是color (255,0,0)十六进制的表示方法为(FF0000)白色为(FFFFFF), 我们经常看到的"bgColor=#FFFFFF"就是指背景色为白色。

3、颜色分非彩色和彩色两类。非彩色是指黑，白，灰系统色。彩色是指除了非彩色以外的所有色彩。

4、任何色彩都有饱和度和透明度的属性，属性的变化产生不同的色相，所以至少可以制作几百万种色彩。

网页制作用彩色还是非彩色好呢？根据专业的研究机构研究表明：彩色的记忆效果是黑白的3.5倍。也就是说，在一般情况下，彩色页面较完全黑白页面更加吸引人。

我们通常的做法是：主要内容文字用非彩色(黑色)，边框，背景，图片用彩色。这样页面整体不单调，看主要内容也不会眼花。

非彩色的搭配

黑白是最基本和最简单的搭配，白字黑底，黑底白字都非常清晰明了。灰色是万能色，可以和任何彩色搭配，也可以帮助两种对立的色彩和谐过渡。如果你实在找不出合适的色彩，那么用灰色试试，效果绝对不会太差。

彩色的搭配

色彩千变万化，彩色的搭配是我们研究的重点。我们依然需要进一步学习一些色彩的知识。

一、色环。我们将色彩按"红->黄->绿->蓝->红"依次过度渐变，就可以得到一个色彩环。色环的两端是暖色和寒色，当中是中型色。红.橙.橙黄.黄.黄绿.绿.青绿.蓝绿.蓝.蓝紫.紫.紫红.红 . 暖色系. 中性系. 寒色系. 中性系

二、色彩的心理感觉。不同的颜色会给浏览者不同的心理感受。红色---是一种激奋的色彩。刺激效果，能使人产生冲动，愤怒，热情，活力的感觉。绿色---介于冷暖两中色彩的中间，显得和睦，宁静，健康，安全的感觉。它和金黄，淡白搭配，可以产生优雅，舒适的气氛。橙色---也是一种激奋的色彩，具有轻快，欢欣，热烈，温馨，时尚的效果。黄色---具有快乐，希望，智慧和轻快的个性，它的明度最高。蓝色---是最具凉爽，清新，专业的色彩。它和白色混合，能体现柔顺，淡雅，浪漫的气氛(象天空的色彩:) 白色---具有洁白，明快，纯真，清洁的感受。黑色---具有深沉，神秘，寂静，悲哀，压抑的感受。灰色---具有中庸，平凡，温和，谦让，中立和高雅的感觉。

每种色彩在饱和度，透明度上略微变化就会产生不同的感觉。以绿色为例，黄绿色有青春，旺盛的视觉意境，而蓝绿色则显得幽宁，阴深。

网页色彩搭配的原理

1、色彩的鲜明性。网页的色彩要鲜艳，容易引人注目。

2、色彩的独特性。要有与众不同的色彩，使得大家对你的印象强烈。(参考设计思考第二篇网站CI的标准色彩一节)

3、色彩的合适性。就是说色彩和你表达的内容气氛相适合。如用粉色体现女性站点的柔性。

4、色彩的联想性。不同色彩会产生不同的联想，蓝色想到天空，黑色想到黑夜，红色想到喜事等，选择色彩要和你网页的内涵相关联。

网页色彩掌握的过程

随着网页制作经验的积累，我们用色有这样的一个趋势:单色->五彩缤纷->标准色->单色。一开始因为技术和知识缺乏，只能制作出简单的网页，色彩单一；在有一定基础和材料后，希望制作一个漂亮的网页，将自己收集的最好的图片，最满意色彩堆砌在页面上；但是时间一长，却发现色彩杂乱，没有个性和风格；第三次重新定位自己的网站，选择好切合自己的色彩，推出的站点往往比较成功；当最后设计理念和技术达到顶峰时，则又返朴归真，用单一色彩甚至非彩色就可以设计出简洁精美的站点。

网页色彩搭配的技巧

文章写到这里，有心急的网友要问了：“到底用什么色彩搭配好看呢？你能不能推荐几种配色方案？”别急，这里有一点技巧，可以帮助你迅速成为调色大师

1、用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，(说得通俗些就是将色彩变淡或则加深)，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。

2、用两种色彩。先选定一种色彩，然后选择它的对比色(在photoshop里按ctrl+shift+I)。我的主页用蓝色和黄色就是这样确定的。整个页面色彩丰富但不花稍。

3、用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。确定色彩的方法各人不同，我是在photoshop里按前景色方框，在跳出的拾色器窗中选择"自定义"，然后在"色库"中选就可以了。

4、用黑色和一种彩色。比如大红的字体配黑色的边框感觉很"跳"。在网页配色中，忌讳的是： 1.不要将所有颜色都用到，尽量控制在三种色彩以内。 2.背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容。

by: 阿捷　

发现你的最佳色调

Mon, 15 Aug 2005 13:29:14 GMT

做网页或者平面设计时，总是感觉到配色是个大的问题，对自己总是没有太多把握。

这需要的不仅仅是色彩方面的基础知识，还需要的实践经验，大量的尝试，并要要多多观察揣摩。

这个网站提供了一些色彩的标本，还有些不错的知识和信息。

网址：http://www.colourlovers.com/

如何量化用户体验

Thu, 23 Jun 2005 01:15:51 GMT

如何量化用户体验

用户体验本来是一个非常虚的词,这篇文章里我们主要谈谈如何把这样一个很虚的东西进行量化.让他成为你进行分析研究的依据.

量化用户体验有四个重要因素

1．品牌(branding)

2．可用性(usability)

3．功能性(functionality)

4．内容(content)

这些因素不是独立的，如果独立来说,他们哪个也不能叫"用户体验"

他们是相关联的。一个成功能的网站，离不开这4个因素。

一个客观的衡量和分析工具，能帮助你的客户提供有实事依据的建议。而不是推测的意见和观点。我们在这篇文章中的探讨能帮助你：

1．尽可能的去除你的主观偏好。

2．使具有不同背景的人（设计人员、开发人员、客户）能够在理解网站上有统一的共识。

3．创立与竞争对手网站或者以往的开发相比较的基本规则，为你的客户提供一个对他们网站的优缺点事实依据，视觉上的展示

衡量用户体验

用户体验正如上面所说的4大重要因素。但是我们如何量化和徇这些看似无形的元素呢？

我们把我们的分析分成四部分，每个用户体验元素为一个部分。对每个元素我们创建一系列的描述和参数，有针对性的考查网站。每个描述分类1-X个级别，我们在这个范围内给每个描述打分，等到你完成了第一部分的分析，你应给四个部分的描述分别打分。

插图：

文章中的示例分析，在每个元素中仅用了5个参数，因为我们设20分一个档，最大分值为100，在每个元素中如果我们加上另外五个描述/参数每个元素就是10分一个档，下面就是有关每个元素和描述/参数的概要。

一．品牌

用来衡量网站品牌的描述包括：

1．用户为访问都提供了有吸引力的难忘的体验

2．网站的视觉效果与品牌一至

3．图片，附加内容，多媒体内容提供了体验过程的价值

4．网站传达了品牌设定的程度。

5．网站充分运用了这个体能力，加强了或延伸了品牌。

二、功能性

功能性包括所有的技术上的及屏幕之后的流程及应用，它伴随着为所有最终用户提供互动服务。而且有时对公众和管理员都有意义

用来衡量功能性的描述包括。

1．用户及时获得对其查询和提交信息的反馈。

2．深晰的任务过程的告知（比如成功页面或邮件更新提示）

3．网站和应用加上了一般的安全及个人隐私的标准

4．在线功能与离线业务结合

5．网站包含管理工具，加强管理员的效率。

三、可用性

可用性包括一般意义上的对所有网站的内容和特点的易用性。在可能之下的二级主题还包括导航的友好性。他们包括：

1．网站防止错误发生，并帮助使用都从错误中恢复。

2．整体页面侧重应针对主要目标受众优化。

3．网站帮助其访问都达成一般性目标和任务。

4．网站保持其一到性和标准。

5．网站能为有残疾用户提供特定内容。

四、内容

内容指网站的实际内容，文本，图片，多媒体等到，以及其结构，信息体结构。

我们考虑信息和内容是如果根据用户需要和客户业务要求而组织的。

1．连接密度带来的清晰度和简单的网站浏览。

2．内容组织方便了用户实现他们的目标

3．内容及时准确

4．内容与用户需要和商务目标相切合。

5．多语言的综合性内容。

结果：

插图：

首先，将每个元素的价值相加，因为每个元素设定了一个最大和为100的量级，我们得到的是一个百分比的分数。最好的方式是通过一个蜘蛛图来展示。

插图：

通过分析获得创意。

文中描述的分析和方法的优点在于它们能迎合你的特定客户。可根据需要加入其它考察元素。

这个分析平台使你能在你选取的某一元素中增加权重，比如你的客户是一个生产商，它非常侧重品牌和外观及氛围。毫无疑问你可以修改衡量体系，给予品牌元素更多更好的侧重。给于可通知性少些侧重

原文 http://www.sitepoint.com/print/quantify-user-experience

网页调色板

Mon, 23 May 2005 13:48:04 GMT

color palette creator
这是我收藏之一，通过基本色调生成10种不同灰度的相同色，并且能生成png文件。
visit 4096 Color Wheel Version 2.1
非常漂亮的自然色抓取工具，用鼠标点取颜色，非常方便。
visit technicolor
用鼠标拖动滑杆，再根据基色生成系统推荐的色调，最棒的是还能根据你选择的颜色生成标准的css文件。
visit color scheme generator 2
这也许是至今为止最专业的调色板了。不但能根据选择的基色生成相关的配色方案，还有根据颜色的饱和度，明亮度等等只有在photoshop里看见的调节功能，系统还提供推荐方案，有专门为色盲和色弱者推荐的颜色方案。
visit colr.org
从网站Url就能看出这也是一个专业的color site。color.org最酷的就是应用了tag，你可以输入forest(森林)这个词，系统自动根据你给出的词生成相关的颜色方案，输入love后我得到的大多是粉红基色调，很准确吧！系统有11000多种颜色tag和20000种颜色方案、7000多个调色板。当然，这个tag。。这个tag不支持中文的...
visit color blender
这个也是一个很有特色的调色板。输入两种截然不同的颜色，系统根据这两种颜色生成渐变色带。
visit color schemer v2
这个是color scheme generator 2的另一个版本
visit visibone color lab
这是第一个根据网页安全色制作的调色板，使用简单，鼠标不停的点，直到碰上让你感觉满意的效果。
visit RGB color charts
基于RGB原理的，不过系统生成的颜色很舒服。
visit full screen picker
这是一个基于浏览器的颜色拾取器，想必下，这种工具还是使用客户端的程序比较方便些。
visit colormixers
一边拉滑杆，一边看颜色的变化，相当方便。

visit

http://dev.sessions.edu/ilu/ilu_1.html http://www.technetguru.com/design
http://www.mundidesign.com/webct
http://graphicdesign.about.com/library/color/blweb2.htm
http://www.pourpre.com/chromograf/en/
http://www.webwhirlers.com/colors/wizard.asp
http://www.colorcoordinator.com/colorCoordinator.php

当前最热门的十种颜色：

Moroccan blue
Glazed ginger
American beauty
Ruby wine
Atmosphere
Burnt olive
Gloxinia
Rattan
Moss
Burnt orange

人物的全面刻画教程

Tue, 10 May 2005 13:45:25 GMT

动画基础篇《人物的全面刻画》
作者：ljhui2000c 来源：闪吧
人物的全面刻画

我一再强调：漫画虽然可以夸张，但不能无限，只能建立在现实事物的基础之上，所以我们在画人物的时候，首先观察真人是必要的。一般情况下，人脸的正面整体形状像个鸭蛋，发际到眉毛、眉毛到鼻尖、鼻尖到下巴的距离大致相等，脸宽为5个眼睛的长度，头部在平视状态下，耳朵上沿略低于眉毛延长线，下沿到鼻尖（当然，这只是平均情况，人耳有大有小，脸有长有短，不可能总符合标准）。一般漫画夸张的较多的是人脸，其他部位就夸张的不多。

由照片可以看出，男性眉骨较高，前额平坦，头骨形状较方，线条粗犷，脸一般比女性长，眉毛比较浓、粗，鼻子线条较接近直线，鼻形比女性的宽大，脖子比女的粗；女性的头骨小，线条较柔和，脸、鼻线条圆润，前额圆满，眉骨不凸，下巴一般比男性稍尖，皮肤较白，睫毛长。
由于男性头骨比女性的大，眼球大小相同，所以给人的感觉是女性眼睛比男性的大，这在漫画中得到了夸张。在漫画中，女孩的形象便成了大眼、圆脸、小翘鼻、小嘴的样子，这是由真实夸张而来的。男性的眉毛则一般画成剑眉，和眼睛的距离比较近，这样可以使眼睛透出一股英气。侧面头像的画法仍遵循在垂直方向上的三等分（见上）。
注意男女侧面的区别：女性圆滑的前额，额头与鼻梁柔顺的衔接，平坦的眉骨，细长的脖子；男性线条可用直线勾勒，平坦的前额，突出的眉骨，粗眉、粗脖子、笔直的鼻梁，转折明显的颌骨。

在真实世界中，还存在人种之分，不同人种长相大不相同，南方人和北方人也能看出区别。在这我先以亚洲人为例说明画法，其他人种就由各位自己总结了。人们总说混血儿长得漂亮，我们在画漫画时也常常综合亚洲和欧洲人种的特点，制造出一个个比真实人类更美的形象。但人体的比例都差不多，所以只要掌握了常用的比例，到时再配合各人种的特征，画人就不成什么问题了

眼睛是心灵的窗户，能表现人的内心世界，所以画好眼睛是非常重要的一步。我们先观察真实的眼睛：眼珠呈球状，有眼白、虹膜和瞳孔，颜色依次加深，瞳仁处常有来自侧向的反光，表现眼睛的明亮和神采。所以我们如要画一个惊呆或麻木的表情，常常把那一点反光去掉，使眼睛失去光彩，整个人的神气也就没了。

漫画中眼的表现，注意反光点与光源的方向一致！

下边的一组眼睛表达了人物的各种表情，熟练掌握它们的画法对画故事是非常重要的。漫画里的表情通常已经符号化了，成为世界通用的符号，一些很夸张的表情只要记住很容易就能表达人物的情感。
但有时人物内心是很复杂的，这时用夸张的表情符号会不太合适，所以平时在生活中或在看电影电视时，要注意观察人们表情的微妙变化，这样才能达到更高的水平。就像我们常说的演技派演员，要展现他们的功力，常常要看他对复杂内心的把握，漫画也是一样。

下边是人的各种嘴型以及表达情感的各种状态，实际的嘴型有很多种，大体上可分为上面的五种，改变嘴唇的宽度和厚度又可以增加很多。
在画人时，我们可以利用嘴型、鼻型、眼型、眉型、耳型和发型排列组合，再加上胡子、耳环、伤疤、眼镜、发夹、帽子等元素，便能画出令你意想不到的多种多样的脸。

下面是我列举的部分鼻型、耳型和眉型，请注意比较它们的特点，眉毛在改变间距和浓淡后又可以多出很多种。既然有那么多种元素可以让我们随意组合，我们还有什么理由不能画出有各自特点的人呢？
然有那么多种元素可以让我们随意组合，我们还有什么理由不能画出有各自特点的人呢？

下面再说头发的画法，头发生长的地方是固定的一块区域，如下图中灰色的部分，头发具有一定的韧性，所以在画头发的时候，要注意体现出头发的厚度。

干燥、蓬松的头发厚一些，把头发扎紧或者弄湿的话，头发会贴着头皮，这时头部的轮廓就和光头时比较接近。注意头发被打湿后，会粘成一缕一缕的。头发都是由发根长出来的，我们在画的时候，也应该顺着头发的方向画线条，当然也要顺着笔尖的方向，不然会把纸戳一个洞的！多练习画曲线，这样画出来的头发才有流动感，柔顺自然有光泽，使人物增添魅力，作品才会受欢迎呀！

注意下图头发走向：从发箍放射性地散开，要画出马尾辫的下垂感！

头发可以表现人的性格，柔软的头发可令人物表现温柔的一面，坚硬的发质则体现人物的刚强。不拘小节的人不会经常打理自己的头发，雷厉风行的人不喜欢被长长的头发困扰。还是一句话，注意观察！最好把见过的各种发型画下来，作为创作的素材。
1.一头刚硬的短发，搭配流行的黑变小框眼镜，体现出自信、坚强的性格
2.柔顺的长发，多情、温柔、儒雅
3.长长的卷发配合粗糙的络腮胡，有一种沧桑和粗犷
4.盖住一边脸的染色软发（黑白的看不出来呀~：P），透出内心的叛逆和不羁

很多人不知道对仰起或低下的脸如何下手，其实只要像下图一样，对应着侧脸做练习就可以画得比较有立体感了，画时要注意额头、眼睛和嘴要有弯曲感。如果有石膏像更好，还能练习人脸的光影。多练几次，把各种角度的脸练熟后，以后就可以直接下笔，不用再拿侧脸作对照了。
画多角度的东西，应该首先在心里就有一个模型，可以让它在脑子里随意旋转、翻滚，而形成模型的方法只有一个，就是多看多记。照着明星的照片画也是很不错的呢，注意画出各自的特点！

好，咱们再看看手吧！手也是画人的一大难点，不过也是很好画的，因为我们随时可以照着自己的手画，不像画别的东西那么难找范本，在画左手时最方便，画右手就利用镜子的映像功能，随时能找到符合要求的范本！但老照着手画也不是办法，我们只要能默出几种常见的手的姿势就行了，别的到时再说，呵呵！
下图是几种常用到的手的姿势

不同的人有不同的手，男人的手接近菱形，皮肤较薄，骨节突出，手掌宽厚有力，指甲一般画成方形；女人的手较窄而薄，因为有皮下脂肪，所以线条柔和，极少看见青筋暴突，手指修长而尖，把指甲画成椭圆形较好。婴儿的手胖乎乎的，非常柔软，手背上有四点凹下去，指甲为长方形手腕处有一条沟，像藕节一样；老人皮肤没有什么弹性，皱纹很多，青筋暴突，关节肿大。

光脚虽然在漫画里不是很常见，但了解它的画法对人物的塑造也是很重要的。鞋子的形状是根据脚的形状来定的，所以画好脚后，画鞋子就方便多了。

注意男人和女人脚的区别：男的脚线条粗犷，较宽；女人的脚很均匀，较窄，脚趾一般不显现骨节，脚踝关节也不太突出。如下图：

人体的各个零件都说完了，该把它们组合起来了。人的身高一般为7～8个头长，肩宽大致等于2个头宽，两手平举时中指尖之间的距离大致与身高相等，很多美术书都有介绍。我在这就不细说了。

画得像人不难，难的是画出性别特征，这一点对于初学者可是大问题，很多男生画的女生像男的，女生画的男生像女的，逸心开始时也是这样，后来大胆观察女生，终于看出了男女的差异，找到了突破口！不容易呀……好，闲话少说，转入正题。右上图的男女，大家有没有看出什么区别来？
①男子的肩膀较宽厚结实，所以肩膀和脖子的衔接处转折比较明显；女子在那里的转折是一条弧线；
②男子肩头三角肌隆起，应该用有力的线条勾画，手臂粗壮，肌肉轮廓明显；女子肩头线条浑圆、单薄，常常显得肩头向前包拢，瘦削的男子也会有这种情况；
③男子的腰比较粗、靠下，差不多和髋骨衔接处是最细的地方；女子腰细、靠上，最细的地方和肘关节基本处于同一水平线；
④男子的臀部较窄而结实；女子胯较宽而长。

男子的特点：宽厚的背部和臂膀，稍稍上翘的结实的臀部。
女子的特点：纤细的腰和四肢，要给人一种柔软的感觉，臀部稍稍下垂。（如下图所示）

下图是男女的轮廓示意图，关键在于男的往外张，女的往内收，如果画相反的话，会得到很特别的角色呢！男的显得内向、懦弱，女的会像人们常说的"母夜叉"。
当然，这种画法能画出具有明显性别特征的人，但并不适合于所有的人，就算男性，也有个别人是有女人味的。所以要注意人与人之间的区别，长相要能反映其性格、爱好等内在因素。
看了总结的人体画法，不知对您有没有启发和帮助？如果想要更扎实的画功，应该系统的从素描开始学习，学习美术的人体解剖学，掌握骨骼、肌肉的对应关系。如果您不想画太写实的画，我想，学会了这些技法，平时多看多想多画多记，应该已经够用了吧，毕竟这些东西大部分都是逸心通过观察得到的,只有很少一部分是看书得知的。

设计精美的ICON

Fri, 06 May 2005 10:33:32 GMT

此网站地址: http://www.iconbuffet.com/

Adobe photoshop CS2

Tue, 05 Apr 2005 01:04:05 GMT

Adobe photoshop CS2发布

The professional standard in desktop digital imaging
Adobe Photoshop CS2 software, the professional image-editing standard and leader of the Photoshop digital imaging line, delivers more of what you crave. Groundbreaking creative tools help you achieve extraordinary results. Unprecedented adaptability lets you custom-fit Photoshop to the way you work. And with more efficient editing, processing, and file handling, there’s no slowing you down.

图像浏览有所改善，矢量处理方面功能增强！详细查看官方网站。
wooow，it is so cool!

黄金分割在设计上的应用

Fri, 18 Mar 2005 05:29:28 GMT

一份界面规范(c/s)

Tue, 15 Mar 2005 04:52:31 GMT

在参考了很多资料后，整理出来的一份界面规范（是c/s程序的，但其中的原则部分对任何界面都是具有参考价值的），希望能给大家带来帮助。
其中的图片没有贴上来，因为文字已经足够描述清楚了。
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
1. 界面规范
1.1. 总体原则
l 以用户为中心。设计由用户控制的界面，而不是界面控制用户。
l 清楚一致的设计。所有界面的风格保持一致，所有具有相同含义的术语保持一致，且易于理解
l 拥有良好的直觉特征。以用户所熟悉的现实世界事务的抽象来给用户暗示和隐喻，来帮助用户能迅速学会软件的使用。
l 较快的响应速度。
l 简单且美观。
1.2. 原则详述
1.2.1. 用户控制
用户界面设计的一个重要原则是用户应该总是感觉在控制软件而不是感觉被软件所控制。
l 操作上假设是用户--而不是计算机或软件--开始动作。用户扮演主动角色，而不是扮演被动角色。在需要自动执行任务时，要以允许用户进行选择或控制它的方式来实现该自动任务。
l 提供用户自定义设置。因为用户的技能和喜好各不相同，因此他们必须能够个性化界面的某些方面。Windows为用户提供了对许多这方面的访问。您的软件应该反应不同的系统属性--例如颜色、字体或其他选项的用户设置。
l 采取交互式和易于感应的窗口，尽量避免使用模态对话框，而使用"非模式"辅助窗口。 "模式"是一种状态，它排除一般的交互，或者限制用户只能进行特定的交互。当最好使用一个模式或该模式只是可替换的设计时--例如，用于在一个绘图程序中选定一个特定感觉--请确保该模式是显然的、可见的，是一个明确的用户选定的结果，并且容易取消。
l 在后台运行长进程时，保持前台式交互。例如，当正在打印一个文档，即使该文档不能被改变，用户也应该可以最小化该窗口。
l 谅解。用户喜欢探索一个界面，并经常从尝试和错误中学习。一个有效的界面允许交互式的发现，它只提供一组合适的选择，并在用户可能破坏系统或数据的情况时发出警告。如果可行，还应提供可逆转或可还原的操作。即使在设计得很好得界面中，用户也可能犯错误。这些错误既可以是物理上得（偶然地指向了错误的命令或数据），也可以是逻辑上的（对选定哪一个命令或哪些数据做出了错误的决定）。有效的设计避免很可能导致错误的情况。它还包容潜在的用户错误，并且使用户易于还原。
1.2.2. 清楚一致的设计
一致允许用户将已有的知识传递到新的任务中，更快地学习新事物，并将更多的注意力集中在任务上。这是因为他们不必花时间来尝试记住交互中的不同。通过提供一种稳定的感觉，一致使得界面熟悉而又可预测。一致在界面的所有方面都是很重要的，包括命令的名称、信息的可视表示，操作行为，以及元素在屏幕和窗口内部的放置。
l 相同含义的词使用统一的术语。比如对于仓库中存放的物料，不可同时又称为物品、货物、备品、产品和材料等等，而统一约定一个称谓，且此称谓是用户熟悉的和易于理解的。
l 使用一组一致的命令和界面来展示常见功能。例如，避免一个"复制"命令在一种情况下立刻执行一个操作，但在另一种情况显示一个对话框要求用户键入目标然后才执行。应该使用同样的命令来执行对用户来说相似的功能。
l 操作环境内的一致。保持Windows提供的交互操作和界面约定之间的高度一致，用户将能很快熟悉软件的使用。
l 使用隐喻的一致性。如果一个特定的行为更多的是一个不同的事物的特征，而不是它的隐喻的含义，那么用户可能在学习将行为和该事物相关联时遇到困难。例如，对于放在回收站中的对象而言，焚烧炉和废纸箩代表不同的模型。
l 建立项目保留字。通过建立保留字来明确和统一术语和操作命令。
l 提供可视反馈。在后台运行长进程时（时间超过1～10秒，视具体情况而定），必须提供进度条等信息指示。
l 除非特别必要时，不要提供声音反馈。在有严重的问题发生时，可以使用声音来提示用户，但是通常应该允许用户取消声音。
l 保持文字内容清楚。信息的表达要言简意赅，易于理解而又不罗嗦；避免使用冗长的文字给用户反馈。
1.2.3. 有良好的直觉特征
l 用熟悉的隐喻为用户的任务提供直接而直观的界面。通过允许用户利用他们的知识和经验，隐喻使得预测和学习基于软件的表示的行为更加容易。
l 在使用隐喻时，不需要将基于计算机的实现局限在真实世界的对应物上范围之内。例如，与其基于纸张的对应物不同，Windows桌面上的文件夹可以被用来组织各种对象，例如打印机、计算器、以及其他文件夹。同样，Windows文件夹可以其真实世界对应物不可能的方式被排序。在界面中使用隐喻的目的是提供一个认知的桥梁；隐喻并不以其自身为最终目的。
l 隐喻支持用户认知而不是记忆。用户记起与一个熟悉的事物相关联的意义要比他们记起一个特定命令的名称要容易得多。
l 同常见软件保持一致性。出色的用户界面在程序中将实现同用户以前用过的其它成功软件一致的动作。
1.2.4. 较快的响应速度
l 保持界面能很快对用户操作作出反应。
l 提供快捷键。特别对于有大量录入项的界面，能让用户不使用鼠标即可完成快速数据录入。在用户界面中加入一些功能，这些功能可以让熟练用户在不同的区域快速的输入数据。这些功能包括重复功能、快捷键、带有有意义的图标的按钮等等，所有这些可以使速度快的用户可以控制界面并加快数据的输入。
l 除非必要，不要重绘屏幕。
1.2.5. 简单且美观
l 简单。界面应该很简单（不是过分单纯化）、易于学习、并且易于使用。它还必须提供对应用程序的所有功能的访问。在界面中，扩大功能和保持简单是相互矛盾的。一个有效的设计应该平衡这些目标。支持简单性的一种方法是将信息的表示减少到进行充分交流所需的最少信息。例如，避免命令名和消息的文字描述。不相关或冗长的句子扰乱了您的设计，使得用户难以很容易地提取重要信息。另一个设计简单而有用的界面的方法是使用自然的映射和语意。界面元素的排列和表示影响它们的意义和关联。简单还与熟悉相互关联。熟悉的事物通常似乎更简单。尽可能尝试建立利用用户已有的知识和经历的联系。您可以使用渐进揭示来帮助用户管理复杂的事物。"渐进揭示"涉及到仔细的信息组织，以便只在恰当的时候才显示信息。通过隐藏向用户表达的信息，您减少了用户必须处理的信息数量。例如，您可以使用菜单来显示操作或选择的列表，还可以使用对话框来显示一组选项。渐进揭示并不意味着对显示信息使用非传统的技术，例如需要一个修饰键作为访问基本功能的唯一方法，或者强迫用户通过一个更长的分级交互序列。这会使用户界面更加复杂和麻烦。
l 美观。可视设计是应用程序界面的重要部分。可视属性提供了非常好的印象，并传达特定对象的交互行为的重要线索。同时，出现在屏幕上的每一个可视元素也是很重要的，它们可能竞争用户的注意。提供清楚地促进用户对表达的信息的理解的连贯环境。图形或可视设计器的技巧对于这一方面是无价的。

1.3. 细节约定
1.3.1. 界面风格
1.3.1.1. 普通外观
l 使用一致性一致的外观将使用户界面更易于理解和使用。用户界面控件看起来应该是一致的。
l 使用安排和流程在西方文化中（包括中国），人们习惯于从左到右，从上到下进行阅读，因此，应该将重要信息放在上面和左边。左上角最容易吸引起人们的注意力。
l 使用对齐通常，使用左对齐来使用户界面控件更易于浏览。对于数值文本，应该使用小数点对齐或右对齐。对于非数值文本，应该避免使用右对齐或居中对齐。不必对什么都使用中间对齐，或者使它们保持对称形式。在右边或底部保留空白区域更适合习惯。
l 使用分组将相关的用户界面控件分成组，以体现它们之间的关系。同时，还要显示相关信息。将控件放在它所作用的对象旁。使用空格、分组框、线条和标签，或者其它分隔符对用户界面控件进行分组。
l 使用强调使用焦点、位置、分组、层次、启用/禁用、大小、颜色或者字体等，来将注意力集中在需要首先看到的用户界面控件上。尽量以可视的方式指明用户接下来应该进行的操作。
l 使用可视的提示尽量使用近似的大小和间距来指出用户界面控件是相似的，而使用不同的大小和间距来指出用户界面控件视是不同的。
l 使用空格使用空格来创建一个"透气室"，以使窗口布局更易于理解，并且查看起来更舒服。空格的多少要适当，不要显得太分散。但是，要避免过多地使用空格。如果可能，尽量使窗口小一些。
l 警惕空洞不要到处粘贴公司或产品的名称及徽标。虽然在启动屏或"关于"框中出现公司或产品名称及徽标是完全可以接受的，但其他窗口中的可用空间应该出现其他内容。如果没有其他内容，那么应尽量使窗口小一些。
l 注意大小使用用户界面控件的分辨率具有独立性。使用系统规格（使用GetGystemMetrics API 函数）或文本规格（使用GetTextMetrics或GetTextExtentPoint32 API 函数）来确定用户界面控件的大小。任何显示文本的对象（如对话框或定义的文本文档）都应该使用文本规格。
l 考虑使用资源或预定义的布局网格资源模板或预定义的布局网格有助于您在不同的窗口之间实现一致性。

注意，下页所示图的第二个对话框，与第一个不同，它有一个紧凑、从左到右、从上到下的流程，并且，左对齐的标签很便于浏览；通过对齐编辑框并调整其大小，使它显得更有组织，更加平衡。

不合理的

平衡的对话框
1.3.1.2. Windows的可视提示
暗示与用户只需通过查看可视提示来确定对象的使用方式的能力有关。在Windows中，请保持使用下面的可视提示：
l 可以单击凸起的项目。
l 可以单击当鼠标从其上移过时突出显示的项目。
l 不能单击下凹的项目。
l 可以编辑具有白色背景和闪烁垂直条（光标）的项目。
l 不能编辑具有灰色背景的项目。
l 灰色项目是被禁用的。
l 可以拖动凸起的项目。

1.3.1.3. 交互
l 尽量提供对所有功能的键盘访问理想情况下，除了绘图这样的图形功能，其他所有的功能都应该只能通过键盘来访问。
l 尽量提供对所有功能的鼠标访问理想情况下，除了文本输入外，其他所有功能都应该只能通过鼠标来访问。
l 确保具有明显后果的操作要求用户进行明确的选择*用户需要完全明确他将要进行危险性操作或破坏性操作。
l 对于使有耗时的操作都给出反馈*在进行长时间的操作时，要确保有等待光标、进度表或其他的可视反馈。用户应该能够取消长时间的操作。如果可以取消未完成的操作，那么将按钮标记为"取消"，否则将按钮标记为"停止"。
l 可视的指示模式*向用户提供一种可视的反馈，以指出用户进入一种模式，通常可以通过更改光标或标题栏文本来做到这一点。
l 确保单击和双击的一致性*单击用于非按钮选定，而双击用于选定并执行默认操作。换句话说，双击（在列表框、组合框，或其他接受双击的控件中）的效果应该与选定控件中的一个项目，然后按下Enter键的效果一样。
l 鼠标右键仅用于快捷菜单*确保鼠标右键仅用于快捷菜单，而不要用于其他用途。
l 不要使用鼠标中键*如果用户的鼠标有中键，那么让用户使用"控制面板"中的"鼠标"实用程序自己分配中键的行为。
l 保持分配的快捷键的一致性组合功能键和Ctrl键用于快捷键。习惯上不将Alt键用于组合键，业务Alt键常常被用于访问键。尽量避免使用Alt键和Ctrl键，因为这种组合会使快捷键非常麻烦，而且也很不方便。
l 将快捷键作为补充方式*千万不要将快捷键作为访问命令的唯一方法。应该让用户有更多的明显选择。
l 避免水平滚动条与垂直滚动条不同，水平滚动条并不受欢迎，因为它会使项目阅读起来比较困难。解决的办法有：尽量使用垂直滚动条、加宽窗口、减小文本的宽度，或者使文本自动换行等。当然，如果确实需要，还可以使用水平滚动条。
1.3.1.4. 程序
l 只有主程序窗口才有标题栏图标、菜单栏、工具栏和状态栏*因为单击主窗口的任务栏按钮也会激活二级窗口，所以二级窗口绝对不要显示在任务栏中。二级窗口不要因为使用菜单栏、工具栏或状态栏而使其变得复杂。可以使用标题栏图标来明显区分主窗口和二级窗口。另外，绝对不要使用默认的Windows图标(飘动的窗口图标)作为窗口图标。
l 简化默认配置让用户按自己的速度来学习和使用程序。
l 应用程序应该使用多文档界面（MDI）或单文档（SDI）这些程序界面应该与应用程序的使用模式匹配。
l 默认情况下，应用程序应该保持为最大化当应用程序占用整个屏幕时，常常能够提高用户的工作效率。
l 实用程序应该使用SDI或对话框界面这些程序界面应该与实用程序的使用模式匹配。对于实用程序，建议不要使用MDI界面，因为管理这些窗口需要付出很多努力。
l 实用程序应该在小屏幕范围内运行实用程序常常与其他程序一起运行，因此它们需要在小屏幕范围内运行。实用程序应该有灵活的窗口布局，以适应多种不同的大小。实用程序很少以最大化的形式运行。
l 使用实际文档的SDI程序必须支持运行多个实例*运行多个实例使用户能够同时操作多个文档。
l 使用"退出"命令终止程序使用"退出"终止程序；使用"关闭"移走主窗口和非模式对话框；使用"取消"移走模式对话框。当关闭主窗口并不表示终止进程时，对于主窗口使用"关闭"来代替使用"退出"。例如：关闭打印机状态窗口不会取消打印任务。
1.3.1.5. 默认
l 保存和恢复用户选择程序应该能够能够恢复到其最后退出的状态。MDI程序应该能够恢复文档窗口的大小和位置。对话框通常应该使用最后输入的值作为默认值。
l 提供适当的默认值提供提供适当的默认值来减少用户不必要的操作，从而帮助用户完成工作。提供最可能使用并给出设置实际使用方式的默认值。通常，最好的默认值是用户最后输入的值。
l 考虑选择默认值时的安全性* 不应该将不可恢复或破坏性的操作设置为默认值。不要使用令用户感到莫名其妙的默认值。
1.3.1.6. 窗体
对话框窗体大小尽量不要超过640*460，留20给任务栏。并且高和宽（或W宽和高）的比应该大致保持为3:4（或4：3）。一般应该将窗体的"Position"属性定义为 "poDesktopCenter"，"WindowState"属性为"wsNormal"，某些主界面设置为"wsMaximized"。"ShowHint"属性设为"True"。如果是模式对话框，则将"BorderStyle"属性设置为"bsDialog"。
窗体文件(*.dfm)保存为文本格式，以便在VSS中比较不同版本之间的差别。如果窗体大小超过屏幕大小，则在Delphi开发环境中打开时，大小会有改变，并且影响到运行时刻效果。由于每个人的屏幕大小设置不一样，有些是1024*768，有些是800*600，因此在设计期间请注意窗体大小，尽量不要超过800*600，以免出现上述问题。

1.3.1.7. 布局和间距
窗体控件布局和间距尽量保持与Windows标准一致。控件与窗体的上、下、左、右边距为7象素。右下角主命令按钮之间的间距为6象素，如果主命令按钮在右上角，之间的间距则为4象素。主命令按钮一般情况为75×21象素，如果按钮的文本很长，应该适当加宽按钮的宽度。如下图。其它详细资料请完全参照错误！书签自引用无效。和命令按钮。

控件的"TabOrder"属性值应该与控件排列顺序一致，即遵循从上到下、从左到右这样一个流程。如果在PageControl的多个页面中存在类似的控件，应该尽量使得它们在各个页面中出现的位置/大小比较一致，以免在页面间切换时产生闪烁感。

1.3.1.8. 图标、图片
不同界面中的同一功能应该使用同样的图标和图片。图标、图片的色调、风格尽量保持一致。图标、图片的隐喻应能确切表示功能的含义，如果不能，就直接使用文本，以免混淆用户。如果功能是一个动作时，可能比较难找到确切表示该功能的图标，这时应该尽量采用此动作相关的名词做图标。例如Windows中的"剪切"功能就是用一把剪刀来表示的。
1.3.1.9. 提示信息（Hint）
工具栏按钮应该设置工具提示 "Hint" 属性。Hint能帮助用户更方便地理解和使用。详细资料可以参照工具栏、工具提示。
如果使用了"TSpeedButton"控件，并且只有图标，同样应对它设置"Hint"属性。如果不是特殊情况，应尽量避免使用"TSpeedButton"控件，而使用"TButton"控件代替。
1.3.1.10. 标点符号
在标识控件用途的标签文本（Label）和提示信息（Hint）中，应使用半角符号。如果是指导性标签文本（如解释按钮功能的句子），则使用全角符号，并且句子应遵循中文标点符号标准。如下图Microsoft标准对话框例子。其他详细资料可参照静态文本。

1.3.1.11. 对话框
l 对话框应该在所有视频模式下都能够正确显示当在VGA模式（640×480）下显示时，对话框应该不超过640×460（留20像素给任务栏）。这将确保对话框能够显示在所有的视频模式下。
l 确保模式对话框的模式*确保使用具有父窗口的模式对话框都提供正确的父窗口句柄，而不时提供NULL句柄。如果没有提供父窗口句柄，那么父窗口仍处于活动状态，因此该对话框实际上并不是模式对话框。
l 不要使用可滚动的对话框*也就是说，不要使用需要滚动条来进行完全查看的对话框。这种对话框使用起来非常不方便，并且也时完全不必要的。应该重新设计这种对话框。
l 不要在作为二级窗口的对话框中使用菜单栏*使用这种对话框需要付出很多努力。注意，在用作主窗口的对话框（如"查找"实用工具）中，菜单栏时可以接受的。还要注意的是，在所有对话框中，快捷菜单和菜单按钮都是可以接受的。

二级对话框不要使用菜单栏，但可以使用菜单按钮。

l 不要在作为二级窗口的对话框中使用标题栏图标*标题栏图标用于区别主窗口和二级窗口。
l 不要在任务栏上显示作为二级窗口的对话框*注意，单击主窗口的的任务栏图标也将激活二级窗口。
l 对话框中使用下页图所示的页面布局和间距。

l 对于相似的对话框，使用控件位置来强调其相似性。如果意义相同的同一控件出现在一些相似的对话框中，那么它应该显示在相同的位置。另一方面，应避免将可能会产生混淆的不同控件放在同一位置。
l 对非模式对话框最好使用可停放的对话框可停放对话框在功能上与非模式对话框是等效的，但其位置设置更为灵活。
l 策略地设置输入焦点将最初的输入焦点设置在最可能首先使用的控件上。
l 在对话框标题文本中不要出现省略号例如，作为选择"打印选项..."命令结果而显示地对话框的标题应该为"对于选项"。但是，表示命令正在执行过程中菜单对话框（如"连接到Internet..."对话框）是一种例外情况。
l 为所有可处理访问键的控件分配访问键*访问键可以使用户的手保持在键盘上，从而使访问程序更加方便。您可以直接在其标题中为诸如命令按钮、单选按钮、复选框等控件分配访问键。通过提供静态文本标签或带有访问键、在Tab顺序上先于控件的组框，您可以为诸如编辑框、列表框、组合框等控件分配访问键。在其他情况下不要为组框分配访问键--这会使人产生混淆。"确定"按钮没有访问键，因为在作为默认按钮时，它通过提Enter键来选定的。"取消"按钮也没有访问键，因为Esc键预览清除模式对话框。如果可能，避免使用小写的g、j、p、q或y作访问键，也避免使用这些字母前后的字母作为访问键。下划线不能与这些字母的下行字母分开。当然，访问键必须是唯一的。
l 避免使用粗体文本尽量少使用粗体文本。在Windows 3.1 的对话框中，粗体文本用于在旧式的视频硬件上绘制被禁用的文本（即抖动的灰色文本）。因为现在的视频硬件可以绘制没有抖动的灰色文本，所以Windows 为了使外观更加清洁，现在Windows 在对话框中使用正常文本。粗体文本仅用于强调。对于大多数对话框不要粗体文本。
l 提供环境敏感的帮助对于复杂的对话框，应该为整个对话框提供环境敏感的帮助（通过帮助按钮或F1键访问），或者为个别控件提供控件特定的帮助（通过"这是什么？"按钮或Shift＋F1 键来访问），或者同时提供这两种帮助。
1.3.1.12. 对话框的主要命令按钮
l 将主命令按钮与对话框主体分开*主命令按钮包括像"确定"、"取消"、"关闭"、"帮助"、"停止"、"隐藏"，以及其他相关按钮的等命令按钮。这种分开使主命令按钮更易于查找和识别。
l 认真选择对话框的方向在西方文化中，人们习惯于从左到右、从上到下进行阅读，因此，将主命令按钮靠底部或右边放置更容易被发现。您应该选择对话框的外观比例与屏幕的外观比例（通常高与宽的比例为3：4）相似的方向。这将使对话框的外观看起来更加舒服，并且更易于在屏幕上进行定位。如果按钮具有不同的大小，那么可以将它们放在对话框菜单底部。当不能确定时，也可以将按钮放在底部，因为这种定位方式最为常见，也更易于阅读。
l 将排列在底部的主命令按钮右对齐右对齐主命令按钮适合从左到右的阅读习惯。当只有一个主命令按钮时，您或许希望例外地将其居中放置。

右对齐主命令按钮

l 避免使用多行或多列的主命令按钮多行或多列的主命令按钮对用户是一个打击。如果有许多主命令按钮，那么注意，通常在右边排成一列与在底部排成一行相比可以放置更多的按钮。另外，您可以考虑使用命令菜单。如果必须使用很多按钮，那么注意使用多行别使用多列的效果好。
l 对模式对话框，通常提供"确定"和"取消"按钮*要使用对话框，用户需要能够方便地识别前进（使用"确定"按钮）和后退（使用"取消"按钮）的方式。您可以使用更明确的按钮代替"确定"按钮，但绝对不要在模式对话框中替换"取消"按钮，除非用"停止"来表明正在进行的操作无法取消。
l 对于非模式对话框或或作为主窗口的对话框，提供"关闭"按钮而不提供"确定"和"取消"按钮*将"确定"和"取消"按钮用于非模式对话框或作为主窗口的对话框可以使对话框看起来像是模式对话框。而且，当用于非模式环境中时，"确定"和"取消"时没有什么意义的。使用"关闭"按钮可以消除这种混淆。
l 通常将"确定"按钮排第一，"取消"其次，"帮助"最后*"确定"或其等价按钮通常作为第一个主命令按钮。"取消"按钮应该位于"确定"的右边或下面。将"确定"和"取消"按钮放在一起。"帮助"按钮应该时最后一个按钮。如果没有"确定"按钮，那么应该将"取消"按钮放在"帮助"按钮的前面。这可以使主命令按钮更易于查找和识别。
l 确保"取消"按钮真正用于取消操作*当取消时，程序的状态栏应该与之前显示的模式对话框完全相同。如果不是这样，那么应该用"停止"按钮来代替"取消"按钮。模式对话框中的"取消"按钮应该与标题栏中的"关闭"按钮效果相同。而属性表是个例外，因为"取消"按钮不会取消已经应用的更改。
1.3.1.13. 属性表和属性页
l 让属性页独立工作避免使一个属性页的行为或操作受其他属性页的限止。用户不可能发现属性页之间的这种独立关系。在属性页的使用顺序方面应该没有限止。用户应该能够随时查看任意的属性页。
l 属性页的布局相互独立一些属性页通常不会占用同样大小的空间。占用空间较小的属性页应该与最大的属性页的布局的格式方式不同，因为将会产生额外的空间（见下图）。

属性页的布局保持独立，避免居中。

l 用属性表代替使用带选项卡的对话框使用属性表而不使用带选项卡的对话框除了具有一致性之外，没有什么明显的实用性优势。另外，对于实际显示对象属性的对话框使用属性表，而对于其他用途，所有带选项卡的对话框。
l 对属性显示总采用属性表，即使仅有一个页*采用属性表能够明确告诉用户查看的使属性而不是一般的对话框。属性表有一个"应用"按钮来帮助用户测试设置。
l 绝对不要使用两行以上的标签*最好使用一行标签，但两行也是可接受的，两行以上就太多了，可用级连属性设置或多个对话框代替。
l 总为属性提供"应用"按钮再说一次，提供"应用"按钮帮助用户对设置进行测试。
l 对显示属性的属性表总是在其标题中写上"属性"一词和对象的名称*请注意，不是所有的属性表都是用来显示属性的。
l 总将命令按钮放在右边*适用于所有页的命令按钮必须置于标签页区域的外面，而仅适用于单个页的命令按钮必须置于该标签页的里面。
1.3.1.14. 向导
l 对高级的、复杂的或不常用的任务使用向导向导对非常高级或复杂的任务十分有用，省去了用户许多麻烦的操作。当向导用于不常用的任务时，其效果最好。对常用任务使用向导则显得大而不当。
1.3.1.15. 控件
l 尽量采用标准控件尽可能采用标准控件（6个最早的控件和新的Win32常用控件）。采用非标准控件的程序与绝大多数Windows程序看起来不一致。只用完全合理时才使用自定义控件。
l 定制标准控件时要小心改变标准控件的标准外观或行为时一定要小心，这是个常常出错的地方。
l 将无效控件置为不可用*将不适用于当前程序状态的控件置为不可用。
l 取消不必要滚动条尽量使控件的尺寸足够大，避免使用滚动条。
1.3.1.16. 命令按钮
l 采用最小的宽度和标准的高度带文字的命令按钮应该采用50个对话单位（75个像素点）的最小宽度、14个对话单位(21个像素点)的标准高度。尽量将不同大小的带文字命令按钮的个数控制在两个以内。对父窗口拖动（owner-draw）按钮或无文字的按钮（如"…"），其大小可以任意设置，原则是使命令按钮外观简朴一致。高度大于14个对话单位(21个像素点)的按钮看起来不够专业。尽管不限制命令按钮的最大宽度，但宽度超过200个对话单位的按钮使不妥当的。请参阅下图所示关于命令按钮的实例。

命令按钮大小示例

l 针对国际化适当加宽按钮尽管50个对话单位（75个像素点）的宽度是适合英语文字的最小宽度，但对需要针对其他语言进行本地化的程序来说，可能就太小了。对于需要翻译为其他语言的程序，将命令按钮的最小宽度定为60个对话单位可能更适合。
l 将无效按钮置为不可用，以取消报错*绝对不要使可用的按钮仅产生一条出错信息。
l 总采用省略号来表示需要更多信息*命令中的省略号表示执行命令时需要更多信息，而不是简单的确认。省略号并不表示一定会出现对话框。
l 绝对不要指定双击行为*用户意料不到命令按钮会响应双击，因此不可能发现这样的行为。
命令按钮大小使用Window标准75x21象素。一般情况下，"确定"和"取消"按钮的属性设置如下：
btnOk: TButton
     Caption = '确定'
     Default = True
     ModalResult = mrOk
end
object btnCancel: TButton
     Cancel = True
     Caption = '取消'
     ModalResult = mrCancel
End
"确定"和"取消"按钮一般被映射为Enter键和Esc键，因此不应该对它们指定访问键，除此以外的命令按钮都应该指定一个访问键。如下图：

主命令按钮在下

如果主命令按钮在右上角，应该布置为这样。

主命令按钮在上

如有其他不明，请参照命令按钮。
如果设计期间未指定"ModalResult"，注意一定要在按钮的"OnClick" 事件代码中为"ModalResult"赋值。
1.3.1.17. 复选框
l 用复选框开关选项，用单选按钮改变模式*用复选框进行选项的开关操作是很有效的，但如果用来将模式改变为另外一种状态就难免让人迷惑了。例如，可用一个复选框来表示是否显示工具栏，但若用复选框来切换打印机的横向模式和纵向模式就会使人糊涂，对横向和纵向模式应该用一组单选按钮代替。
l 避免一组复选框中选项个数超过8个应该考虑用复选框列表代替，它占用的空间更少，但复选框列表需要滚动时使用就稍稍麻烦了。尽管控件足够或保持与同一窗口中其他复选框一致时，采用复选框时可取的，但大于8个左右的复选框就未免太多了。
l 考虑将修改组的复选框置于应该分组框中这样的分组使得复选框之间的关系更为明显。
l 宁可竖向对齐虽然更合适的情况下采用横向对齐或直角对齐也是可以接受的，但竖向对齐的一组复选框更易于浏览。
1.3.1.18. 单选按钮
l 避免一组单选按钮中的选项个数超过8个考虑用列表或组合框代替，它们占用的空间更少，但要记住控件使用更麻烦些。尽管控件足够或保持与同一窗口中其他单选按钮一致时，采用单选按钮是可取的，但多于8个的单选按钮未免太多了。
l 避免使用单选按钮进行开 / 关或是 / 否选择用复选框代替。
l 总将单选按钮置于一个分组框中*由于单选按钮是一组相互排斥的选项，所以分组框使选择更为明确。
l 宁可竖向对齐虽然更合适的情况下采用横向对齐或直角对齐也是可以接受的，但竖向对齐的一组单选按钮更易于浏览。
1.3.1.19. 组合框
l 总给组合框提供一个标签*必须用标签来表明组合框的用途。
l 使组合框的下拉列表最少有5行长少于5行的列表就没有可用的滑块，不易于滚动。请注意，如果组合框没有足够的列项来填满列表，那么将自动缩短列表的长度。
l 避免组合框的列项少于4考虑用单选按钮代替，它们虽然多占空间，但更易于操作。如果空间更为重要或为了保持与同一窗口中的其它组合框一致时，采用组合框则更为可取。
1.3.1.20. 编辑框
l 总给编辑框提供一个标签*必须用标签来标明编辑框的用途。如果标签在左边，将标签文字与编辑框文本垂直对齐。
l 避免有输入限制的编辑框将编辑框用于用户对任何文本的输入或数字编辑框用于数字的编辑。对于输入受限的情况，使用其他的控件，如组合框、列表、滑块和微调框。对于日期和时间，使用日期和时间拾取控件。
l 用微调框和浏览按钮使编辑框可视微调框和浏览按钮是简单的可视机制，它们帮助用户在编辑框中进行有效的输入。避免让用户必须输入。仅对数字编采用带微调框的编辑框，对于文本，使用组合框代替。
l 按期望输入来设置编辑框的宽度编辑框的宽度是对期望输入的可视提示。例如，如果用户是输入地址，两个字符宽的State字段明显暗示用户输入两个字符的州名缩写。如果期望的输入没有特别的大小，就选择与其他编辑框或控件一致的宽度。
l 总采用数字编辑框用于数字输入*当用户在数字字段中输入非数字文本时，不应该有任何出错消息。
1.3.1.21. 滑块
l 总给滑块提供一个标签* 必须用标签来标明滑块的用途。而且，滑块还应该有标明高、低值意义和当前选择的标签--当然都不带冒号。
1.3.1.22. 静态文本
l 左对齐静态文本标签左对齐使得标签外观更有条理，且易于浏览。
l 宁可将静态文本标签置于相关控件的左边，而不是上面这样对齐使标签更易于被发现，且方便了标签和控件的浏览。很明显，长控件是例外情况，如列表视图、树形视图（Tree）和多行编辑框。
l 总在用于标识控件的静态文本标签后带上冒号*使用冒号明显表示为控件标签的文本。为控件提供附加信息的标签不应该有冒号，如用来解释滑块控件的标签。标签也可作为屏幕读出器的输入信息。
l 对非标签文本总用只读编辑框* 只读编辑框允许用户将文本复制到剪贴板上，并在文本比控件长时可进行滚动。
l 不要把静态文本置于凸起的边界上*在凸起边界上的静态文看起来像按钮，因而用户会试图单击它。
1.3.1.23. 列表框
l 总给列表框提供一个标签*必须用标签来标明列表框的用途。
l 使列表框至少5行长少于5行的列表没有滑块，不便于滚动。如果列表框没有滚动条，那么使用一个更短的列表框也是可以接受的。
l 对多个选择考虑采用复选框复选框列表可以突出其多个选择的能力。如果不能接受复选框列表，那么可以采用多选列表，并用静态文本表示选项个数，清楚指明可进行多项选择。
l 对多选列表考虑提供"全部选中"和"全部取消选中"命令由于希望全部选中或全部取消使常见的事情，所以这两个命令方便了用户进行多项选择。
1.3.1.24. 列表视图
l 总给列表视图提供一个标签*必须用标签来标明列表视图的用途。
l 使列表视图至少5行长少于5行的列表视图没有滑块，不便于滚动。如果列表视图没有滚动条，那么使用一个更短的列表视图也是可以接受的。
l 仅在列表可排序时采用可单击的表头*可单击的表头只应用于排序。首次单击时应按正序对列表进行排序，而第二次单击时按反序进行排列。
l 对列项大约超过30的列表视图总使其可进行排序*用户能够对列表进行排序方便了对信息的查找。
1.3.1.25. 滚动条
l 滚动条仅用于滚动*使用滑块或微调框来设置数值。
l 使滚动条足够长，保证有可用的滑块。没有滑块的滚动条不便于使用。
1.3.1.26. 分组框
l 利用分组框分组相关控件尽管分组框通常是用于单选按钮的分组，但也可用于任何控件的分组。避免使用只有一个控件的分组框，除非是为了保持与同一对话框中其他分组框一致。
l 考虑采用静态线或文本标签来代替分组框分组框多时要占去许多空间。如果空间紧张的话，一个替代分组控件的好办法是同时采用静态文本标签和静态线。

考虑采用静态文本标签和静态线代替分组框

l 不要在分组框标签的后面使用冒号*分组框标签的意思明白，使用冒号完全没有必要且让人糊涂。

1.3.1.27. 菜单
l 总用单个单词作为菜单标题*菜单栏上多个单词的菜单标题看起来像多个菜单标题。
l 不要在菜单栏的文本间留有空隙*不一至的菜单栏文本既无用，又难看。
l 避免占多行的菜单栏*尽管将父窗口缩小到足够窄时，任何菜单栏都要占用几行，当要避免正常使用时因菜单项都而占用几行的菜单栏。
l 保持菜单稳定*将无效菜单置为不可用，而不要删除它们。但是，对整个程序实例都无效的菜单，就应该删除。
l 合理安排菜单项的顺序将相关菜单项组合在一起。重要的命令应该位于菜单的顶部，而不重要的菜单则位于菜单的底部。
l 将无效菜单置为不可用来代替报错*菜单绝不应该有仅产生出错消息的可用命令。
l 分配访问键*访问键使用户可以手不离开键盘进行操作，并提供程序的可访问性。尽可能避免用小写字母g、j、p、q、y或单词中与它们靠近的字母来分配访问键，因为下划线与下一行的字母不好区分。当然，一个菜单中的访问键应该是唯一的。
l 总采用省略号来表示需要更多信息*命令中的省略号表示执行时需要更多的信息，而不是简单确认。省略号不表示一定有对话框出现。
l 使用标准菜单避免不提供"文件"、"编辑"和"帮助"菜单。由于这些是标准菜单，所以用户会期望它们出现。例如，期望在"文件"菜单中发现像"打印"和"退出"这样的命令，虽然这些命令可能与"文件"无关。同样，用户期望在"编辑"菜单中发现"剪切"、"复制"和"粘贴"命令，至少要在"帮助"菜单中发现"关于"命令。
l 统一放置"查找"和"选项"命令总将"查找"命令放在"编辑"菜单中，而有"工具"菜单时，总将"选项"置于其中，否则置于"查看"菜单中。
l 用复选标记来开关选项，用单选组来改变模式*用复选标记进行选项的开关操作是有效的，但如果用来将模式改变为另外一种状态就难免让人迷惑了。例如，可用一个复选标记来表示是否显示工具栏，但若用复选框来切换打印机的横向模式和纵向模式就会使人糊涂，对横向和纵向模式应该用一个单选组来代替。
l 不要使用多列的下拉菜单*多列增加了菜单不必要的复杂性。
l 不要使用"Bang"（爆炸的声音）菜单*Bang菜单是菜单栏上那些看起来像下拉菜单，但实际是选择后立即执行的命令，如"退出"！显然，用户希望菜单标题就只是菜单，而不是命令。
l 不要右对齐菜单标题*这样的菜单风格陈旧且不易于使用。
1.3.1.28. 上下文菜单
l 考虑将上下文菜单作为冗余使用上下文才菜单不应该是访问命令的唯一方式。通常上下文菜单中的命令应该在菜单栏中也提供，使用上下文菜单是为了提高访问效率。
l 避免在上下文菜单中包含快捷键应该将快捷键分配在菜单栏中，上下文菜单的快速访问是通过鼠标进行，而不是通过键盘。
1.3.1.29. 工具栏
l 保持工具栏稳定*将无效的工具栏按钮置为不可用，而不是将它删除。但是，应该考虑删除用户进入一种模式用不到的整个工具栏。
l 将无效命令置为不可用，而不是报错*工具栏绝不应该包含只出现错误消息的命令。
l 对实用程序采用大工具栏按钮好的使用程序工具栏常常与应用程序的按钮不同，其按钮更简朴，更大。实用程序工具栏应该只包含几个带有描述性文字和图形的显眼命令。
l 对应用程序采用可移动的、可定制的工具栏，而对实用程序采用固定的工具栏应用程序需要灵活的工具栏来支持其典型的使用方式。用户使用实用程序的时间一般不长，因而不需要定制工具栏。
l 提供显示或隐藏工具栏选项如果有多个工具栏，分别为它们提供显示或隐藏的选项。
l 总使用工具提示*工具提示帮助用户了解工具栏按钮的作用。
1.3.1.30. 工具提示
l 用工具栏的工具提示来提供信息，但要简短避免提示很明显的事情。考虑采用省略号来表示执行命令时需要更多信息。如果该命令已分配有快捷键，则显示该快捷键。
l 使工具提示文本成为高级用户的媒介工具提示用于简短的识别和提醒，而不是用来教学。
l 用工具提示显示有用信息不仅仅可在工具栏上使用工具提示，它的使用简单，能够向用户提供有用信息。但不可滥用--工具提示太多也就失去了其价值。不要对命令按钮会静态文本这样的控件使用工具提示。
l 不要自动消去包含许多文字的工具栏提示默认时，10秒种后工具提示将自动消去。如果工具提示的文字很多，10秒钟对用户来说就看不完了。
1.3.1.31. 文本
l 避免不必要的缩写词要么给文本更多的空间，要么改写文本使其占用更少的空间，缩写词使文本不易理解。
l 避免不必要的大写字母文本除非只去首字母构成的缩写词，否则不要用字母全为大写的单词，这样的单词看起来像在冲用户大喊大叫一样。
l 避免复杂的标号尽量采用简单的标点，如句号、逗号、问号，以及破折号。避免使用分号、感叹号、圆括号、括号，等等。
l 采用一致的大小写规则*对窗口标题、菜单、命令按钮、列标题属性页选项卡以及工具栏提示文字采用与书题一样的大小写规则，而对于标题、单选按钮、复选框、分组框和菜单项帮助中的文本采用与句子一致的大小写规则。（对于标题，除了不是标题开头和结尾的冠词和介词外，每个单词的第一个字母大小。对于句子，每个句子的第一个单词以及通常大写的单词--如专有名词的首字母大写。）
l 避免不好的背景将文本放在实地、颜色适中的背景上，确保在文本和背景之间存在良好的对比。
l 避免冒犯性语言避免激烈的词语，如fatal（致命的）、execute（执行）、kill（杀死、毁掉）、terminate（终止）、和abort（中止）。
1.3.1.32. 消息框
l 仔细选择消息框的类型采用带"确定"按钮的信息消息框向用户提供有关命令结果的信息。采用带"是"、"否"，以及可能"取消"按钮的警告消息框在继续进行前需要用户输入的情形下告诫用户。采用危急消息框通知用户进行工作前需要修改一个错误。
l 不要使用疑问消息框类型*不再推荐对消息框使用疑问标记符（MB_ICONQUESTION），因为它在Windows98后一致用来表示上下文修改帮助。
l 避免不必要的消息框不要用出错消息来报告正常行为，而应该用来报告不正常或不期望的结果。不要对很容易恢复的操作进行确认。
l 问用是/否回答的问题问用户问题时，采用"是"和"否"按钮代替"确定"和"取消"按钮，这样使问题易于理解。与对话框中不一样，"确定"和"取消"按钮很少同时用在消息框中。
l 确保消息框选项按钮与文本一致例如绝不要用"是"和"否"来作为非提问消息的响应。同样，不要使用多个效果相同的选项按钮。例如，除非有不同的操作结果，否则不要同时提供"否"和"取消"按钮。"否"按钮应该执行操作，而"取消"应该取消操作。
l 仔细选择默认按钮将最安全的或最常用的选项作为默认按钮。
l 避免无用的帮助除非提供真正有用的附加信息，否则不要提供"帮助"按钮。不要附加带无用帮助信息的没意义的消息框。
l 对危急错误考虑采用系统模式消息框采用系统模式消息框向用户提示严重的、可能造成破坏性的、急需注意的错误。系统消息框除了有WS_EX_TOPMOST样式外，与应用程序模式对话框完全一样。与在16位Windows中不一样的是，系统模式不影响用户与其他程序的交互。
1.3.1.33. 错误消息
l 避免错误号除非这个错误号对用户真正有用，否则不要给出错误号。
l 避免责怪用户避免在出错消息文字中出现单词you（你）或your（你的）。如果需要，当指用户操作时使用被动语气。采用与"错误发生了"等价的表达，比采用与"你捅漏子了"等价的表达要好得多。
l 避免敌对性语言避免在错误消息文字中使用词语bad（糟糕的、坏的）、caution（小心）、error（错误）、fatal（致命的）、illegal（非法）、invalid（无效）和warning（警告），而应该使用更具体的描述性词语。并且应该尽量解释到底是什么出了错。
l 在出错消息文字中使用平实的语句表达要简短、清楚、协调、具体。除非缩写词，否则不要使用全部大写的单词，那样的单词看起来像在冲用户大喊大叫一样。使用完整的句子和一般的现在或过去时态。避免缩写词。
l 避免在用户错误消息文字中装做有趣或高人一等用户并不觉得错误消息有趣，故装幽默并不能被广泛接受。
l 允许用户压制非危急的错误消息对经常出现的非危急错误，向用户提供一个压制该错误消息的选项。
1.3.1.34. 字体
字体统一使用以下设置：
Charset = GB2312_CHARSET
Name = '宋体'
Size = 9
Color = clWindowText
Style = []
字符集不要使用 ANSI_CHARSET 或 DEFAULT_CHARSET，否则可能导致不同的操作系统下字符集不一致。
l 尊重用户的字体选择*Windows允许用户为标题栏、菜单、消息框和工具提示选择字体。及时处理WM_SETTINGCHANGE消息以根据设置迅速而安全地改变字体。
l 避免让人分心地字体一般说来，应避免使用Arial、Tahoma和MS Sans Serif之外的字体。Verdana、TrebuchetMS和Century Gothic也适合于轻微差别的外观。即使文档中的截线字体很不错，但界面中的任何截线字体都被认为是让人分心的。除了提示用户输入或模拟打字机外，不要采用等宽字体。
l 避免使用粗体和斜体用粗体来吸引人的注意，用斜体表示着重，但要还少使用。
l 避免混合字体任何不包含文档的窗口最多包含两种不同的字体。
1.3.1.35. 颜色
l 使用系统颜色*尊重用户的颜色选择，避免使用固定颜色。不要强迫用户使用您选择的颜色。避免让人分心的文本颜色，通常是黑色之外任何颜色，对文本使用系统颜色COLOR_BTNTEXT或COLOR_WINDOWTEXT。在白色（COLOR_WINDOW）背景上使用黑色（COLOR_WINDOWTEXT）文字是完全正确的。及时处理WM_SYSCOLORCHANGE消息以根据设置迅速而完全地改变颜色。
l 根据内容而不是外观来选择系统颜色*不要将作为一个集合中的几种系统颜色混合匹配在一起。例如，不要将COLOR_BTNTEXT和COLOR_WINDOW混合在一起。
l 考虑对图形使用中间调色板在256色模式下使用中间色调色板避免了调色板的闪烁。
l 不要用颜色作为传递消息的唯一方式*不依赖于对颜色的区分可以增强程序对色盲用户的可访问性，并且使程序可运行在单色显示器上。
1.3.1.36. 三维效果
l 避免不必要的三维效果除非对控件分组，否则避免三维静态线和矩形框。宁可采用空白来分开组件，绝不在三维矩形框周围套其他的三维矩形框。避免使用三维文本。

三维效果过多

在界面中采用太多的三维效果是程序员常范的错误。毕竟，如果有些三维效果很酷，对吧？不完全如此。请看下面的对话框。一点也不酷。一旦三维控件流行起来，就好像能使用三维的都采用三维，而不管看起来是好是坏。即使采用三维边框，其目的也是为了让人理解。采用许多三维静态框架控件通常是个坏征兆，现代的趋时是倾向于更为简单的风格。

l 使用柔和的三维效果请注意Window98中更为细致的三维效果是如何比Window 3.1中的三维效果更有效更悦目的。尽管绝大多数现时世界的物体有加亮区，但很少有黑色实边框的。Windows98仅是通过在突起物体的右边和底部加上黑色边框以及在凹陷物体的上部和左边加黑色边框来达到三维效果。

去除多余的三维效果

最少三维效果

l 使用一致的三维效果*确保三维效果的光源位于屏幕的左上角。
1.3.1.37. 各种细节
l 不要发音和闪动没什么比发音和闪动的程序更烦人的了。但闪烁程序的任务栏窗口按钮通知用户未决消息例外。
l 避免不必要的视频效果至少一个使其为可选择的。理想情形是，默认时关闭这样的效果，用户有明确要求时才打开。
l 用缩放功能提高文档可访问性提供提供文档缩放功能，可提高显示文档的程序的可访问性和整体性能。
l 处理WM_DISPLAYCHANGE消息*改变显示分辨率后，程序应该能够正确显示和运行。
l 基于光盘的程序的应该支持自动播放当光盘插入驱动器后，"自动播放"应该显示一列选项，包括安装。程序安装以后，不应该运行"自动播放"。
l 支持用户采用日期和时间拾取控件进行日期输入，GetDateFormat和GetTimeFormat函数用于设置货币和数字的格式，LCMapString API用于排序。考虑采用RichEdit控件用于文本输入和输出。最后，利用WM_INPUTLANGCHANGE消息来处理输入语言的改变。
1.3.2. 统一术语
1.3.2.1. 术语的重要性
我们用名称来区别、描述和查找事物，使用名称来分解并理解不熟悉的事物。采用统一的术语有助于我们更好地理解和进行交流--简化并统一用户界面术语有助于用户理解和充分应用我们设计的界面。
使用不同的术语描述相同的事物是最让人迷惑的，而改变人人都已经熟悉的术语也是有害的。这两种情况都使得程序难以讨论、描述，以及归档。甚至使它难以编程。
1.3.2.2. 命名
下面是一些需要命名的、与界面有关的典型对象：
● 程序本身；
● 程序使用的文档类型；
● 用户利用程序执行的主要操作；
● 所有的窗口、对话框和属性表；
● 主程序窗口中的使用区域；
● 认为非标准的屏幕对象、命令、属性、交互、或者技术。
简而言之，用户可以看到或需要与其进行交互的、显示在菜单、工具栏、窗口、对话框、状态栏、联机帮助或文档中的任何内容都需要有一个名称。当然，您将会使用已存在的标准屏幕对象的名称。例如，您不需要命名常用的对话框，因为它们已经拥有名称。

1.3.2.3. 用用户的语言说话
使用软件面向的用户所熟悉的词语，除非您的软件是为了程序员设计的，否则应该避免使用计算机行话，而应用常用的单词代替。例如，对绝大多数用户来说，常用单词"separator"（分隔符）就比技术术语"delimiter"（定界符）要好得多。如果必须使用技术词汇，那么应采用那些用户可能知道的术语。
1.3.2.4. 要避免的术语
也有些术语是千万不要用在您的用户界面中的。尽管"execute"执行、"kill"（杀死）、"terminate"（结束）、"fatal"（致命的）和"abort"（中止）这样的术语在程序员文献中是完全可接受的，但完全应该避免出现在其他的文字中。

PHOTOSHOP教程精选

Thu, 10 Mar 2005 08:16:39 GMT

http://www.yesky.com/20020724/1621869.shtml
天极美工,响亮的网站,教程多而全!
http://www.5dmedia.com/
不用多说了,学习的好地方!
http://www.51photoshop.com/
以后是英文的
http://www.eyeball-design.com
Text
一流的网页设计师,教程和设计作品比得不看,还有PSD下载啊!
http://www.eyesondesign.net/index.htm
教程和资源都不用说了,VERY GOOD!!!
http://www.voidix.com/tutorialsphotoshop.php
教程和链接都专家级水平
http://www.designsbymark.com/
老牌的PHOTOSHOP站点,现在教程正在更新,又有惊喜了!!
http://www.geda-online.com/index1.htm
专家级的网页设计作品,教程不得不看,网页作品是精品中的精品,设计师必去的网站!
http://misery.subnet.at/v10/words/news_2k01.html
个性化的设计师,平面作品和教程都个性化,好不好,看看便会给它迷倒!
http://www.guistuff.com/
想找PSD源文件的必到地方,教程不错但更新慢,但PHOTOSHOP资源是一般资源网站不能比的!!!
http://www.createdbycheney.com/testa/tutorials.html
年轻的设计师和那与年龄不相符的设计作品和教程,简直专家级水平!
http://www.planet-tutorials.de/tutorials_photoshop.php
很多的教程....
http://www.thinkdan.com
老牌的PHOTOSHOP站点,常有惊喜的作品!
http://www.photoshopcafe.com/
老牌的PHOTOSHOP站点,学习PHOTOSHOP的必去的网站!
http://www.computerarts.co.uk/
比较多的作品
http://www.screamdesign.com/files/freebies/index.html
很多的教程和资源!
http://veredgf.fredfarm.com/vbrush/main.html
一个专门的PHOTOSHOP笔刷资源网,就它就够了!
http://www.liquisoft.com/
一个用色很讲究的设计师网站,看过便知什么是用色的协调,知道我们的水平和他们有多远,强烈推荐!!

韩国I.R.I色彩研究所的216色网页调色板

Thu, 24 Feb 2005 05:31:53 GMT

其官方网站上有更多内容，不过都是韩文的

更多有关网页配色的文章，请查看幽幽天空

晃晃悠悠~~~: design

《CGArt》第七期发行免费下载

NewWebPick电子杂志第三期出炉

黑色和“他”的“密友”们

网页色彩的搭配

发现你的最佳色调

如何量化用户体验

网页调色板

人物的全面刻画 教程

设计精美的ICON

Adobe photoshop CS2

黄金分割在设计上的应用

一份界面规范(c/s)

PHOTOSHOP教程精选

韩国I.R.I色彩研究所的216色网页调色板

人物的全面刻画教程