Pixelcentric著(zhù)
翻譯:雷立輝(http://www.coeffort.com)
原文出自: http://pixelcentric.net/x-shame/index.html
Goooder推薦:如何在界面方面貼近操作系統的風(fēng)格,在這篇文章里面有了一個(gè)理由充分的討論。
盡管這個(gè)程序是Mac操作系統的重要程序之一,它仍然不是一個(gè)順從的孩子,因為它沒(méi)有遵守蘋(píng)果操作系統人機交互設計指導原則(Mac OS Human Interface Guidelines)。所以,它仍然以界面設計缺乏一些必要的修琢而讓人大跌眼鏡。

程序界面中幾乎所有的地方的字兒都是那么的小,即使有足夠的空間讓它們以大字號擺放。操作系統對于菜單字體的推薦大小為12個(gè)象素,但這個(gè)菜單仍然我行我素:兩行小字兒外加一條分割線(xiàn)。同時(shí)我們也要注意到它使用帶斜腳的按鈕作為下拉列表框的標題。這樣的錯誤在這個(gè)程序中不至一處。當然我們都清楚,Mac OS X(及其所有Mac操作系統版本)都提供了標準的下拉列表框,而且標題欄還提供比如像正序排列,倒序排列,調整各列的相對位置等等豐富功能。(也就是說(shuō)這個(gè)程序弄巧成拙,不用系統提供的標準控件而使用了性能很差的自定義控件。譯者注)

和程序界面其它地方一樣,在可用服務(wù)器窗口的字體也是異乎尋常的小。文本域的文字應該是右對齊而它卻左對齊;圖標的使用毫無(wú)意義所以應該刪掉從而給其旁邊的標簽文字讓出更大的空間;在下拉列表框下面的"新建"和"刪除"按鈕應該變成全尺寸的按鈕。這兩個(gè)按鈕太小了所以用戶(hù)可能不能容易的發(fā)現它們,而且即使發(fā)現了它們,用戶(hù)也不能很清楚的知道它們的用途。此外,在下拉列表框標題欄仍然使用了可惡的帶斜角按鈕。
下面是一個(gè)在GoLive和其它Adobe程序中使用的Adobe風(fēng)格的屬性頁(yè)。為什么在整個(gè)窗口中只有一個(gè)屬性頁(yè)而它還要以屬性頁(yè)顯示?直接將這個(gè)屬性頁(yè)的標題變成子窗口的標題不就行了嗎?如果再有新的屬性頁(yè)添加進(jìn)來(lái)后再變成屬性頁(yè)也不遲啊。同樣也要注意到他們空間利用率太低。文字太小而且盡管這是最小化狀態(tài)而窗口還是有許多無(wú)用空白。

當然這個(gè)程序不是一無(wú)是處。比如說(shuō),它提供了一個(gè)非常方便的創(chuàng )建鏈接的連接工具(就是窗口最上面文本框的左邊的小按鈕)。只要按住這個(gè)按鈕然后將光標移至想要的地方松開(kāi)就會(huì )生成一個(gè)地址行。然后你就可以將這行文字拖放至站點(diǎn)管理器或者別的文件窗口就會(huì )生成一個(gè)URL地址,而避免了使用鍵盤(pán)輸入冗長(cháng)的地址。更精彩的是,將這個(gè)地址拖拽時(shí),光標后面的窗口將會(huì )逐個(gè)交替的彈到最上面,所以就是被別的窗口所覆蓋的窗口也有機會(huì )顯示在最上面,這就避免了創(chuàng )建鏈接時(shí)先要手工重新安排窗口。
注意:根據Molla開(kāi)發(fā)總部的計劃,他們將在1.5版時(shí)使用Molla Firebird模塊來(lái)代替現在的瀏覽器模塊,所以這段評述的有效期不會(huì )太長(cháng)。
Molla瀏覽器的排版引擎(Gecko)是最有兼容性的引擎。但糟糕的是與所有正式出版的瀏覽器相比,它的用戶(hù)界面友好性卻是最差的。Molla的用戶(hù)體驗是如此之差,使得那些討厭使用這個(gè)瀏覽器的用戶(hù)尖酸的說(shuō)這個(gè)瀏覽器不是為普通用戶(hù)設計的而是為那些網(wǎng)絡(luò )好手特制(fringe browser)的一款瀏覽器。這當然是我們不能接受的事實(shí),因為這個(gè)瀏覽器的目標便是為網(wǎng)絡(luò )界設計一款標準而兼容的瀏覽器,而特制瀏覽器的設計目的與此背道而馳。實(shí)際上,一些后來(lái)的Molla批評者開(kāi)始聲稱(chēng)Molla既不是給最終用戶(hù)設計的,也不是為網(wǎng)絡(luò )好手設計的 ,而只是夾雜在其它應用程序中間的一個(gè)能工作的普通應用程序。這當然是不足為信的,因為Molla引擎是幾個(gè)面向終端用戶(hù)的瀏覽器的核心支撐部分,最有名的應該是Netscape導航者瀏覽器了。這些聲稱(chēng)Molla瀏覽器不是為終端用戶(hù)設計的人顯然是將Molla和排版引擎NGLayout(Gecko)概念混淆了。實(shí)際上在別的瀏覽器產(chǎn)品上使用Molla引擎還是相對輕松的。
Molla瀏覽器界面提供了兩套風(fēng)格的主題:一套是多平臺統一風(fēng)格的現代界面,一套是盡力模仿所安裝操作系統界面風(fēng)格的傳統界面。大多數情況下,傳統界面工作的較好而現代界面卻完全失敗了。但是傳統界面也是不盡完美。下面所說(shuō)的便是這兩套風(fēng)格界面的缺陷。請注意下面的界面截圖是筆者在Mac OS X上故意使用用戶(hù)自定義主題而Malla使用傳統主題界面。這樣會(huì )讓我更加簡(jiǎn)單的指出Molla并沒(méi)有使用Mac OS X界面顯示管理器所設置的顏色設定,而它只是簡(jiǎn)單的假設了用戶(hù)使用Aqua風(fēng)格(當然蘋(píng)果自己的軟件iTunes在這方面也是犯了同樣的錯誤)。

當Molla在傳統風(fēng)格模式運行時(shí),你最先看到的便是這個(gè)Netscape 4式樣的工具條。這和下圖的現代風(fēng)格界面的工具條一樣,表面看是一個(gè)可以定制但實(shí)質(zhì)上是不可定制的。雖然它的地址輸入欄額外支持Quartz antialiasing,但它并不是標準的Mac OS X控件。糟糕的是,它和Mac OS X文本輸入框行為稍微有點(diǎn)不一樣。Molla其它地方的界面文本輸入框如在網(wǎng)頁(yè)中顯示的文本輸入框,也和Mac OS X中的文本輸入框行為有點(diǎn)不一樣。(也就是說(shuō),你在程序中使用的標準界面元素行為最好和做在操作系統的界面元素行為完全一樣。譯者注)。
界面中的圖標和Netscape 4中的圖標是一樣的,這讓人覺(jué)得這個(gè)程序并一個(gè)不是標準的Mac OS X程序而僅僅是可以運行在Mac OS X上而已。不過(guò),在窗口標題欄右邊的工具條開(kāi)關(guān)按鈕設計樣式則是一個(gè)邁向Mac風(fēng)格的進(jìn)步。

當使用現代風(fēng)格界面時(shí),用戶(hù)會(huì )覺(jué)得它們的確面對的是一個(gè)和Mac控件風(fēng)格完全不一樣的界面。
奇怪的是,"Home"按鈕從瀏覽工具條上消失而出現在書(shū)簽工具條上。甚至更為奇怪的是工具條的位置不再是可以調整的了。用戶(hù)可以隱藏工具條上的按鈕(例如"Home"按鈕),但工具條不可移動(dòng)而且按鈕位置不可交換。這根本不像程序Mail,Finder或者Chimera那樣其工具條是可以完全定制的,更別說(shuō)它是一個(gè)標準的Mac風(fēng)格工具條。
現代風(fēng)格界面中的按鈕也和程序"sihouette"的按鈕一樣,這可以認為是這些愚蠢設計的副產(chǎn)品(by-design stupidity)。工具條圖標的設計原則應該是圖標之間盡量要以形狀及顏色相區分。而這幾個(gè)圖標則都沒(méi)有做到,它們都不起眼,且都是平面的和圓形的。

Molla的菜單結構也是一塌糊涂,盡管現在比以前進(jìn)步了一些。非常常用的命令如"新建一個(gè)窗口","新建一頁(yè)(New Tab)"被放到了子菜單里面,這和通常程序中將新建命令菜單放到文件主菜單的前幾項完全不一樣。同時(shí),像"發(fā)送頁(yè)面"這樣的不常用命令卻在一級菜單中堂而皇之占據了一個(gè)位置。其它主菜單項的情況大致相似。對于一些初級網(wǎng)絡(luò )用戶(hù)根本不會(huì )用的菜單項卻放置在一級菜單里面。

對于與之具有競爭關(guān)系的產(chǎn)品像Internet Explorer都把"郵件"這樣的按鈕放到主工具條上以使它更加容易發(fā)現和操作,Molla卻將它放到了左下角與狀態(tài)欄相鄰的地方。這樣會(huì )讓用戶(hù)覺(jué)得這個(gè)"郵件"圖標和其它子程序圖標都是像狀態(tài)欄指示一樣,點(diǎn)擊"郵件"按鈕不能啟動(dòng)發(fā)送郵件窗口。幸虧這些按鈕具有工具條提示,但是如果用戶(hù)鼠標不移動(dòng)圖標上面是不會(huì )顯示這些提示的。而糟糕的是這些圖標本身就很不起眼。

這個(gè)參數配置窗口的設計可以說(shuō)是糟糕透頂了。這些選項分成幾個(gè)大組,每個(gè)大組里面又有幾個(gè)小組,而且如果把它們都展開(kāi),它們的高度將超過(guò)列表高度的兩倍。就像其它的Molla窗口組件一樣,這個(gè)窗口使用自定義控件。這些控件操作方式和Mac OS X的標準控件大體差不多,樣子也符合自定義風(fēng)格。不幸的是,這個(gè)彈出菜單操作方式卻和操作系統的標準菜單操作方式有所不同。
如果用戶(hù)使用傳統風(fēng)格主題(如上圖),彈出式菜單風(fēng)格類(lèi)似于Windows的彈出式菜單。但它的可滾動(dòng)列表讓我們想起列表框,而不是那種當用戶(hù)將鼠標向上移動(dòng)或向下移動(dòng)時(shí)菜單項會(huì )自動(dòng)滾動(dòng)的菜單。

如果用戶(hù)用的是更加新異的現代風(fēng)格界面(如上圖),這個(gè)彈出式菜單則更像Mac OS中的標準菜單風(fēng)格,但工作方式仍與之相比有細微差別。為了將這個(gè)列表向上(下)移動(dòng),用戶(hù)必須將光標移動(dòng)到這個(gè)"箭頭"項上(就是上圖中的高亮的部分)。只能這樣移動(dòng)菜單項。而Mac OS X的標準菜單只需要將鼠標箭頭移動(dòng)到菜單接近頂部或底部菜單項就能滾動(dòng)菜單項,而且它的滾動(dòng)速度與光標箭頭和菜單上下中線(xiàn)距離成正相關(guān)。Molla的這個(gè)菜單卻缺乏這樣的特性。

最后,傳統風(fēng)格界面中的上下文關(guān)聯(lián)菜單就像是一股復古之風(fēng)(a blast from the past):這個(gè)菜單樣式選用了Mac系統7的菜單的白色背景而使用了Mac 8中的藍色高亮風(fēng)格,即使用戶(hù)將操作系統主題顏色風(fēng)格設置為青灰色也是如此。這些菜單不會(huì )沿用Mac OS X用戶(hù)設定的顏色風(fēng)格,以致于造成了這些菜單不倫不類(lèi),十分顯眼,即使用戶(hù)不使用自定義顏色設定也是如此。這是相當奇怪的,因為Molla的大多數控件在使用傳統風(fēng)格界面時(shí)都是因顯示管理器(Appearance Manager)的設定而變化的。當然,對于這個(gè)毛病的快速解決方法就是給這個(gè)菜單加上灰色的外邊框。這樣至少會(huì )在Mac OS X的缺省藍色主題下顯得稍微溶入一些。從長(cháng)遠來(lái)看菜單應該采用與Mac OS菜單一樣的行為和顯示方式?;蛟SMolla的Mac版本應該像Camino(一個(gè)Mac OS X的瀏覽器)一樣在Molla 的NGLayout引擎中實(shí)現一組Aqua風(fēng)格的上下文菜單控件。
MAC OS X版的MSN Messager也是微軟適時(shí)消息交流的客戶(hù)端(當然它是一個(gè)巨大的MSN和Passport服務(wù)系統結構的一部分)。盡管它與Windows XP版的MSN Messenger程序是獨立的程序,但它的功能是非常相像的。這利弊參半。

Mac版的MSN Messenger美學(xué)觀(guān)點(diǎn)顯然被Windows XP版所影響,但幸運的是它還有一些Mac OS X風(fēng)格。比如說(shuō),工具條上的圖標看起來(lái)有點(diǎn)像Aqua那種透明塑料的感覺(jué)而不是XP的那種硬塑料的感覺(jué)。這一點(diǎn)符合這個(gè)程序的所有控件。
"發(fā)送"按鈕是一個(gè)巨大怪異的東西,它的高度竟然和文本輸入框是一樣的,甚至更大一些?;剀?chē)和點(diǎn)擊按鈕都會(huì )發(fā)送輸入的消息,所以讓人覺(jué)得微軟可能想用這種形式來(lái)強調這個(gè)按鈕。想到蘋(píng)果即將發(fā)布的iChat,這個(gè)軟件就根本沒(méi)有"發(fā)送"按鈕,回車(chē)也和MSN Messenger一樣是可以發(fā)送輸入的消息的。這就足夠好了,不過(guò)如果添加一個(gè)小的"發(fā)送"按鈕可能會(huì )更好一些,因為這樣會(huì )消除一些用戶(hù)找不到"發(fā)送"按鈕的可能性。
MSN Messenger另外一個(gè)不足之處是對于笑臉圖標的管理。點(diǎn)擊這個(gè)笑臉按鈕會(huì )彈出一個(gè)含有一組按鈕的菜單。這錯誤不僅在于它錯誤的使用了按鈕(bevelbuttons)(因為它們的行為像一個(gè)menu woud),而且,這樣會(huì )使得無(wú)處安置對于笑臉圖標的解釋文字。而iChat則有更好的解決方案。文字解釋賦予這些笑臉圖標一個(gè)更明確的含義,在發(fā)送端和接受端都不會(huì )引起誤解。當然,這假設通訊雙方都看過(guò)對笑臉菜單的解釋。
在這個(gè)笑臉圖標菜單的右下角的"。。。"項也會(huì )迷惑用戶(hù),因為用戶(hù)會(huì )認為它本身就是一個(gè)圖標,其中的圖案就是那三個(gè)點(diǎn);然而,點(diǎn)擊這個(gè)按鈕會(huì )打開(kāi)一個(gè)對所有圖標的瀏覽窗口,包括所有沒(méi)有出現在這個(gè)菜單中的圖標。為什么微軟要做一個(gè)這樣的圖標瀏覽窗口呢?或許,微軟就像iChat一樣,加一個(gè)文字菜單而上面的"。。。"換成"More。。。"會(huì )更加適宜一些。
最后值得一說(shuō)的是,MSN Messenger雖然只含有四個(gè)項目,但卻比iChat的含有四項的工具條占據的面積大9倍。盡管MSN Messenger工具條的圖標也具有形象的含義,但它們仍然有解釋標簽。但它的圖標是32x32象素大小,比起iChat的16x20象素的按鈕費空間多了。
QuickTime Player 5和6比起版本4要更加有條理和布局得當一些,但它的視頻和音頻播放控件操作性仍然不盡人意。

