Chapter 21 设计细节:控件和对话框

2016-02-05  本文已影响0人  Chessea

此文仅为《About Face 4:交互设计精髓》的读书笔记,有学习需要请支持正版。

控件 Control

Control is also named as widget/gadget/gizmos.

避免布满控件的对话框

设计原则
大多数布满控件的对话框并不是好的用户界面设计

1.命令控件 Imperative Controls

在人机交互中,语言包括名字(or 对象)、动词、形容词和副词。当发起命令时,便指定了动词——动作的声明;当描述动作会影响到什么时,指定组成句子的名词。与动词相对应的控件类型叫做“命令控件”。

按钮 Buttons

命令习惯用法的精华例子是按钮,虽然存在多种不同的外表,但它是唯一一种。单击按钮及其相关的动作,将会立即执行。
在对话框中通常有一个默认按钮,常常被突出显示来指示用户可以选择的最合理操作。
按钮的部分启示是视觉受范性,显示它的“可按压特性”。当用户指向并单击,屏幕上的按钮视觉上会发生改变。

图标按钮(Butcons)当按钮引入到工具栏中,显著地扩展了它的功能、作用和视觉特征,展现出图标的形式。

设计原则
链接用于浏览导航,按钮/图标按钮用于操作

2.选择控件 Selection Controls

用于选择名字的控件。

2.1 复选框 Check Box

应避免使用滚翻按钮(Flip-flop buttons)

单选按钮

组合图标按钮

2.2 列表控件 List Controls

也称列表框 List Box选择列表(picklist)或列表视图(listviews)。

下拉列表 (Drop-Down List)是列表控件的一个变体。默认仅仅显示被选中的条目。

设计原则
用图标来区分重要的文本项
绝不要水平滚动文本

组合框 Combo boxes

是列表框和编辑字段的组合,提供了一个确定的方法在列表控件中输入数据。

树形控件 Tree controls

表达层级关系数据的列表视图。

3.输入控件 Entry Controls

设计原则
对于有界输入要使用有界控件

3.1 有界输入控件 Bounded entry controls

微调控制项 Spinners

刻度盘和滑块 Dials and Sliders

拇指轮 Thumbwheels

3.2 无界输入控件 Unbounded entry

文本编辑控件 Text edit controls:最主要的无界输入控件。

设计原则
仅供输出的文本用非编辑控件(显示控件)显示

4.显示控件 Display Controls

用于显示和管理屏幕上信息的视觉呈现方式。

文本控件 Text controls:最简单的显示控件。

滚动条 Scrollbars:用于窗口内容和文本导航器是合适的。

分割线 Splitters:将独占的应用程序分为多个相关窗格的有用工具,可移动的分割线应该借助光标暗示显示其受范性。

抽屉和拉动杆 Drawers and levers:它们具有类似的行为,一般可以通过旋转来指示打开和关闭两种状态。

对话框


对话框是叠加在应用主窗口上的弹出式窗口,在对话中它给出消息或要求输入。对话框是配角,虽然推动情节发展,但不是故事主线。

设计原则
把主要的交互操作放在主窗口中

合理运用对话框

任何可能会让人困惑的、置人于危险之地的、很少使用的功能,放在对话框里可能都会比较合理,特别适用对应用状态产生立即改变或重大改变的行为。(同时也可相应提供坚实可靠的撤销功能。)

设计原则
对话框适合:主交互流程之外的功能;整理单一主题或应用功能的信息

对话框的基本交互

每个对话框都必须有一个标题来标示它的用途。

设计原则
在功能对话框的标题中使用动词;
在属性对话框的标题中使用对象名

模态和非模态对话框

模态对话框:目前为止最常见的类型,打开一个模态对话框后,它所属的程序不能继续进行,直到对话框关闭为止。目的和使用范围对用户和设计者而言通常很清晰。

非模态对话框:相对使用得较少,打开一个非模态对话框后,可以不用打断父应用程序,无需停止进度。操作范围不确定,更难使用和理解。

