手工碼字翻譯供交互學(xué)習(xí)之用，進(jìn)度異常緩慢，歡迎小伙伴們批評(píng)指正&溝通交流！

氣球狀提示是一個(gè)小型的彈出窗口，用以提示用戶出現(xiàn)了非關(guān)鍵性的問(wèn)題，或控件出現(xiàn)非常規(guī)狀態(tài)。

氣球狀提示示例

Notification 通知 是一種特殊的氣球狀提示，由通知區(qū)域icon展示

消息欄

notification

何時(shí)使用該控件？

思考以下問(wèn)題，再做決定：

• 文本信息是否有描述問(wèn)題或特殊情況？如果不是，請(qǐng)不要使用氣球狀提示。不要用氣球狀提示來(lái)展現(xiàn)控件的補(bǔ)充信息?？梢钥紤]使用靜態(tài)文字、infotips 信息提示、progressive disclosure 漸進(jìn)展示控件
  或即時(shí)提示代替。

• 在輸入時(shí)或者主控件剛剛失去輸入焦點(diǎn)時(shí)，問(wèn)題或特殊情況會(huì)即時(shí)被檢測(cè)到嗎？如果不是，用 task dialog 任務(wù)對(duì)話框或 message box 消息彈框來(lái)展示錯(cuò)誤信息。

• 出現(xiàn)的問(wèn)題是否嚴(yán)重？如果是，用任務(wù)對(duì)話框或消息彈框等能立刻交互以解決問(wèn)題的形式來(lái)展示問(wèn)題信息。

• 若出現(xiàn)的是特殊情況，這種特殊情況有特殊意義嗎？是不是用戶在無(wú)意中導(dǎo)致的情況？如果符合這兩種情況，可以使用氣球狀提示。如果特殊情況沒(méi)什么本質(zhì)意義，就應(yīng)該避免出現(xiàn)這種特殊狀態(tài)。對(duì)用戶有意觸發(fā)的特殊情況，則不需要作任何提示。

• 錯(cuò)誤或情況能否進(jìn)行簡(jiǎn)明描述？如果不能，請(qǐng)使用其他控件。氣球狀提示不能承載細(xì)節(jié)闡述和補(bǔ)充信息。

• 信息是否用于描述正處于焦點(diǎn)懸停狀態(tài)下的控件？除非用戶需要與懸?？丶男畔⒔换?，否則這種情況應(yīng)該使用tip提示控件來(lái)對(duì)懸?？丶M(jìn)行說(shuō)明。

• 提示信息和用戶當(dāng)前行為有關(guān)聯(lián)嗎？如果沒(méi)有，考慮使用 notification 通知或 dialog box 對(duì)話框。用戶有忽略掉和當(dāng)前行為無(wú)關(guān)的氣球狀提示的傾向，而且氣球狀提示默認(rèn)狀態(tài)下10秒后會(huì)消失。

• 提示信息來(lái)源于單一的、確定的源嗎？如果問(wèn)題或情況是由多個(gè)或不確定的源控件引發(fā)，用就地展示信息 in-place message對(duì)各控件分別提示或用 dialog box 對(duì)話框來(lái)作說(shuō)明。

錯(cuò)誤示例:在這個(gè)例子中，問(wèn)題情況有可能是由用戶名填寫或者密碼填寫錯(cuò)誤兩種情況引發(fā)，但氣球狀提示報(bào)錯(cuò)，從視覺(jué)上來(lái)看是指出了密碼填寫有問(wèn)題導(dǎo)致登錄失敗。如果問(wèn)題出在用戶名輸入有誤，反饋便會(huì)產(chǎn)生誤導(dǎo)。

氣球狀提示和 infotips 消息提示, dialog boxes 對(duì)話框以及 in-place messages 就地展示信息等控件功用相似。與 tooltips 工具提示和 infotips 消息提示相比較：

• 氣球狀提示獨(dú)立于當(dāng)前光標(biāo)焦點(diǎn)展示，所以有一個(gè)指明源的小尾巴。
• 氣球狀提示有標(biāo)題、正文和一個(gè)icon。
• 氣球狀提示有交互性，但是并沒(méi)有一個(gè)供點(diǎn)擊的落點(diǎn)。

和 modal dialog boxes 模態(tài)對(duì)話框相比較：

• 氣球狀提示不會(huì)獲取輸入焦點(diǎn)，也不強(qiáng)制需要交互。
• 氣球狀提示指示一個(gè)單一的、確定的源。模態(tài)對(duì)話框的信息提示則可以指示多源，或沒(méi)有確定的源。

和 in-place messages 就地展示信息相比：

