一些设计中的体会

首先声明:这不是教程也不是什么高人的指导指示啊这些,这是是我自己个人的看法。

最近在公司做一些软件,然后BOSS 提了一些问题和建议让我感到有些意外。本来我在设计东西的时候都是把自己放在用户的角度去设计的,结果发现自己的角度设计出来的东西还是让用户使用起来过于复杂了些。不过值得庆幸的是这个BOSS 不是程序出生的。不过这也是从事这行几年来的感受:程序出生的BOSS 会有习惯性的程序思维重视功能而不重视易用性的问题。而非程序出生的则是注重好不好用。好了不说这些了。

先说网页方面。对于字体,我自己感觉就是用系统自带的字体来做为网页的字体就是最好的兼容方式。因为基本上都是通用的字体了比如:Arial, Geneva, Arial, Verdana, sans-serif 。而且这些字体几乎所有的系统上都是自带了的。然后在页面的编写时也请用这些字体,好保持设计的一致。要是你非要用其他字体做默认字体那我也那你没法。

我经历的一个案例是:我和一个朋友一起去见一个客户,给那个客户看到了成品的网页和设计稿上的字体不同。这也不能怪我那个同事,这是他做的设计。不过他用的字体是微软雅黑,而客户那没有装微软雅黑,导致客户的反感,然后就因为是成品的网页和设计的不一致而不买账。不过即使那个客户是个SB 也无所谓。其实客户在乎的是一致性,做出来的要和看到效果图一样,那他才会满意。微软雅黑这个字体是不错,但是普及率很低,一般人都是用Vista 才会用到这个字体。使用这个字体的意图是很好的,但是没有考虑到字体通用性。

网页的分辨率也是一个问题,现在基本都是 1024*768的了,设计的时候还是要以 1008*600为基准来设计。宽屏的分辨率也是这样,考虑到阅读的习惯我建议网页的页面宽度都固定宽度,不用去自适应了。因为宽屏不是用来阅读的。曾经在800*600为主流时,页面宽度大都以770或780px为标准;在1024*768为主流时,页面宽度大都以950或960px为标准。当时准则很简单,首页固定宽度,因为版面容易控制;内文页自适应宽度,因为可以让更大屏幕(主要是1024*768)用户单屏看到更多内容。还有就是浏览型的网站尽量别用三栏,三栏太难设计,一个合理的页面不需要一下子摆出来那么多内容。

而我现在用的显示器都是16:10的宽屏。我现在都不用去最大化窗口来浏览网页了。感觉没那个必要了。我习惯把窗口拖大到 1024×700 左右的窗口大小来浏览网页。不过宽屏还是用来看电影最舒服了。

软件界面在设计方面主要就是质感的表现,图标栏目。具体的来说这是简单的也是很难的。简单来说就是渐变+纹理来体现质感。困难的来说就是质感的应用要配合你所设计的风格。光靠渐变也可以不过有时没有纹理来点缀也是不行的,反而质感会大打折扣。要说这个的参考那就是多去看看一些设计的好的软件界面了。还有就是图标,一个好的图标会起到画龙点睛的作用。图标可以用简单的线条来构成。也可用写实风格。不过要配合你设计的界面的风格那才更好。

软件界面在色彩方面的搭配就去看看常见的软件的配色吧,我比较推荐去参考一些出名的软件的配色。其它的没有什么好说的主要是看个人的对色彩感觉和灰度的应用了。比如我就喜欢用蓝紫黑这些颜色。最后就是要找个搭调而且耐看的配色那就是最好的了。

软件除了这方面以外就要在意用户体验了。用户体验这个我就不多去说了。简单来说就是 用词要简单明了。比如我最近的一个项目里面的一个处理邮件接收的弹出对话框标题,程序给的名字是“收邮件头”。结果 公司里面有部分人看到后就不明白。最后改成 “读取邮件列表”。

用户体验除了这个还要在乎用户的操作习惯,按钮的摆放位置等等一些细节的东西。有时用文字比图标表达意思来的更快跟明确。

好了就说这些了。详细参考资料如下:

以下阅读资源我就只给出地址了。自己复制到地址栏去查看吧。

  • http://www.uitimes.com/2006-10/2006102902228.htm
  • http://www.uirss.com/Modules/28_83.asp
  • http://www.uirss.com/Modules/27_44.asp
  • http://www.uirss.com/Modules/28_85.asp
  • http://www.uirss.com/Modules/28_67.asp
  • http://www.uirss.com/Modules/28_49.asp
  • http://www.uirss.com/Modules/28_47.asp
  • http://www.uirss.com/Modules/28_38.asp
  • http://www.uirss.com/Modules/28_36.asp
  • http://www.uirss.com/Modules/28_32.asp
  • http://www.uirss.com/Modules/28_33.asp
  • http://www.uirss.com/Modules/28_30.asp
  • http://www.uirss.com/Modules/28_29.asp
  • http://www.uirss.com/Modules/28_20.asp

Join the Conversation

4 Comments

  1. volcanono说道:

    写的很实在,宽屏就是为电影而生的,网页还是固定的好一些,有视觉焦点,看起来不那么费劲,不过Amazon一直是采用自动扩展的做法,优点是同样的高度下能展示更多的商品给用户,也提醒了我们,也许凡事要因地制宜啦,总之,这的确是值得探讨的话题,我是QQ群里的最爱肉夹馍,你说了加我友好链接的,不许反悔哦~

    1. Priest说道:

      Always the best content from these podirgoius writers.

  2. xu.hel说道:

    @volcanono: 链接已添加,在 Blogroll 页。 名字是 “vol视界”

  3. 写的很实用。
    网页设计一切应该以用户体验为准。
    但是,自己辛辛苦苦做的作品,被boss毙掉了,然后换上一个很S13的,那是非常之囧啊。很无语。

Leave a comment

电子邮件地址不会被公开。 必填项已用*标注