GUI 设计的最佳实践和原则 [关闭]

Question

您最实用的用户友好型用户界面设计或原则是什么？

请提交那些您发现确实使事情真正有用的实践 - 无论如何 - 如果它对您的用户有效，请分享！

---

摘要/整理

原则

1. 吻。
2. 明确并具体说明选项将实现的目标：例如，使用动词来指示选择后将执行的操作（请参阅：实现。1）。
3. 使用适合用户需要/想要实现的目标的明显默认操作。
4. 使 UI 的外观和行为适合环境/流程/受众：独立应用程序、网页、便携式、科学分析、Flash 游戏、专业人士/儿童、...
5. 缩短新用户的学习曲线。
6. 不要禁用或隐藏选项，而是考虑提供有用的消息，让用户可以有替代方案，但仅限于存在这些替代方案的地方。如果没有可用的替代方案，最好禁用该选项 - 该选项在视觉上表明该选项不可用 - 不要隐藏不可用的选项，而是在鼠标悬停弹出窗口中解释它被禁用的原因。
7. 保持一致并符合实践和控件的放置，正如广泛使用的成功应用程序中所实施的那样。
8. 引导用户的期望并让您的程序按照这些期望运行。
9. 坚持用户的词汇和知识，不要使用程序员/实现术语。
10. 遵循基本设计原则：对比（明显性）、重复（一致性）、对齐（外观）和邻近性（分组）。

执行

1. （参见paiNie的回答）“尝试在对话框中使用动词。”
2. 允许/实施撤消和重做。

参考

