易于浏览的开发人员UI技巧

Question

每个开发人员应该知道哪些关键的UI设计技巧？

虽然开发人员有许多UI资源（例如，Joel Spolsky的User Interface Design for Programmers），但我对更多的子弹列表感兴趣，可以在1到2页内进行通信。

我对更具战术性的日常用户界面提示感兴趣，而不是在UI设计会议中涵盖的总体用户界面设计目标（可能至少由一个人参加）具有良好的UI感觉）。这些提示的集合可能涵盖了日常程序员遇到的大约80％的案例。

Answer 1

• 使用标准菜单栏（业余GUI设计师似乎想出于某种原因在这里绘制自己的路线）。确保第一项是文件，编辑和查看，最后一项是帮助
• 不要担心颜色主题或皮肤;坚持与您的平台一致的标准外观
• 使用默认系统字体
• 使用与您的平台一致的菜单加速器
• 坚持尝试和真实的布局，顶部是菜单栏，底部是状态栏，如果需要，左侧是导航窗格
• 从不进行全系统抓取
• 如果您有选择，请将所有窗口调整大小。
• 使用radiobuttons组来“选择一个”。始终确保默认选中其中一个。如果您希望用户不能选择任何内容，请为“无选择”添加另一个单选按钮
• 使用“按选择零或更多”的检查按钮组
• 必要时约束输入（即：简单地忽略数字输入字段中的非数字）而不是等待用户输入数据，提交，然后抛出一个对话框，说“嘿，不允许写信！”。如果不允许，请不要在第一时间接受它们。
• 在你接受的投入中要自由。为了善良，如果他们遗漏了连字符，请不要为SSN字段投放，或者在不想要它们时放入。计算机是智能的，让它弄清楚xxxxxxxxx和xxx xx xxxx和xxx-xx-xxxx都是有效的社会安全号码。
• 始终允许长字段中的空格，例如序列号等等。如果允许用户将数字分组为三个或四个，则数据质量会提高。如果您的数据模型无法处理空间，则可以在保存数据之前将其删除。
• 避免像瘟疫这样的弹出式对话框。除非你绝对必须，否则不要展示。如果您决定必须，请在继续之前停止并重新考虑您的设计。有时候它们是必要的，但那些时间比你想象的要少得多。
• 注意键盘遍历。大多数工具包都试图让它正确，但总是仔细检查。用户应该能够使用tab键以逻辑方式遍历小部件。

当然，所有这些规则都可以被打破。但只有在你出于合理的理由打破它时才能打破它。

请记住，该软件可以帮助用户，它应该是他们想要的，而不是让他们做 想要的。

Answer 2

当您即将执行将更改或删除信息的操作时，请不要问'您确定' - 用户将学习如何在操作中单击该按钮。尝试在系统设计中允许“撤消”。

Answer 3

将默认选项设为用户最满意的选项。

Answer 4

始终为用户提供“出路”，不需要使用后退按钮。

最好的例子：

如果发生错误，请将它们链接回原来的位置（或者至少可以重新开始）。

Answer 5

尽可能使用工具提示。令人惊讶的是，这些小家伙可以为最终用户添加大量帮助，而且他们对应用程序本身并不显眼。

Answer 6

设计用户界面时尽量简单，但不能简单。

Answer 7

1. 询问用户，不要只是搞清楚
2. 简化 - 删除步骤，消除点击等
3. 熟悉usability
的原则

Answer 8

必须使用正确的制表符。

Answer 9

我认为这个链接将是一个很好的起点，来自微软的“Windows Vista用户体验指南” http://msdn.microsoft.com/en-us/library/aa511328.aspx

这可能非常接近您正在寻找的两页子弹点列表：“Top Violations”：
http://msdn.microsoft.com/en-us/library/aa511331.aspx

非常实用的提示如下：“设置最小窗口大小，如果大小低于该大小，内容将不再可用。”

Answer 10

不要以基本清晰度和可用性为代价来增加“可发现性”。

Answer 11

找到用户最常做的事情，然后将其作为最简单的事情。

例如：我对微波设计抱有长期的个人抱怨。

许多人要求你设置一个在使用微波炉之前从未用过任何东西的时钟，并且忘记每次失去电源和需要在那些难以使用的按钮板上按10次按键这样做。

简单的可用性测试将实现微波炉上最常用的烹饪时间是标准的“分钟”和倍数。因此，理想的微波应该能够以3次或更少的动作在高功率下烹饪产品1分钟。

对于一分钟以外的时间，但是在黄金“1”分钟的5分钟内，应该稍微多一些步骤，但不是很明显，并且烹饪时间仅需要大量的动作＆gt; 5分钟。 （这是相当罕见的）

---

2个伟大的微波设计的例子

1。 4部分。门，温度拨盘，定时拨号，时间顺序

温度刻度盘是模拟的，并且在之前的设置中保持不变，具有不同的滑动范围。

时间刻度盘是数字的，但模拟模拟，顺时针转动拨盘会增加时钟时间（通过表盘下方的照明顺序显示）。逆时针转动拨盘可减少时钟时间。烹饪减少了时间。

门被关闭，时间正在开始烹饪。门打开暂停烹饪。

标准操作：打开门，加载，转动时间拨盘，关闭门（或者可选地，首先关闭门，并且只要> 1s在时钟上就开始烹饪）

2。 6部件，门，拨号，电源按钮，开始按钮，清除按钮，数字时间显示

