设计更好的GUI？

Question

我一直在使用C＃已经有一段时间了，但我的UI设计技巧还没有真正归宿。在我设计它们的时候，我发现自己正在享受这种设计，但是后来，我回头看它，看到了可怕的工作。从我的工作项目中可以想到一个例子，我必须使用127个按钮代表我们实验室中的127台计算机。 ：/

我想知道是否有人可以将我推荐给能够教授优秀UI设计的网站或书籍？

谢谢！

Answer 1

乔尔·斯波尔斯基（Joel Spolsky）写了一本名为“程序员用户界面设计”的书，这是一本很好的读物和一本精简版can be found online。

Answer 2

我相信观察和本能会有很大的帮助。

使用应用程序并深入研究它们实现的功能。特别关注Apple，因为它们围绕着美学。什么有用？什么没有？它为什么有效？在修补网站和软件时开始问自己的问题。

然后我会玩弄并设计一些概念。向技术和非技术的朋友展示这些概念。向他们提问，例如“在列表中添加新饮料”或“为我找到x”。看看他们如何反应并且彼此不同。有技术背景通知的人是否比非技术人员更快？你应该把元素组合在一起吗

这个东西应该很有趣。毕竟，这就像建立一个完整的乐高套装并展示给你的朋友。他/她可以看到，触摸和玩你的创作。

Answer 3

The Design of Everyday Things 作者：Donald A. Norman

The Humane Interface 作者：杰夫拉斯金

Answer 4

首先关注的最重要的是事物的工作流程。尝试找到用户拥有的目标，并创建一个尽可能有效地实现该目标的模型。另外阅读这本最好的书之一是Inmates are running the asylum

我会在这里建议很多草图。确保你保持简单化，专注于放置的东西和位置，而不是它们的外观。像balsamiq这样的工具非常适合快速UI模型。另外，在这里浏览UI模式以提出有效的概念，Tidwells书籍Designing Interfaces很棒，而且Infragistics new patterns site也是很好的资源

现在您已了解自己想要做什么，现在是时候将界面组合在一起了。在从第一个草图到最后一个像素的过程中 - 始终是用户测试。

并且不要总是遵循UI准则，如果你有充分的理由可以打破它们。最后，您只能在界面中获得一个免费的无关3D效果：）

Answer 5

基于Vinay的答案，在设计界面时，与目标平台的集成始终是最重要的。如果您在Windows上进行开发，请确保您忠实于该平台的外观，感觉和可用性期望。界面指南总是一个跳跃点，虽然有些比其他更好。对于我的钱，GNOME Human Interface Guidelines是设计用户友好界面的一套很好的指导方针，即使你没有使用GTK。

更一般地说，学习好的设计实际上是在学习认识好的设计。找到一些非常直观的应用程序，然后模仿它们的布局，样式等。然后，当您在如何实现特定功能时遇到困难时，在其中一个应用程序中找到合适的模拟。你需要特别注意分组，标签，快捷方式，对话框模式等问题。我想你会发现很少有好的设计原则依赖于你编程的语言，除非它可能影响您定位的工具包和平台。

Answer 6

我已阅读Spolsky的书程序员用户界面设计，以及经典 Windows界面软件设计指南和 Windows用户体验。后两者是很好的参考书。 Spolsky的书非常有趣，并教你如何考虑用户界面设计。

但是，对于我的钱，设计桌面应用程序用户界面的最佳方法是从流行软件复制现有解决方案。通过“复制”，我指的是两个截然不同的方面 - 机制和美学。

就机制而言，请确保您的用户界面按照人们期望的方式运作。例如，如果您有树视图，请确保键盘箭头适用于导航。如果您的表单有滚动条，请确保它响应鼠标上的滚轮。总的来说，.NET控件默认提供标准行为，但您可能必须配置一些设计时属性才能完全实现此目的。我有一个我在几年前工作的控件库，它提供了一个标准的文本框。然而，我发现，当我选中控件时，文本不会自动突出显示。我添加了这种行为，因为它是我（和我的用户）期望控件工作的方式。引用Spolsky，“一致性导致易用性，反过来会导致良好的感觉......”换句话说，如果您的UI机制与用户期望的不匹配，您的UI将成为您的挫折感用户。

就美学而言，我发现专注于字体，图标，控件之间的间距和对齐，有选择地使用颜色（我喜欢使用渐变）等等。可以通过一种长期的方式为您的用户界面添加这种抛光感。我已经知道在Paint中使用位图屏幕捕获来测量控件之间的填充，以便模仿Microsoft应用程序中的填充。当我向同事透露这些信息时，大多数人都会看着我，好像我已经失去了理智。但我不能告诉你我通过专注于其他人认为无关紧要的东西而获得的用户界面成功数量。我只想简单地利用微软在使其应用程序在视觉上具有吸引力所做的所有研究。

所以我的建议是阅读Spolsky的书，然后尝试复制尽可能多的Microsoft应用程序。对于桌面应用程序，这是最可靠的方法。

Answer 7

花些时间查看其他软件产品。每年，谷歌和微软等公司都会投入数百万美元进行可用性测试。了解他们对用户交互的了解，并将其应用到您自己的产品/项目中。

Infragistics也刚刚为UI设计模式创建了一个很好的参考，它可以在http://quince.infragistics.com/找到。

Answer 8

您可以参考Windows UI指南或Mac UI指南。

可以在http://developer.apple.com/documentation/userexperience/Conceptual/AppleHIGuidelines/XHIGIntro/chapter_1_section_1.html

获取Mac UI指南

Windows UI指南可在以下位置找到： http://msdn.microsoft.com/en-us/library/aa511258.aspx

编辑： 每个人都喜欢这里的Google用户界面是link。

Answer 9

我认为最好的想法是练习。我喜欢先在纸上设计我的窗户（空白或方格纸）。使用尺子并确保物体对齐并且干净。

  

从我的工作项目中可以想到一个例子，我必须使用127个按钮代表我们实验室中的127台计算机。 ：/

在这里向自己提问，我不喜欢什么？怎么改进？我需要下载还是计算机的列表框？

也知道你的GUI widgets。

Answer 10

答案已经提供了一些关于如何专门设计界面的好书。我想帮助您提供一些建议来帮助您改进设计的 nose 。其中一些可能是廉价的二手货，或者你可以在当地借钱的东西（我总是愿意把钱借给西澳大利亚珀斯的人们）：

• Bill Buxton的Sketching user Experiences - 购买它，阅读故事并开始练习草图
• Nathaniel Borenstein（已绝版）Programming as if People Mattered - 一本精彩的轶事小书
• Jeff Johnson的GUI Bloopers将帮助您在桌面和Web应用程序设计中提供大量设计错误的实用示例。