• 氣球狀提示視覺(jué)上更明顯。
• 氣球狀提示不像就地展示信息一樣，需要在控件內(nèi)預(yù)留空間或使用動(dòng)態(tài)布局來(lái)展示內(nèi)容。
• 氣球狀提示一定時(shí)間后會(huì)自動(dòng)消失。

應(yīng)用范例

氣球狀提示有這些應(yīng)用形式：

• 輸入信息引發(fā)的問(wèn)題：在單一控件中出現(xiàn)的、用戶輸入引發(fā)的非關(guān)鍵性輸入問(wèn)題，通常來(lái)源于輸入框。
  氣球狀提示不會(huì)帶走輸入焦點(diǎn)，在源控件仍可進(jìn)行輸入操作的時(shí)候，提示也非常顯眼。要解決出現(xiàn)的問(wèn)題，用戶可能要更改或重新輸入內(nèi)容；但如果源控件忽略了不正確的輸入，用戶就無(wú)需更改。因?yàn)閱?wèn)題不嚴(yán)重，不需附帶錯(cuò)誤icon標(biāo)志。

指示非關(guān)鍵性輸入問(wèn)題的氣球狀提示

• 特殊情況的問(wèn)題：源控件處于會(huì)影響輸入信息的特殊狀態(tài)。這種情況可能是用戶無(wú)意中引發(fā)的，也不知道會(huì)影響輸入內(nèi)容。
  氣球狀提示可以在特殊情況發(fā)生之時(shí)警告用戶，以避免操作失誤（例如超過(guò)最大輸入字符限制或無(wú)意中打開(kāi)了大寫鍵）。此時(shí)有必要在不打擾輸入焦點(diǎn)的情況下作提示，不要強(qiáng)迫用戶進(jìn)行修正操作，因?yàn)橛锌赡苡脩羰怯幸膺@樣操作的。對(duì)于密碼輸入框和PIN碼輸入的情況來(lái)說(shuō)，氣球狀提示非常必要，不然用戶操作的反饋就極小了。這時(shí)的氣球狀提示帶有警告標(biāo)志。

用于報(bào)告特殊情況的氣球狀提示

設(shè)計(jì)指南

何時(shí)展示

• 在問(wèn)題或特殊情況出現(xiàn)時(shí)立即彈出氣球狀提示，甚至可以多次彈出，不要出現(xiàn)視覺(jué)上的延遲。

1. 如果需要顯示關(guān)于單個(gè)字符及最大輸入值的提示，需要在用戶開(kāi)始輸入時(shí)立刻提示；
2. 如果是關(guān)于輸入字段類型的提示（包括不能輸入空格等等），要在當(dāng)源控件失去輸入焦點(diǎn)時(shí)顯示氣球狀提示。否則，在用戶正輸入數(shù)據(jù)時(shí)彈出彈框會(huì)讓人分心和煩躁（用戶的輸入值很有可能是有效的）。

• 一次只顯示一個(gè)氣球狀提示。一次展示多個(gè)氣球狀提示會(huì)顯得情況十分嚴(yán)重。如果單個(gè)事件引發(fā)了多個(gè)問(wèn)題，要么在一次提示中說(shuō)明所有問(wèn)題，要么只報(bào)告最重要的問(wèn)題。

錯(cuò)誤示例：不要同時(shí)展示多個(gè)氣球狀提示

展示時(shí)長(zhǎng)

• 當(dāng)出現(xiàn)以下情況時(shí)停止展示：

1. 問(wèn)題已解決或特殊情況已不存在。
2. 針對(duì)輸入問(wèn)題，用戶輸入的是有效值。
3. 氣球狀提示時(shí)效已到。氣球狀提示默認(rèn)10s后會(huì)自行消失，用戶也可以在SPI_MESSAGEDURATION system parameter里自行更改設(shè)置。

如何展示

1. 在源控件的下方展示氣球狀提示。這樣能夠讓用戶看清上下文環(huán)境，包括源控件以及標(biāo)簽。Microsoft Windows會(huì)自適應(yīng)氣球狀提示的位置，讓它們完全展示。錯(cuò)誤的展示方式是讓氣球狀提示展示在它的源控件上方，notification 提示也是如此。

正確示例

錯(cuò)誤示例

密碼和PIN碼輸入框

• 用氣球狀提示表示大寫按鈕已打開(kāi)， 如下圖示例：

氣球狀提示顯示PIN碼輸入框中大寫按鈕已打開(kāi)

• 當(dāng)用戶的輸入有可能超過(guò)最大字長(zhǎng)時(shí)，給予氣球狀提示。將要超過(guò)最大字長(zhǎng)的情況在輸入密碼和PIN碼的時(shí)候，比一般輸入情形更為不明顯。

示例

