一、控件
1.1命令控件
與動(dòng)詞對(duì)應(yīng)的空間類型叫命令控件
1.1.1按鈕--按鈕要提供詩(shī)句能供性,視覺上最吸引人
1.1.2圖標(biāo)按鈕--容易記憶和使用,缺點(diǎn)是入門較難。
1.1.3超鏈接--圖片也可以作為超鏈接
鏈接用于導(dǎo)航,按鈕用于動(dòng)作。
1.2選擇控件
1.2.1復(fù)選框--方形。圓形是單選框。
1.2.2開關(guān)按鈕--部分取代了復(fù)選框,適合非模態(tài)交互。
1.2.3狀態(tài)切換按鈕:一種應(yīng)該避免的選擇習(xí)慣用法
1.2.4單選按鈕--圓形。也可以用圖表按鈕取代。
1.2.5開關(guān)--切換開關(guān)狀態(tài)
1.2.6組合圖標(biāo)按鈕--在下拉列表中,如果用單選圖標(biāo)按鈕取代圖標(biāo)按鈕,稱之為組合圖標(biāo)按鈕。面向中間和專家用戶。
1.3列表控件
用戶可以在一組有限責(zé)文本字符串中進(jìn)行選擇,每個(gè)文本字符串代表一個(gè)命令、對(duì)象或?qū)傩浴?梢杂脠D表和預(yù)覽圖幫助選擇。
做記號(hào)--區(qū)分設(shè)計(jì)單選和多選。
從列表中拖放--qq臨時(shí)討論組那樣的樣式
列表排序--要求能自動(dòng)滾屏
列表中的水平滾動(dòng)--一定避免跑馬燈,可以換行或者省略中間用tooltip
在列表中輸入數(shù)據(jù)--現(xiàn)場(chǎng)編輯
下拉列表和彈出列表--取代單選,讓交互緊湊,立即改變信息狀態(tài)
組合框--列表框和編輯字段的組合
樹形控件--妨礙了使用者思考和利用對(duì)象的其他關(guān)系,除非具備非常自然的層次結(jié)構(gòu)。
1.4輸入控件
輸入控件向程序表達(dá)名詞。
有界輸入控件和無(wú)界輸入控件--能限制用戶輸入值大小的控件是有界輸入控件。使用有界輸入就要提供邊界可視化的提示。
微調(diào)器--可以調(diào)節(jié)控件改變數(shù)值,也可以輸入數(shù)值。
刻度盤和滑塊--滑塊更好操作??潭缺P不容易旋轉(zhuǎn)操作,適合專業(yè)的獨(dú)占式應(yīng)用。
拇指輪--三維應(yīng)用中用的較多。
無(wú)界輸入:文本編輯控件
1.5驗(yàn)證輸入控件
驗(yàn)證控件是內(nèi)嵌驗(yàn)證和反饋功能的無(wú)界文本輸入控件。
主動(dòng)驗(yàn)證和被動(dòng)驗(yàn)證--當(dāng)一個(gè)主動(dòng)驗(yàn)證控件拒絕輸入,它必須告訴用戶。對(duì)于被動(dòng)驗(yàn)證,可以采用遞減計(jì)時(shí)器,每次擊鍵重新計(jì)時(shí),如果時(shí)間減到0就開始驗(yàn)證??梢园延?jì)時(shí)器設(shè)置為半分鐘。
暗示--解釋驗(yàn)證控件可接受的數(shù)據(jù)范圍。
處理出界數(shù)據(jù)--比如輸入nine 可以自動(dòng)變?yōu)?
單位和度量--如果文本編輯控件能夠識(shí)別恰當(dāng)?shù)膯挝痪吞昧恕?/p>
不要使用文本編輯控件輸出--輸出使用文本顯示控件
1.6顯示控件
文本控件--用作其他控件的標(biāo)簽,或者輸出用戶不能改的數(shù)據(jù)
滾動(dòng)條--適合窗口內(nèi)容和文本導(dǎo)航器
分割線--將獨(dú)占應(yīng)用分為多個(gè)窗格的工具??梢苿?dòng)的分割線可以用光標(biāo)給出暗示。確保移動(dòng)后窗格內(nèi)容仍然可用。
抽屜--抽屜入口按鈕始終可見。存放不常用的空間和功能。
二、對(duì)話框
彈框是對(duì)話框的一種,這里說(shuō)的對(duì)話框主要是軟件的彈框或者系統(tǒng)的小彈框。
把主要的交互操作放在主窗口。
2.1合理運(yùn)用對(duì)話框
需要把用戶的注意力抽離常規(guī)事物流程的地方:任何可能會(huì)讓人困惑,置人于危險(xiǎn),很少使用的功能。比如可能對(duì)應(yīng)用狀態(tài)立即產(chǎn)生重大改變的行為。
對(duì)話框也適合集中放置某個(gè)主題的信息。
對(duì)話框主要服務(wù)于兩類用戶:對(duì)應(yīng)用熟悉的用戶,彈框被用來(lái)控制更高級(jí)或者更危險(xiǎn)的設(shè)置。對(duì)應(yīng)用不熟悉并偶爾使用的用戶,通過(guò)對(duì)話框來(lái)學(xué)習(xí)基礎(chǔ)知識(shí)。
2.2對(duì)話框的基本交互
對(duì)話框展現(xiàn)出明顯的視覺層次。
始終在最上層的視覺層。
每個(gè)對(duì)話框有一個(gè)標(biāo)題來(lái)標(biāo)示用途,一般來(lái)說(shuō)是動(dòng)詞。但是在屬性對(duì)話框的標(biāo)題中使用對(duì)象的名字。
至少喲一個(gè)可以關(guān)閉對(duì)話框的終止命令。比如關(guān)閉,ok ,cancel
2.3模態(tài)和非模態(tài)對(duì)話框
模態(tài)對(duì)話框運(yùn)行的時(shí)候,在這個(gè)軟件中不能干別的,只能處理這個(gè)對(duì)話框。意義明確很少被誤解,就是有時(shí)被濫用。
非模態(tài)對(duì)話框可以不打斷主程序。相比模態(tài),比較難使用,因?yàn)樗僮鞣秶淮_定。
1、區(qū)分模態(tài)對(duì)話框和非模態(tài)對(duì)話框----模態(tài)對(duì)話框一定有終止按鈕,不要有關(guān)閉按鈕。非模態(tài)對(duì)話框一定沒(méi)有終止按鈕,可以有關(guān)閉。
2、模態(tài)對(duì)話框的問(wèn)題----盡量使用 OK cancel 這樣的描述,不要使用太多變化,以免用戶理解錯(cuò)誤。(貌似ios的彈框內(nèi)容就不是局限在這兩者)
3、非模態(tài)對(duì)話框的問(wèn)題--要設(shè)計(jì)非模態(tài)對(duì)話框參數(shù)改變后,主界面的實(shí)時(shí)改變?;蛘咧鹘缑孢x擇的內(nèi)容超過(guò)了非模態(tài)對(duì)話框的編輯范圍時(shí)又該怎么設(shè)計(jì)。這些的復(fù)雜的問(wèn)題造成非模態(tài)對(duì)話框無(wú)法像模態(tài)對(duì)話框那樣統(tǒng)一好理解。
4、非模態(tài)對(duì)話框和撤銷--程序?qū)用娴膗ndo可能更適合
5、非模態(tài)對(duì)話框和邊欄--如果非模態(tài)對(duì)話框主要為主窗口內(nèi)的活動(dòng)提供持久支持,最好采用邊欄的形式。
2.4對(duì)話框的五個(gè)目的
1、屬性對(duì)話框--最好做成非模態(tài)的或者邊欄
2、功能對(duì)話框--智能控制單一功能,比對(duì)打印,另存
3、進(jìn)度對(duì)話框--清晰展示:一個(gè)耗時(shí)的進(jìn)程正在運(yùn)行中,現(xiàn)在一切正常,該進(jìn)程還需要多長(zhǎng)時(shí)間才能完成(或者進(jìn)度),還有多少事情或項(xiàng)目沒(méi)有做完,用戶如何才能取消操作。
4、通知對(duì)話框--移動(dòng)端用的比較多,清晰持久的標(biāo)示出新通知或者未讀通知
5、公告對(duì)話框--應(yīng)用程序直接啟動(dòng),比如錯(cuò)誤、警告、確認(rèn)。通常是應(yīng)用程序級(jí)模態(tài)的。
2.5管理屬性對(duì)話框和功能對(duì)話框
1、選項(xiàng)卡對(duì)話框--tab 不要堆疊選項(xiàng)卡
2、擴(kuò)展對(duì)話框--擴(kuò)展后顯示更多控件,有點(diǎn)像抽屜的概念,但不是抽屜的形式。從新手到專家都友好
3、級(jí)聯(lián)對(duì)話框--對(duì)話框套對(duì)話框,不推薦。
三、消除錯(cuò)誤、警告和確認(rèn)
3.1錯(cuò)誤對(duì)話框
用戶犯錯(cuò)時(shí) 不應(yīng)受到訓(xùn)斥 而是幫助
有些看似是用戶的錯(cuò) 實(shí)際是程序不人性的問(wèn)題,換做是人就不會(huì)這么無(wú)理了。
錯(cuò)誤對(duì)話框真正做的事保護(hù)應(yīng)用程序不陷入麻煩。
要消除錯(cuò)誤消息 就要把程序?qū)懙牟蝗菀壮鰡?wèn)題。
使用戶不可能犯錯(cuò)是消除錯(cuò)誤消息的最好方法。其次是讓程序變得足夠聰明,使用戶不再提出不必要的請(qǐng)求。
為用戶提供正面反饋。正面反饋可以幫助人們做他們想做的事。
一定要用錯(cuò)誤提示框 也請(qǐng)使用禮貌用語(yǔ) 并一定給出解決方法。 ?
3.2警告和確認(rèn)
警告的原理在于告知用戶,但是不能打斷流暢的交互流。
軟件告訴用戶它的行動(dòng) ,應(yīng)該在主屏幕上提供可視化的指示。
當(dāng)應(yīng)用對(duì)自己的行為不自信時(shí) ,經(jīng)常會(huì)使用確認(rèn)對(duì)話框。確認(rèn)對(duì)話框把責(zé)任推給用戶。
解決方法是使動(dòng)作易于恢復(fù),并且提供足夠的非模態(tài)反饋,確保用戶不會(huì)措手不及。避免出現(xiàn)狼來(lái)了的情況。
如何消除錯(cuò)誤框:做,不要問(wèn)。提供撤銷。給用戶提供非模態(tài)反饋。
四、魔鬼在細(xì)節(jié)里
注意點(diǎn)點(diǎn)滴滴的細(xì)節(jié) 才能做出卓越的產(chǎn)品。
本書完