界面耻辱纪念堂--可视元素03

更多的迹象表明,关于在程序里使用新的动态界面元素,微软的态度是不确定的,其中一个是仅仅需要对比一下Office97 里的"Coolbars"和"标准工具条"。Coolbar 按钮直到用户指针通过的时候才成为按钮(否则是平的)。

工具条按钮,像在Office97 工具条里的一样,不需要用户交互;他们可以直接认出按钮控件。是我们发现了微软的争论,还是微软不小心的设计?

很不幸,WebZip 借鉴了 许多类似EMERAC 的Office97 特性,包括在对话框中不适当地使用动态工具条按钮(按钮直到指针通过时才成为按钮),而不是使用标准工具条按钮。

下面的插图证明使用动态按钮的基本问题:用户无法凭扫一眼来断定界面元素真的是一个控件,相反,如果用户没有在附带的图像上移动,就不能断定它是否一个控件。在插图中,上面的两个图像是 WebZip 的附带图像:

它们没有提供功能。当然,这个程序使用动态按钮,新用户一旦学到图像会在指针通过时变为按钮,会理所当然地认为附带图像也有这个特性。

插图中下面的图像暗示使用动态控件另外的问题:静态图像实际上也可能是控件,但是,由于它们在指针通过时没有动态行为,会被认为不是控件。那个"Scroll Down"(向下滚动)按钮不"浮动",指针也不变成手形(在WebZip 的其他地方是这样),并且那个"Download Now"按钮,用一个环行三角表示,在响应指针移动时并不变化)。

另外,使用动态按钮的问题还有,不使用鼠标进行输入时存在很严重的限制。有意义的键盘访问键不能分配给这种控件,而且它们不支持声音输入。再有,我们发现在有意义的标题按钮(例如,上面图像的"New"、"Open"按钮,和下面图像的"Download Now"按钮)的场所使用含义模糊的图像是很差的设计。我们对 WebZip 的建议是:

开始注意GUI 中的U(用户)

WebZip 使用了一个很像这个独特网站的导航栏。当然我们可以看到一个复杂的网站需

要这样一个导航栏,但是在一个相对简单的桌面应用程序里使用有些驴唇不对马嘴(在我们

看来,他们仅仅是努力模仿一个站点的外观 ,实际上是另一回事.)。

我们把这个例子列举在这里,因为它说明了两个视觉问题:第一个问题是,这个导航栏

可以滚动,但设计者隐藏了这个事实。设计者选择自己设计的而不是标准的滚动条,熟悉这

种滚动条的用户很少。

设计自己的控件时,有一个你要遵循的好准则:

使用操作系统提供的控件。用户已经对它们非常熟悉,真正懂得它们的用途和操作方法。

当我们最后意识到这个导航栏是可以滚动的,我们选这个例子的第二个原因就变得很清

晰了:WebZip 为新用户提供了一个"Quick Start"选择,这个选择使用了一个向导风格的

界面来清晰地说明如何使用这个程序。不幸的是,这个选择是导航栏的最后一项,直到用户

知道如何使用这个定制的滚动控件才为用户所见。

这儿是另外一个规则:

让面向新用户的特性可见和可访问

不要将程序的可用特性隐藏起来。

相关推荐
Underwood_176 天前
Gsap新手入门(一)
交互设计
独泪了无痕9 天前
使用Fetch API 探索前后端数据交互
前端·http·交互设计
anOnion14 天前
构建无障碍组件之Switch Pattern
前端·html·交互设计
刮涂层_赢大奖16 天前
不会 Figma 也能出设计稿:我开源了一个让 AI 直接在 Figma 里画 UI 的工具
claude·交互设计·cursor
anOnion22 天前
构建无障碍组件之Radio group pattern
前端·html·交互设计
anOnion1 个月前
构建无障碍组件之Checkbox pattern
前端·html·交互设计
anOnion1 个月前
构建无障碍组件之Accordion Pattern
html·设计·交互设计
anOnion1 个月前
构建无障碍组件之Disclosure Pattern
前端·html·交互设计
anOnion1 个月前
构建无障碍组件之Dialog Pattern
前端·html·交互设计
anOnion1 个月前
构建无障碍组件之Alert Dialog Pattern
前端·html·交互设计