• 當(dāng)用戶輸入字符類型不符合要求時(shí)，給予提示。但是，一般情況下不建議對(duì)字符類型進(jìn)行限制，因?yàn)檫@樣會(huì)降低密碼或PIN碼的安全性。為防止信息泄露，氣球狀提示只能提到關(guān)于有效密碼和PIN碼的類型描述。

示例

其他類型的文本框

• 當(dāng)用戶的輸入快要超過(guò)最大字長(zhǎng)臨界值時(shí)，考慮給于氣球狀提示，對(duì)于新手用戶，設(shè)置長(zhǎng)度恰好合適的文本輸入框，例如需要輸入用戶名或者賬戶名的情況。當(dāng)輸入超過(guò)臨界字長(zhǎng)時(shí)系統(tǒng)會(huì)發(fā)出警告聲，但初學(xué)用戶有可能無(wú)法理解警告聲的指向含義。

快超過(guò)字?jǐn)?shù)限制時(shí)的氣球狀提示示例

交互效果

• 當(dāng)用戶點(diǎn)擊氣球狀提示，它會(huì)直接消失。和 notifications 通知不同，氣球狀提示沒(méi)有關(guān)閉按鈕。

圖標(biāo)

• 根據(jù)應(yīng)用場(chǎng)景選擇圖標(biāo)

1. 輸入問(wèn)題： 不用icon。不要使用不符合Windows風(fēng)格的錯(cuò)誤指示icon。

2. 特殊情況： 標(biāo)準(zhǔn)的16*16像素警告icon
   

   警告

易用性

應(yīng)用適宜，氣球狀提示就能增加易用性。要做到這一點(diǎn)，氣球狀提示應(yīng)該：

• 只在發(fā)生的情況和當(dāng)前用戶行為相關(guān)時(shí)，展示氣球狀提示。
• 保持提示文字簡(jiǎn)明。這樣有助視力不佳的用戶閱讀，也能使使用屏幕閱讀器的殘障人士不受過(guò)多干擾，更方便閱讀理解主要內(nèi)容。
• 當(dāng)問(wèn)題或特殊情況再次出現(xiàn)時(shí)，也要再次彈出氣球狀提示。

文字

標(biāo)題文字

• 標(biāo)題應(yīng)簡(jiǎn)潔準(zhǔn)確地總結(jié)描述當(dāng)前情況或問(wèn)題，要能讓用戶快速方便地理解提示的意圖。
• 標(biāo)題可使用文字片段或完整句子，但是不要加句號(hào)。
• 遵守完整句子書(shū)寫的大小寫規(guī)范。
• 將字符（英文）限制在48個(gè)以內(nèi)以適應(yīng)本地化翻譯的布局。標(biāo)題的最大長(zhǎng)度為63個(gè)字符,必須能夠擴(kuò)展至少30%以適應(yīng)本地化翻譯。

主體文字

• 用第一句話清楚陳述當(dāng)前情況或問(wèn)題，并使用戶感到切實(shí)與自己相關(guān)。不要重復(fù)源控件標(biāo)題中的信息。如果沒(méi)有標(biāo)題之外的補(bǔ)充信息，這部分可以省略。
• 第二句話讓用戶了解如何操作能夠解決問(wèn)題或改變當(dāng)前狀況。這句里面不需用“請(qǐng)”這樣的禮貌用語(yǔ)，語(yǔ)句規(guī)范參見(jiàn) Style and Tone。第一句話和第二句話之間需要空兩行。

標(biāo)準(zhǔn)氣球狀提示文字示例

• 如果解決方法很容易理解，就向用戶解釋告知，但情況陳述和解決方法部分重復(fù)的冗余要略去。以下情況除外：

1. 如果解決方法不能簡(jiǎn)明表達(dá)，或冗余部分很重要不能省去，就略掉解決方法的闡述。
2. 當(dāng)沒(méi)什么需要用戶做的時(shí)候（例如系統(tǒng)自動(dòng)忽略了不正確字符的輸入），略掉解決方法的闡述。

• 使用帶句號(hào)的完整句子。
• 使用句法大小寫書(shū)寫規(guī)范。
• 將字符（英文）限制在200個(gè)以內(nèi)以適應(yīng)本地化翻譯。正文的最大長(zhǎng)度為225個(gè)字符，必須能夠擴(kuò)展至少30%以適應(yīng)本地化翻譯的需求。

說(shuō)明

提到氣球狀提示時(shí)：

• 引用準(zhǔn)確的標(biāo)題文字，包括其大小寫規(guī)范。
• 明確該控件叫做氣球狀提示，不要與 notification 提示和 alert 警告混淆。
• 盡可能用粗體顯示標(biāo)題或者用引號(hào)包圍標(biāo)題，防止標(biāo)題和正文文意混淆引起誤解。