為了使用音頻控制功能,用戶(hù)必須點(diǎn)擊一個(gè)看起來(lái)更像是圖片的按鈕的非標準控件。這個(gè)問(wèn)題控件就是在右面黃色工具欄上的音量顯示控件。當這個(gè)控件被點(diǎn)擊的時(shí)候圍繞在其周?chē)倪吙虿艜?huì )出現。而正常情況下這個(gè)黑色邊框是不可見(jiàn)的,也就是說(shuō),這個(gè)功能不是很明顯。
而視頻控件就根本不能通過(guò)點(diǎn)擊窗口中的一個(gè)控件來(lái)打開(kāi)。命令K或者點(diǎn)擊菜單"顯示視頻控件。。。"才能顯示出一個(gè)半透明條目,上面包含了一個(gè)控件。為了改變不同視頻設定,用戶(hù)只能通過(guò)點(diǎn)擊一個(gè)非常小的灰色箭頭來(lái)控制,而這個(gè)小東西非常不起眼(就在現在控制選項名稱(chēng)的右面)。每一次只能顯示一個(gè)選項,這有個(gè)好處便是能讓你很容易的看到你現在播放的視頻。但仍然有一點(diǎn)需要提出,這個(gè)控件首先不應該放置在那兒,而應該是一個(gè)浮動(dòng)的窗口;而且這個(gè)窗口有幾個(gè)分割的部分,把這些視頻控件(對比度,飽和度及亮度等)都放置在同一個(gè)窗口里,可以讓用戶(hù)一下子都能訪(fǎng)問(wèn)。
QuickTime界面使用了金屬質(zhì)地,這種風(fēng)格本來(lái)是Mac OS X專(zhuān)門(mén)預留給這些諸如媒體播放,音頻輸入等這些數字設備管理程序使用的。QuickTime播放器并沒(méi)有使用系統API來(lái)生成這種金屬紋路界面,而使用了程序自身所帶的位圖圖片。這就是說(shuō)如果像Mac OS X 10.2.3版本中設置系統界面為金屬風(fēng)格時(shí),QuickTime播放器將和其它所有的金屬界面程序表現形式及行為有一些差異。這也就意味著(zhù)如果用戶(hù)改變了系統顯示主題風(fēng)格而使用了其它非金屬界面風(fēng)格,QuickTime將不會(huì )適應于新的設定。
即使用戶(hù)選擇了隱藏文件擴展名,QuickTime播放器窗口標題也同樣會(huì )顯示文件擴展名(如截圖所示)。
讓人覺(jué)得不可思議的是(aggravatingly)QuickTime6.3依然不支持保存包括擴展名在內超過(guò)31個(gè)字符的長(cháng)文件名的文件。
這個(gè)截圖是使用芬蘭區域環(huán)境。有趣的是,音頻控件并沒(méi)有本地化。而其它如平衡,低音和高音控件文字還不是芬蘭語(yǔ)。
盡管RealOne Player具有非常簡(jiǎn)單的操作界面,但它卻不盡人意的與Mac OS X的好多界面風(fēng)格傳統相抵觸。