没有选择时间的开始按钮在高功率下开始烹饪1分钟。

烹饪时启动按钮增加1分钟。

时间段在会话之间保持不变。转动拨盘会使存储在转盘位置的时间被复制到数字定时器。

开始烹饪前按“电源”

1. 如果表盘未转动，请将存储在dails位置的当前时间复制到数字计时器。
2. 如果拨号已经转动，则将功率级别的选择减1，或者如果在最低功率级别，则返回到最高。

烹饪时按下电源会动态降低功率。

标准操作： 1分钟高=按开始。

1分钟中高=按开始，按下电源。

2分钟高=按开始两次。

＆LT;随时＆GT;在高=转动拨号直到开心，按开始。

＆LT;随时＆GT; on＆lt; anypower＆gt;转动拨号直到开心，按下电源直到开心，按开始。

＆lt;先前选择的时间＆gt; on high =按电源，按开始

＆lt;先前选择的时间+ 1分钟＆gt;在高=按电源时，按两次启动。

正如您在此处所看到的，添加少量额外按钮，可以添加很大程度的表现力和功能设计。

任何带有数字键盘的时间规格设计往往都不符合我的良好设计标准。

它指出，这些设计可能会对某些人有更高的学习曲线，但一旦学会了，肌肉记忆就会让它本能。与更多（显而易见的？）但过于复杂的设计相反，即使是学习用户也会不断花费大量时间执行繁琐的任意操作，只需达到共同的目标。

Answer 12

执行一些hallway usability testing（与您进行代码审核的方式相同）。

即便是一个非常快速的“嘿！试试这个”可用性测试（如果你可以称之为那个）与你旁边的人会产生很大的不同。最重要的是让别人尝试你刚刚构建的UI。

令人惊讶的是，其他人多次使用您的新用户界面卡住了，只需几分钟（通常）就可以找到最大的问题。

Answer 13

如果您使用编辑器中的弹出窗口，请确保将插入点或状态返回到弹出窗口之前的状态。太多的程序只会让你“挂”并不得不找回自己的路。

Answer 14

而不是任意的“确定”和“取消”按钮，在给定的上下文中，它们可能不明确，而用户盲目地点击一个按钮，按钮应该包含他们所做事情的简要描述。

[Ok, Please Cancel my subscription ], [ Please do not cancel my subscription ] 

远胜于

Cancel my subscription?
[ OK  ] [ Cancel ] 

（这些失败经常出现在dailywtf上）

Answer 15

1. 尽量减少点击次数
2. 统一外观（文字大小，按钮......和其他控件）
3. 尽量减少免费编辑...（例如：在地址条目中......在下拉菜单中提供状态等等）
4. 在国家/地区列表的下拉列表中......首先列出居住的国家/地区（有多少人因为美国被列在最底层而感到沮丧，你必须向下滚动？）
5. 可以按用户选择
订购常规下拉菜单
6. No Spelling msitake;）at all
7. 注意标签文字：电子邮件地址（标题为电子邮件......相信我......我已将其视为电子邮件地址：）
8. 金额的货币符号。数量均匀数字显示.. ex： $ 12.15 ==＆gt; $ 12.15 $ 10.9 ==＆gt; $ 10.90 9.进度/状态栏
9. 在用户点击确定/保存按钮之前指示错误字段的好友标签（例如：如果没有“@”，则无需等待，直到用户点击确定然后告诉他们无效的电子邮件地址）< / LI>
10. 避免重复输入...（例如：在登录屏幕中记住我的选项）
11. 全局应用程序选项，让用户从上一个实例中的“停止”位置继续）
12. 在网格上显示数据时... excel样式过滤器选项
13. 输入的默认值。

人们......随意刷新以上任何一点，并提供有效理由!!!

Answer 16

Grandmaw Testing。

这是我对概念性问题的术语，“你的奶奶，除了电子邮件和检查www.cutecats.com之外从未使用过计算机，是否可以使用它？”（假设她拥有使用该特定应用程序的真实知识） ）”。

一切都应该是显而易见的;什么都不应该是带有副作用的黑匣子魔法。应该以用户以前使用的通用格式访问不常见的内容。

清除标签，清除帮助文件的路线，清除具有明显效果的操作。

如果奶奶无法使用您的Paint程序，您需要真正考虑您的UI。

Answer 17

我的UI设计基本规则是让每个“页面”只执行一项任务和一项任务。它使页面简单，保持设计清洁，使应用程序更容易理解。

这种类型的设计称为电感用户界面。这是微软在2001年就该主题提出的document。文字可能有点过时，但原则通常都很好。唯一需要注意的是，在这样的设计中可以找到平衡点。如果过度简化过多的用户将不得不在所有地方进行导航以完成简单的任务，并且可理解性的提高将因生产力不足而丢失。

Answer 18

每日user interface web design和应用程序设计的一些简单提示：

• 使用简单的静态草图开始初步的Web应用程序开发计划。 - 不允许用户选择太多。相反，使用cater设计将用户送到他们将从中受益的路径。 - 定义关键用户组及其制作的旅程 - 实践迭代设计作为UI的一部分，以确保投资回报率

Answer 19

我喜欢遵循这些指导原则：

1. 标准 - 遵循已知的标准/模式，重用您尊重的所有产品的想法
2. 简单 - 保持您的解决方案简单易变（如果需要）
3. 优雅 - 少用就能完成更多工作