Java开发网 - 图形界面设计的优化

Topic: 图形界面设计的优化

1.图形界面设计的优化

Posted by: pyjiang
Posted on: 2004-02-03 17:02

1.Franken UI:
THE OVERALL APPEARANCE sucks! It demos a lot of common GUI design errors that one can see so often in Java clients.
THE ICON SET is a mixture of several icon styles with different sizes, colors schemes and symbol styles. Most icons use oversatured colors.
BORDERS are used heavily and clutter the user interface. A source of trouble is the JSplitPane that comes with three borders for both components and the divider.
THE COLOR SCHEME conflicts with the Windows default desktop colors.
THE LOOK&FEEL is the Java look&feel and so, uses non-standard fonts on most Windows environments.
THE MENU ITEMS in the File, Edit, and Source menus are not aligned.

（缩略图，点击图片链接看原图）

2.Re:图形界面设计的优化 [Re: pyjiang]

Copy to clipboard

Posted by: pyjiang
Posted on: 2004-02-03 17:03

2.Rookit UI:
THE OVERALL APPEARANCE avoids the most dramatic graphical bloopers. However, it still sucks.
THE ICON SET is consistent. Nevertheless, it suffers from oversaturated colors and uncommon symbols.
BORDERS have been removed from all JSplitPanes.
THE COLOR SCHEME works well with the majority of default desktop settings, including Windows default colors.
THE LOOK&FEEL is the Java look&feel and so, uses non-standard fonts on most Windows environments.
THE MENU ITEMS in the File, Edit, and Source menus are not aligned.

（缩略图，点击图片链接看原图）

3.Re:图形界面设计的优化 [Re: pyjiang]

Copy to clipboard

Posted by: pyjiang
Posted on: 2004-02-03 17:04

3.Standard UI:
THE OVERALL APPEARANCE has been improved a bit. Nevertheless, it still lags behind the look and feel of recent native applications.
THE ICON SET is consistent and is well suited for most platforms, especially Windows.
BORDERS have been removed from all JSplitPanes.
THE COLOR SCHEME is based on system colors.
THE LOOK&FEEL is the system look&feel and so, uses non-standard fonts on most Windows environments.
THE MENU ITEMS in the File, Edit, and Source menus are not aligned.

（缩略图，点击图片链接看原图）

4.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: Jove Posted on: 2004-02-03 17:06 http://jgoodies.com/ 确实做的很强他说用2小时就用swing完成了这个fake eclipse 他的那些软件中的动画很不错，刚开始都有点怀疑是不是flash，这是他的Free lib http://jgoodies.com/freeware/animation/index.html

5.Re:图形界面设计的优化 [Re: pyjiang]

Copy to clipboard

Posted by: pyjiang
Posted on: 2004-02-03 17:07

4.Advanced UI:
THE OVERALL APPEARANCE can compete with native applications. It avoids the most common Java gui bloopers and works around some Swing look&feel deficiencies.
THE ICON SET is consistent and is well suited for most platforms, especially Windows.
BORDERS have been removed from all JSplitPanes.
THE COLOR SCHEME is based on system colors.
THE LOOK&FEEL is the system look&feel as implemented by JGoodies; fonts, menus, trees, tables, and text panes have been tweaked to more precisely emulate the native widgetry.
THE MENU ITEMS in the File, Edit, and Source menus are aligned.

（缩略图，点击图片链接看原图）

6.Re:图形界面设计的优化 [Re: pyjiang]

Copy to clipboard

Posted by: pyjiang
Posted on: 2004-02-03 17:08

5.Elegant UI:
THE OVERALL APPEARANCE is elegant; it has been copied from the eclipse workbench, see www.eclipse.org.
THE ICON SET is consistent and is well suited for most platforms, especially Windows.
BORDERS around panels have been replaced by Eclipse-like borders.
THE COLOR SCHEME is based on system colors.
THE LOOK&FEEL is the system look&feel as implemented by JGoodies; fonts, menus, trees, tables, and text panes have been tweaked to more precisely emulate the native widgetry.
THE MENU ITEMS in the File, Edit, and Source menus are aligned.
IN ADDITION, the tasks panel uses a gradient.

（缩略图，点击图片链接看原图）

7.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: pyjiang Posted on: 2004-02-03 17:13 经过几个步骤的改进，感觉爽多了^_^ http://jgoodies.com/ 还有其它几个项目，可供参考。

8.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: gunrose Posted on: 2004-02-04 08:03 有点意思。但还是不太明白。

9.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: 忧郁海风 Posted on: 2004-02-04 10:14 对啊，Jove能不能给简单解释一下？

10.Re:图形界面设计的优化 [Re: 忧郁海风]

Copy to clipboard

Posted by: Jove
Posted on: 2004-02-04 10:23

pyjiang贴的每张图片旁的文字写的挺清楚的
一开始的那张，基本确定了界面的布局
但很多地方不理想，界面的色调不够nature,菜单没对齐，字体不好看，图标大小不一风格不同且不够直观等等
然后他一步步做改进，换了字体图标，改进了JSplitPane, 换了theme甚至LookAndFeel..
不过我还是很好奇他怎么把一个Swing的UI做的这么好看
有机会看看他源码

11.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: jeez Posted on: 2004-02-04 12:50 简直牛的一塌糊涂啊。

12.Re:图形界面设计的优化 [Re: Jove]

Copy to clipboard

Posted by: 忧郁海风
Posted on: 2004-02-04 14:17

Jove wrote:
pyjiang贴的每张图片旁的文字写的挺清楚的
一开始的那张，基本确定了界面的布局
但很多地方不理想，界面的色调不够nature,菜单没对齐，字体不好看，图标大小不一风格不同且不够直观等等
然后他一步步做改进，换了字体图标，改进了JSplitPane, 换了theme甚至LookAndFeel..
不过我还是很好奇他怎么把一个Swing的UI做的这么好看
有机会看看他源码

对啊，我就是奇怪这个，我觉得后面的几个界面几乎就是SWT做出来的一样了

13.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: pyjiang Posted on: 2004-02-04 17:20 按作者说也没什么，主要就是： .统一工具栏图标的尺寸 .避免使用过于饱合的颜色 .菜单栏对齐 .使用本地系统的显示风格 .使用本地系统的背景色 .统一字体 .去掉Panel SplitPane TextPane及TreeView等的边框 ...... 可自己就是做不出来惭愧&佩服

14.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: kite Posted on: 2004-02-06 15:28 在java.net上有这个东西的源码，主要是look and feel ，如果真想做的这么漂亮，最好是用jgoodies的swingsuit，不过，这个东西是要钱的。

15.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: xmlone Posted on: 2004-02-07 16:13 确实好

16.Re:图形界面设计的优化 [Re: pyjiang]	Copy to clipboard
Posted by: bluejava Posted on: 2004-02-11 11:55 ooo, 记下了 look and feel ， jgoodies ---- swingsuit 唉好东西太多了，备受打击。