03 蘋果對(duì)「toast」的看法

敲黑板說個(gè)冷知識(shí)，小編查閱了蘋果的人機(jī)交互規(guī)范發(fā)現(xiàn)并沒有類似「toast」使用場(chǎng)景的交互組件。當(dāng)時(shí)有點(diǎn)想不通，不過結(jié)合蘋果設(shè)計(jì)理念“不操作、不打擾”的原則似乎就比較說的通，iOS會(huì)通過對(duì)信息內(nèi)容的操作直接告訴用戶結(jié)果，例如下圖，當(dāng)用戶完成對(duì)短信刪除操作后，短信直接消失，沒有必要再通過toast類型組件去告知用戶。

蘋果對(duì)于反饋設(shè)計(jì)十分謹(jǐn)慎，只有在必要的時(shí)候才會(huì)考慮去打擾用戶破壞體驗(yàn)，在“Feedback”設(shè)計(jì)建議中提到，將狀態(tài)提示跟其他類型反饋?zhàn)匀豁槙车募傻侥憬缑娈?dāng)中，例如iOS系統(tǒng)中對(duì)于未讀信息提示的設(shè)計(jì)。

這里應(yīng)該會(huì)有同學(xué)提到一個(gè)以前iOS系統(tǒng)下的怪物組件「UIProgressHUD」，他從外觀樣式上看起來跟「toast」有一定的相似性，但是整一個(gè)交互行為差別巨大。

• HUD出現(xiàn)在屏幕的中央，Toast在底部；
• HUD可以由icon，Toast不能有icon，只能用文字與按鈕；
• HUD一般是毛玻璃透明，Toast一般是灰黑或者黑色半透明；
• HUD一般用在調(diào)節(jié)信息（如調(diào)節(jié)音量時(shí)），Toast中內(nèi)容不可變化。

不過iOS 13中蘋果還是秉承著自己的設(shè)計(jì)理念，最終拋棄了音量調(diào)整的HUD，采用音量滑動(dòng)條的方式，并且位于屏幕左側(cè)，盡可能消除對(duì)用戶的打擾。

04「Toast」的設(shè)計(jì)注意點(diǎn)

1. 讓「Toast」自動(dòng)關(guān)閉

「toast」是系統(tǒng)對(duì)用戶傳遞消息最低程度的中斷，不需要用戶進(jìn)行交互。自動(dòng)讓其消失，停留時(shí)長(zhǎng)再屏幕上至少四秒，最多十秒。

下圖為各種反饋組件到擾優(yōu)先級(jí)對(duì)比表（出自Material design文檔）

2. 一次只出現(xiàn)一個(gè)

當(dāng)需要多個(gè)「toast」更新時(shí)，它們應(yīng)該一次出現(xiàn)一個(gè)。如果多個(gè)連續(xù)出現(xiàn)的話就違背「toast」不中斷用戶體驗(yàn)的初衷了。

3. 可泛化的使用「Toast」

隨著互聯(lián)網(wǎng)的深入發(fā)展，現(xiàn)在對(duì)于他的泛化使得Toast原本的定義變得模糊，拓展了很多新的使用場(chǎng)景?？丶x和用途的變化也在隨著時(shí)間演化，演化出符合業(yè)務(wù)和用戶習(xí)慣的新形式反過來又會(huì)促成新的控件定義和規(guī)范，連iOS官方的Apple Store App都開始使用類似Toast的控件，并且不少app里「toast」也出現(xiàn)在屏幕的中間（這點(diǎn)與Material design對(duì)于「toast」的看法相違背）。

4. 使用時(shí)注意實(shí)際場(chǎng)景

上文提到「toast」可以適當(dāng)?shù)姆夯褂?，但是并不分?chǎng)合亂用，比如許多產(chǎn)品在加載、表單提示、狀態(tài)變更反饋、斷網(wǎng)消息等一些需要重度提示的場(chǎng)景也在使用「toast」，這就很讓人啼笑皆非了。

05 文末小節(jié)

由于「toast」類型組件使用簡(jiǎn)單適用范圍廣，造成它這么多年來一直在產(chǎn)品設(shè)計(jì)當(dāng)中被濫用，不過隨著互聯(lián)網(wǎng)設(shè)計(jì)不斷深入發(fā)展，「toast」類型組件被濫用的狀況正在逐漸變好，同時(shí)不少相似設(shè)計(jì)場(chǎng)景其實(shí)有更匹配的設(shè)計(jì)組件去代替「toast」，所以「toast」類型組件的使用場(chǎng)景會(huì)不斷縮小，泛化的定義終將回歸到原點(diǎn)——操作后的輕量級(jí)短時(shí)反饋提示。

作者：月亮與六便士；公眾號(hào)：月亮體驗(yàn)設(shè)計(jì)坊

本文由 @月亮與六便士 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。

題圖來Unsplash，基于CC0協(xié)議。