GUI设计的最佳做法和原则
我们最实用的用户友好型用户界面设计或者原则是什么?
请提交我们认为实际上可以使事情真正有用的那些做法,无论它对用户是否有用,都可以分享!
摘要/整理
原则
- 吻。
- 要清楚并具体说明一个选项将实现什么:例如,使用动词来表示对一个选择将要采取的行动(请参见:示例1)。
- 使用适合用户需要/想要实现的明显的默认操作。
- 使UI的外观和行为适合于环境/过程/受众:独立应用程序,网页,可移植,科学分析,Flash游戏,专业人员/儿童,...
- 减少新用户的学习曲线。
- 与其禁用或者隐藏选项,不如在用户可以选择的地方(但仅在那些选择存在的地方)给出有用的信息。如果没有可用的替代方法,最好禁用该选项-在视觉上会指出该选项不可用-不要隐藏不可用的选项,而是在鼠标悬停的弹出窗口中说明为什么禁用该选项。
- 保持一致并遵守惯例和控件的放置方式,这在广泛使用的成功应用程序中已实现。
- 引导用户的期望,并让程序按照这些期望行事。
- 坚持用户的词汇和知识,不要使用程序员/实现术语。
- 遵循基本的设计原则:对比度(显而易见性),重复(一致性),对齐(外观)和接近性(分组)。
执行
- (请参阅paiNie的回答)"尝试在对话框中使用动词。"
- 允许/执行撤消和重做。
参考
- Windows Vista用户体验指南[http://msdn.microsoft.com/en-us/library/aa511258.aspx]
- 荷兰网站-" Drempelvrij"准则[http://www.drempelvrij.nl/richtlijnen]
- Web内容可访问性指南(WCAG 1.0)[http://www.w3.org/TR/WCAG10/]
- 一致性[http://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/0385267746]
- 不要让我思考[http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758/ref=pdbbssr_1?ie=UTF8&s=books&qid=1221726383&sr=8-1]
- 强大而简单[http://msdn.microsoft.com/en-us/library/aa511332.aspx]
- 格式塔设计法律[http://www.squidoo.com/gestaltlaws]
解决方案
(从乔尔偷来的:o))
当用户单击/选择选项时,不要禁用/删除选项,而是提供有用的信息。
我尝试适应环境。
在开发Windows应用程序时,我使用Windows Vista用户体验指南,但是在开发Web应用程序时,我使用适当的指南,因为开发荷兰网站时,我使用基于Web Content Accessibility的" Drempelvrij"指南万维网联盟(W3C)的准则(WCAG 1.0)。
我这样做的原因是为了减少新用户的学习曲线。
我建议阅读本书《日常事物的设计》以更好地理解GUI设计。尽管主要的可打印内容是Joel Spolsky的评论:当应用程序的行为不同于用户期望的行为时,图形用户界面就会出现问题。
最好的例子是,当有人在某些网站上单击"确定"和"取消"按钮时。用户期望"确定"按钮在左侧,而"取消"按钮在右侧。简而言之,当应用程序行为与用户期望的情况有所不同时,我们就会遇到用户界面设计问题。
尽管,无论我们采用哪种设计或者设计模式,最好的建议都是在整个应用程序中保持设计和约定的一致性。
正如我的数据结构教授今天指出的那样:向普通用户提供有关程序工作方式的说明。我们程序员经常认为我们对程序很合逻辑,但普通用户可能不知道该怎么做。
尝试在对话框中使用动词。
这意味着使用
代替
如果我们正在为网络或者任何前端软件应用程序做任何事情,那么我们真的应该自己阅读...
不要让我觉得史蒂夫·克鲁格(Steve Krug)
尝试考虑用户想要实现的目标,而不是需求。
用户将进入系统并使用它来实现目标。打开calc时,我们需要90%的时间进行简单的快速计算,因此默认情况下将其设置为简单模式。
因此,不要考虑应用程序必须做什么,而要考虑将要这样做的用户(可能很无聊),并尝试根据自己的意图进行设计,以使自己的生活更轻松。
日常事物的设计唐纳德·诺曼(Donald Norman)
设计知识的典范,是世界各地大学许多人机交互课程的基础。我们不会在五分钟之内用一个Web论坛上的一些评论来设计出一个出色的GUI,但是一些原理将使思考正确地指向正确的方向。
--
MC
Webapps中的面包屑:
告诉->->用户->位置->她->在系统中
在具有指向相同数据的多个路径的"动态"系统中,这很难做到,但是它通常有助于导航系统。
尽可能避免要求用户做出选择(即不要在配置对话框中创建派生!)
对于每个选项和每个消息框,请问自己:我是否可以提出一些合理的默认行为来
- 说得通?
- 不会妨碍用户的使用?
- 很容易得知我将其强加给用户的成本很小吗?
我可以以Palm掌上电脑为例:设置确实非常简单,对此我感到非常满意。基本应用程序设计得足够好,我可以简单地使用它们而无需进行调整。好的,有些事情我做不到,实际上我不得不使自己适应该工具(而不是相反),但是最终这确实使我的生活更轻松。
该网站是另一个示例:我们无法进行任何配置,但我发现它确实非常好用。
合理的默认值可能很难弄清楚,简单的可用性测试可以提供很多线索来。
向用户示例显示界面。要求他们执行典型任务。注意他们的错误。听他们的评论。进行更改并重复。
强大而简单
哦,聘请设计师/学习设计技巧。 :)
永远不要问"我们确定吗?"。只允许无限,可靠的撤消/重做。
遵循基本设计原则
- 对比-使不同的事物看起来不同
- 重复-在一个屏幕和其他屏幕中重复相同的样式
- 对齐-将屏幕元素向上对齐!是的,其中包括文本,图像,控件和标签。
- 邻近度-将相关元素组合在一起。一组用于输入地址的输入字段应组合在一起,并且与用于输入信用卡信息的一组输入字段不同。这是基本格式塔设计法则。
构造错误消息时,使错误消息为
这3个问题的答案(按顺序):
- 发生了什么?
- 为什么会发生呢?
- 该怎么办?
摘自《人机界面指南:Apple桌面
接口"(1987,ISBN 0-201-17753-6),但可以使用
任何地方的任何错误消息。
Mac OS X有更新的版本。
Microsoft页面
用户界面消息
说同样的话:" ...如果出现错误消息,
我们应该包括问题,原因和用户操作
纠正问题。"
还包括程序已知的任何信息,
不只是一些固定的字符串。例如。对于错误消息的"为什么发生"部分,请使用"原始频谱文件
L:\ refDataForMascotParser \ TripleEncoding \ Q1LCMS190203_01Doub
leArg.wiff不存在",而不仅仅是"文件存在
不存在"。
将其与臭名昭著的错误消息进行对比:"一个错误
发生。"。
我针对奶奶测试了GUI。