1. Windows Vista 用户体验指南 [http://msdn.microsoft.com/en-us/library/aa511258.aspx]
2. 荷兰网站 - “Drempelvrij”指南 [http://www.drempelvrij.nl/richtlijnen]
3. 网页内容可访问性指南 (WCAG 1.0) [http://www.w3.org/TR/WCAG10/]
4. 一致性[http://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/0385267746]
5. 别让我思考[http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758/ref=pdbbssr_1?ie=UTF8&s=books&qid=1221726383&sr=8-1]
6. 强大而简单[http://msdn.microsoft.com/en-us/library/aa511332.aspx]
7. 格式塔设计法则[http://www.squidoo.com/gestaltlaws]

Answer 1

尝试在对话框中使用动词。

意思是使用

代替

Answer 2

我针对我的祖母测试了我的 GUI。

Answer 3

遵循基本设计原则

• Contrast - 创造与众不同的东西 看 不同的
• 右epetition - 在一个屏幕和其他屏幕上重复相同的样式
• Aligment - 屏幕元素向上排列！是的，这包括文本、图像、控件和标签。
• 磷近似性 - 将相关元素组合在一起。用于输入地址的一组输入字段应组合在一起，并且与用于输入信用卡信息的一组输入字段不同。这是基本的 格式塔设计法则.

Answer 4

绝不 问“你确定吗？”。只需允许无限、可靠的撤消/重做。

Answer 5

尝试考虑用户想要实现什么，而不是需求是什么。

用户将进入您的系统并使用它来实现目标。当您打开 calc 时，90% 的时间您都需要进行简单的快速计算，因此默认将其设置为简单模式。

因此，不要考虑应用程序必须做什么，而是考虑将要执行此操作的用户，可能很无聊，并尝试根据他的意图进行设计，尝试让他的生活更轻松。

Answer 6

如果您正在为网络或任何前端软件应用程序做任何事情，那么您确实应该阅读...

别让我思考——史蒂夫·克鲁格

Answer 7

网络应用程序中的面包屑：
告诉 -> 该 -> 用户 -> 哪里 -> 她 -> 已在系统中

这在具有相同数据的多个路径的“动态”系统中很难做到，但它通常有助于导航系统。

Answer 8

我努力适应环境。

在开发 Windows 应用程序时，我使用 Windows Vista 用户体验指南 但是当我开发网络应用程序时，我使用适当的指南，因为我开发荷兰语网站，所以我使用 “Drempelvrij”指南 这是基于 网页内容无障碍指南 (WCAG 1.0) 由万维网联盟 (W3C) 制定。

我这样做的原因是为了减少新用户的学习曲线。

Answer 9

我建议通过阅读这本书来对 GUI 设计有一个很好的理解 日常事物的设计. 。虽然主要的可打印内容是来自 乔尔·斯波尔斯基: ：当应用程序的行为与用户期望的行为不同时，您的图形用户界面就会出现问题。

最好的例子是，当有人交换 好的 和 取消 某些网站上的按钮。用户期望 好的 按钮位于左侧，并且 取消 按钮位于右侧。简而言之，当应用程序行为与用户期望发生的情况不同时，就会出现用户界面设计问题。

尽管如此，无论您遵循什么设计或设计模式，最好的建议是在整个应用程序中保持设计和约定一致。

Answer 10

尽可能避免要求用户做出选择（即不要创建带有配置对话框的分叉！）

对于每个选项和每个消息框，问问自己：我可以提出一些合理的默认行为吗

• 说得通？
• 不会妨碍用户吗？
• 是否很容易了解到我将其强加给用户对用户来说花费很少？

我可以使用我的 Palm 手持设备作为示例：这些设置确实很简约，我对此非常满意。基本应用程序设计得足够好，我可以简单地使用它们，而不需要进行调整。好吧，有些事情我不能做，事实上我不得不让自己适应这个工具（而不是相反），但最终这确实让我的生活变得更轻松。

这个网站是另一个例子：你无法配置任何东西，但我发现它非常好用。

合理的默认值可能很难弄清楚，简单的可用性测试可以提供很多线索来帮助您解决这个问题。

Answer 11

向用户示例显示界面。要求他们执行一项典型任务。注意他们的错误。听听他们的评论。进行更改并重复。

Answer 12

日常事物的设计——唐纳德·诺曼

设计知识的经典，也是世界各地大学许多人机交互课程的基础。仅凭网络论坛的一些评论，您不可能在五分钟内设计出出色的 GUI，但一些原则将使您的思维指向正确的方向。

--

MC

Answer 13

构造错误消息使错误消息是对这三个问题的答案（按照此顺序）：

1. 发生了什么？

2. 为什么会发生这样的事？

3. 对此我们能做些什么呢？

这来自“人机界面指南：Apple桌面接口”（1987，ISBN 0-201-17753-6），但可以在任何地方用于任何错误消息。有一个 更新后的版本 适用于 Mac OS X。微软页面用户界面消息说同样的话：“……在错误消息的情况下，您应该包括问题，原因和用户行动以纠正问题。”

还包括该程序已知的任何信息，而不仅仅是一些固定的字符串。例如。对于“为什么发生”错误消息的“为什么发生”的一部分。

将此与臭名昭著的错误消息进行对比：“一个错误发生了。”。

Answer 14

（从乔尔那里偷来的：o））

不要禁用/删除选项 - 而是在用户单击/选择它时提供有用的消息。

Answer 15

正如我的数据结构教授今天指出的：向普通用户说明您的程序如何工作。我们程序员常常认为我们的程序非常合乎逻辑，但普通用户可能不知道该怎么做。

Answer 16

1. 使用谨慎/简单的动画功能创建从一个部分到另一个部分的无缝过渡。这有助于用户创建导航/结构的思维导图。

2. 在按钮上使用简短的标题（如果可能的话一个词），清楚地描述操作的本质。

3. 尽可能使用语义缩放（一个很好的例子是缩放在 Google/Bing 地图上的工作原理，当您关注某个区域时可以看到更多信息）。

4. 创建至少两种导航方式：垂直和水平。当您在不同部分之间导航时为垂直方向，当您在部分或子部分的内容内导航时为水平方向。

5. 始终保持结构的主要选项节点可见（在屏幕大小和设备类型允许的情况下）。

6. 当您深入结构时，请始终保留可见的提示（即例如以路径的形式）指示您所在的位置。

7. 当您希望用户专注于数据（例如阅读文章或查看项目）时隐藏元素。- 但是请注意第 5 点和第 4 点。

Answer 17

强大而简单

哦，还有聘请设计师/学习设计技能。:)

Answer 18

对于 GUI，标准是特定于平台的。例如。在 Eclipse 中开发 GUI 时， 关联 提供了适当的指导。

Answer 19

我已经阅读了上面的大部分内容，但我没有看到提到的一件事：

如果用户打算使用一次界面，那么如果可能的话，只显示他们需要使用的内容是很好的。

如果同一用户将重复使用用户界面，但可能不会经常使用，则禁用控件比隐藏它们更好：用户界面的变化和隐藏的功能对于偶尔的用户来说并不明显（或记住），这会让用户感到沮丧。

如果用户界面将由同一用户非常频繁地使用（并且工作中没有太多的流动性，即没有很多新用户一直在线）禁用控件绝对有帮助，用户会习惯事情发生的原因，但可以防止他们在不正确的上下文中意外使用控件，并防止错误。

这只是我的观点，但这一切都取决于了解您的用户配置文件，而不仅仅是单个用户会话可能需要的内容。