RealOne主窗口如此的不標準以致于讓用戶(hù)覺(jué)得無(wú)處下手。窗口的四角比標準的Aqua窗口更加圓。有趣的是其它的三個(gè)角都是圓角但右下角卻相對尖一些(盡管Aqua也有點(diǎn)太圓了)。和QuickTime一樣的毛病,它缺乏明顯的窗口標題欄讓有些用戶(hù)感到有點(diǎn)迷惑。加之RealOne窗口標題欄沒(méi)有顯示標題文本而只顯示了程序logo文本,這更加造成混亂。
為了它的"超炫"特點(diǎn)(wow factor),如果將光標移動(dòng)到上面,RealOne播放器窗口大小改變控件將會(huì )加亮為離子綠色。對于其它控件也是如此。這讓界面看起來(lái)有點(diǎn)緊張,盡管它相當簡(jiǎn)單。
非常明顯,按鈕不是標準的,而且設計得很差。如果它們處于失效狀態(tài),會(huì )讓一些用戶(hù)不能看到它們的存在。第二個(gè)按鈕起的那些按鈕(就是播放按鈕相鄰的右邊那些按鈕)太小了,它們應該更大一些。理由便是它們周?chē)目瞻滋?。有意思的是,音量滑條標題圖標也是一個(gè)按鈕,正如它周?chē)幕疑吘壦?。但是,當這個(gè)按鈕被點(diǎn)擊時(shí)卻不明顯。實(shí)際上,點(diǎn)擊這個(gè)按鈕會(huì )使播放器靜音,即使這個(gè)圖標依然表示聲音依然從喇叭放出。RealOne看起來(lái)將這個(gè)表示顛倒了。
這些奇異之處和那個(gè)復雜的參數控制面板只能降低產(chǎn)品的競爭力,也就一起表明了QuickTime...或者Windows媒體播放器的成功??雌饋?lái)RealOne Player設計目的是為了顯擺,而其對手產(chǎn)品卻從使用性角度來(lái)考慮。

QuickTime播放器或許不是純Aqua,但它至少看起來(lái)很干凈和直觀(guān)

有意思,微軟的這個(gè)卻是三個(gè)之中最符合Aqua風(fēng)格的
聯(lián)系客服