设计原则
区别对待模态对话框和非模态对话框:
模态对话框一定要包含终止命令,并放在较大的按钮上
非模态对话框一定不要使用终止命令按钮,而应在窗口标题栏上使用“关闭”控件
不要在模态对话框上使用“关闭”按钮

模态对话框的问题

在某些模块对话框的变体中,终止命令“取消”变成了“应用”或“关闭”,这些动态变化会给用户带来困惑,应避免。模块对话框的认知力量在于严格一致的“Ok”和“Cancel”按钮。

设计原则
不要动态地改变终止命令按钮的标签

非模态对话框的问题

大多数非模态对话框的行为很不一致,令人十分困惑。
非模态对话框经常会有几个按钮,可以立即激活不同的功能,应设置撤销(Undo)功能。单击任何一个功能按钮,对话框都不应该关闭;同时也须特别节约像素。

对话框的五个目的

属性对话框

向用户呈现或让用户改变所选对象的属性或设置。通常是非模态。

功能对话框

通常从菜单中打开,最常见的模态对话框,只控制单一功能,如打印。

进度对话框

由应用程度启动而不是用户。最好的进度显示方式是在对话框中使用动画。

设计原则
应用程序无响应状态,必须通知用户

通知对话框

将一些重要信息报告给用户。这些重要信息或者来自于一些被触发的时间,或来自其他用户的通知信息。在移动设备上大量使用。

公告对话框

由应用程序直接启动,有三种:错误、警告、确认。

设计原则
绝不要用临时型对话框作为错误对话框或确认对话框

管理属性对话框和功能对话框

选项卡对话框

很多应用程序的对象具有丰富的属性,用一个同样丰富的属性对话框,通过多个选项卡的方式来管理。

设计原则
不要堆叠选项卡

扩展对话框

对话框有一个“更多”或“扩展”的功能,在扩展后会显示更多控件。

级联对话框

一种很糟糕的习惯用法。级联对话框中的第一级对话框里,通常有一个按钮控件,点击它可以调出另一个对话框,即二级对话框,有时二级对话框还可以继续调出三级对话框。幸好级联对话框已经失宠。

消除错误、警告和确认


公告对话框被用于提示错误消息、警告消息和确认消息,完全称得上“臭名昭著”。

错误对话框

首先要尽全力在应用程序中合适的时间和地方中找到根源,并将它们清楚掉。

错误对话框的问题

用户犯了错误时,需要的是帮助;应用程序应该告诉用户如何去避免错误,以及犯错误的可能后果。这里的技巧在于通知用户而不要停止整个过程。

设计原则
错误对话框愚蠢地停止进度,应该避免

错误消息不管用

错误对话框的终极讽刺是:无法阻止用户犯错误,无法发挥它的作用。

如何消除错误消息

我们必须重新编程使程序不再容易出问题。不能认为错误消息是正常的,我们必须把它当做最后一招。

让错误不可能发生

这是消除错误信息的最好方法。比如为所有的数据输入使用有界控件。

设计原则
让错误不可能发生

正面反馈

软件应当给用户正面反馈。

设计原则
当软件告诉用户他们失败时,用户会觉得丢脸

最后一招:改进错误消息

绝大部分的错误消息都是必须要删除的,如果真的不可能重新设计应用去消除不必要的错误对话框,则应改进。
错误对话框应始终有礼貌、表达清楚,还要助人为乐;必须要用户说明问题,提供一个解决问题所需要的信息,澄清问题的范围,可选的方法等。

警告和确认

警告的原理在于告知用户,这是令人满意的目标,但不能以打断流程的交互流作为代价。

如何消除警告

设计师必须精确地指出在应用界面上哪个位置用消息工具。

确认:喊“狼来了”的对话框

当应用对自己的行为不自信时,经常用对话框询问用户来征求许可;或应用软件让用户确认,再考虑一下即将做出的行为。
当关闭确认对话框成为例行公事,当真正有危险的时候,确认对话框将不能起作用。

如何消除确认对话框

设计原则
做,不要问
让所有的动作都可以撤销
给用户提供非模态反馈,避免用户犯错

魔鬼在细节里

须始终牢记这句话。

上一篇下一篇

猜你喜欢

热点阅读