@圍脖上的嘟嘟王子?：這篇依舊是讀書(shū)筆記，只不過(guò)記錄的不是整本書(shū)，而是《About face 3交互設(shè)計(jì)精髓》中的一個(gè)知識(shí)點(diǎn)，這個(gè)知識(shí)點(diǎn)非常重要，重要到需要單獨(dú)提出來(lái)記錄一篇。

往期回顧：

1. 《設(shè)計(jì)師讀書(shū)筆記連載系列之<簡(jiǎn)約至上>》
2. 《設(shè)計(jì)師讀書(shū)筆記連載系列之<Don’t Make Me Think>》
3. 《設(shè)計(jì)師讀書(shū)筆記連載系列之《設(shè)計(jì)師要懂心理學(xué)》

在《About face 3交互設(shè)計(jì)精髓》一書(shū)中，將PC端應(yīng)用分為了3種姿態(tài)：獨(dú)占姿態(tài)，暫時(shí)姿態(tài)，后臺(tái)姿態(tài)。

1）獨(dú)占姿態(tài)是什么？

想想一下你正在全神貫注的做一件事情，唱一首歌、或者跳一支舞，你沉浸其中，你忘記了時(shí)間，也把其他事情暫時(shí)拋開(kāi)了，這就叫做心流狀態(tài)，而能這首歌、這支舞就是獨(dú)占你心流狀態(tài)的事物。

PC端產(chǎn)品的獨(dú)占狀態(tài)也相同，它最大特點(diǎn)就是會(huì)被長(zhǎng)時(shí)間持續(xù)的使用，且作為主要工具主導(dǎo)了用戶(hù)的工作流（工作中的心流狀態(tài)），這類(lèi)應(yīng)用通常有著較多的功能、復(fù)雜的交互、用戶(hù)經(jīng)常需要長(zhǎng)時(shí)間持續(xù)運(yùn)行、占據(jù)整個(gè)屏幕.

比如設(shè)計(jì)師在使用sketch 的時(shí)候，通常都會(huì)將窗口最大化，盡管有時(shí)候需要搜索一些配圖、處理一下工作雜事，但sketch依舊能保持其獨(dú)占姿態(tài)。

2）獨(dú)占應(yīng)用的使用者一般都是中間用戶(hù)

用戶(hù)使用獨(dú)占應(yīng)用時(shí)，往往目標(biāo)明確，且有要在應(yīng)用上花費(fèi)大量時(shí)間和精力的心理準(zhǔn)備，因此用戶(hù)一定會(huì)從新手用戶(hù)發(fā)展為中間用戶(hù)。這就意味著產(chǎn)品不能犧牲功能從而變得容易學(xué)習(xí)，也不能一味追求精密復(fù)雜的超級(jí)工具，設(shè)計(jì)者需要做的是：永遠(yuǎn)為中間用戶(hù)進(jìn)行優(yōu)化。

3）獨(dú)占應(yīng)用的設(shè)計(jì)原則

1、慷慨的使用屏幕空間

由于獨(dú)占應(yīng)用長(zhǎng)時(shí)間持續(xù)被使用，沒(méi)有其他的應(yīng)用能和這個(gè)獨(dú)占應(yīng)用相爭(zhēng)，因此獨(dú)占應(yīng)用可以最大化的使用空間

2、弱化視覺(jué)表現(xiàn)

由于用戶(hù)可能長(zhǎng)時(shí)間盯著獨(dú)占應(yīng)用，擁有強(qiáng)烈色彩的視覺(jué)風(fēng)格只會(huì)帶來(lái)短暫的新鮮感，很快就會(huì)令用戶(hù)視覺(jué)疲勞，因此弱化視覺(jué)表現(xiàn)上的顏色和紋理變得很重要。

如下圖，PPT的整體配色以灰色為主調(diào)弱化視覺(jué)表現(xiàn)

3、用更少的像素來(lái)做更多的事情

用戶(hù)長(zhǎng)時(shí)間盯著相同的菜單和工具欄，會(huì)對(duì)功能的位置越來(lái)越有熟悉感，肢體對(duì)位置也有反射記憶。因此，設(shè)計(jì)者可以用更少的像素來(lái)做更多的事情，比如空間上更緊湊、icon更小等

4、豐富的操作

獨(dú)占應(yīng)用的用戶(hù)目標(biāo)明確-快速完成某項(xiàng)任務(wù)，因此豐富的操作對(duì)中間用戶(hù)來(lái)說(shuō)就變得非常重要。比如做設(shè)計(jì)的時(shí)候，你需要快速?gòu)?fù)制粘貼，那這時(shí)針對(duì)新手用戶(hù)的鼠標(biāo)右鍵復(fù)制粘貼已經(jīng)比較麻煩且浪費(fèi)時(shí)間，Ctrl+C和Ctrl+V就比較便捷了。

5、防錯(cuò)機(jī)制

相信你一定曾經(jīng)遇到過(guò)這種倒霉事：正做著PS呢，程序崩潰了，做了這么久的圖，說(shuō)沒(méi)就沒(méi)了，一口老血噴了一屏幕。如果這些獨(dú)占應(yīng)用可以每隔幾分鐘就保存一次，就可以防止程序崩潰或錯(cuò)誤操作帶來(lái)的損失了。

不止是PC客戶(hù)端、隨著多平臺(tái)時(shí)代的發(fā)展、現(xiàn)在web上也有越來(lái)越多的獨(dú)占應(yīng)用，比如用來(lái)做云端PPT的輕頁(yè)，可以用來(lái)跨平臺(tái)分享，不需要下載，一個(gè)鏈接就可以打開(kāi)一個(gè)演示文檔。

而這種應(yīng)用會(huì)帶來(lái)更多的干擾，比如在編輯頁(yè)面，瀏覽器頂部的標(biāo)簽和工具欄時(shí)常會(huì)干擾用戶(hù)，分散用戶(hù)的注意力。而瀏覽器頁(yè)面更容易被關(guān)閉，因此后臺(tái)緩存和關(guān)閉強(qiáng)提示就變的非常重要。

2.1）暫時(shí)姿態(tài)是什么？

你在繪畫(huà)的時(shí)候，要換一支小一號(hào)的畫(huà)筆；跳舞的時(shí)候換一雙舞鞋；唱K的時(shí)候換一首歌，你所有的暫時(shí)性動(dòng)作都是為了整個(gè)事件的完成，這種短暫事件就是暫時(shí)姿態(tài)。

PC端產(chǎn)品的暫時(shí)狀態(tài)也相同，它最大特點(diǎn)就是在暫時(shí)需要時(shí)被調(diào)用，完成自身任務(wù)后又迅速離開(kāi)，讓用戶(hù)繼續(xù)工作，暫時(shí)姿態(tài)的臨時(shí)性特點(diǎn)，讓這類(lèi)界面必須清晰而容易操作。

例如在做PPT時(shí)，需要調(diào)入一張圖片，這個(gè)時(shí)候調(diào)出來(lái)的插入圖片的彈框程序就是暫時(shí)姿態(tài)。

2.2）暫時(shí)姿態(tài)的使用者是所有人

雖然暫時(shí)姿態(tài)可以單獨(dú)運(yùn)行，但通常都是輔助支持獨(dú)占應(yīng)用的。因此無(wú)論是新手用戶(hù)、中間用戶(hù)、還是專(zhuān)家用戶(hù)，暫時(shí)姿態(tài)都將被使用。

3.3）暫時(shí)姿態(tài)的設(shè)計(jì)原則

節(jié)約屏幕空間，且必須是可以移動(dòng)的

暫時(shí)姿態(tài)只是暫時(shí)被調(diào)用，且他們位于獨(dú)占應(yīng)用之上，因此、暫時(shí)姿態(tài)的應(yīng)用程序必須是可以移動(dòng)的，方便用戶(hù)來(lái)回拖動(dòng)，不遮擋用戶(hù)視線(xiàn)。

清晰的設(shè)計(jì)和較大的icon

PC端的QQ音樂(lè)就是一個(gè)典型的暫時(shí)姿態(tài)的應(yīng)用。

設(shè)計(jì)師Tony經(jīng)常會(huì)在作圖的時(shí)候通常會(huì)聽(tīng)音樂(lè)來(lái)放松心情，今天也是如此，他快速打開(kāi)QQ音樂(lè)的客戶(hù)端，選好了自己喜歡的歌單后又迅速關(guān)閉，之后偶爾快速查看或者操作它。這個(gè)時(shí)候，清晰的設(shè)計(jì)和較大的icon有利于用戶(hù)迅速識(shí)別、迅速完成操作。

豐富的視覺(jué)表現(xiàn)

獨(dú)占姿態(tài)弱化了視覺(jué)表現(xiàn)，這時(shí)在暫時(shí)姿態(tài)彈出時(shí)，醒目的設(shè)計(jì)反倒有利于用戶(hù)快速定位。況且暫時(shí)姿態(tài)只是短暫被調(diào)出，不會(huì)長(zhǎng)時(shí)間停留在屏幕上，因此豐富的視覺(jué)表現(xiàn)不會(huì)引起用戶(hù)的視覺(jué)疲勞和反感

最好不要增加第二個(gè)視圖或?qū)υ?huà)框

用戶(hù)調(diào)用暫時(shí)程序時(shí)，他所需要的信息和功能操作應(yīng)當(dāng)直接顯示在程序的單個(gè)窗口上，讓用戶(hù)集中在這個(gè)窗口上操作，不要再轉(zhuǎn)到其他窗口或彈框來(lái)完成程序的主要功能。如果在設(shè)計(jì)暫時(shí)程序時(shí)，你發(fā)現(xiàn)自己在增加一個(gè)第二視圖或者彈框，你就需要重新來(lái)檢查你的設(shè)計(jì)了。

記住用戶(hù)的選擇

我經(jīng)常用Axure畫(huà)交互稿，在保存圖片的時(shí)候，程序通常會(huì)記住我上次的保存位置。這種讓?xiě)?yīng)用程序記住它最后一次使用狀態(tài)的交互方式，符合用戶(hù)的心理模型。

后臺(tái)姿態(tài)是什么？

通常不與用戶(hù)互動(dòng)的程序是后臺(tái)姿態(tài)應(yīng)用，這些程序隱形于后臺(tái)進(jìn)行服務(wù)，無(wú)需用戶(hù)干預(yù)就可以完成重要任務(wù)。就像是我們的心跳，我們無(wú)需有意識(shí)的控制心跳，它是在人體后臺(tái)自動(dòng)運(yùn)營(yíng)的進(jìn)程，但和心跳不同的是，后臺(tái)應(yīng)用必須可以隨時(shí)被加載或卸載，也可以隨時(shí)被調(diào)整。

下圖是Mac系統(tǒng)中的后臺(tái)程序

2）大多數(shù)用戶(hù)都不會(huì)使用后臺(tái)應(yīng)用

大多數(shù)情況下，用戶(hù)根本意識(shí)不到后臺(tái)應(yīng)用的存在，只有程序出現(xiàn)錯(cuò)誤時(shí)，用戶(hù)才會(huì)注意到有可能后臺(tái)出錯(cuò)了，而這種錯(cuò)誤一般用戶(hù)都無(wú)法處理，需要尋求專(zhuān)業(yè)人士的幫助。

3）后臺(tái)姿態(tài)的設(shè)計(jì)原則

我們基本接觸不到后臺(tái)姿態(tài)應(yīng)用的界面設(shè)計(jì)，晦澀難懂的專(zhuān)業(yè)詞匯也令我們迷惑，個(gè)人認(rèn)為可以先忽略。

總結(jié)：

獨(dú)占姿態(tài)：長(zhǎng)時(shí)間被持續(xù)使用，用戶(hù)需要在這種應(yīng)用中進(jìn)入心流狀態(tài)，我們需要不斷為中間用戶(hù)優(yōu)化。
暫時(shí)姿態(tài)：短暫被調(diào)用后關(guān)閉，完成任務(wù)后迅速被關(guān)閉，所有人都會(huì)使用到它。
后臺(tái)姿態(tài)：在后臺(tái)運(yùn)行，大部分設(shè)計(jì)師基本接觸不到后臺(tái)姿態(tài)的界面設(shè)計(jì)。
我們?cè)谠O(shè)計(jì)的時(shí)候需要注意獨(dú)占姿態(tài)和暫時(shí)姿態(tài)不同的設(shè)計(jì)原則，保證界面的可用性。

此篇記錄到這里，歡迎大家關(guān)注我的微信公眾號(hào)，不定期更新。

【優(yōu)設(shè)四月人氣過(guò)萬(wàn)的好文】

使用素材站：
《實(shí)用干貨！11個(gè)人氣超高的設(shè)計(jì)素材匯總網(wǎng)站》

自學(xué)UI設(shè)計(jì)的正確姿勢(shì)：
《別著急學(xué)軟件！先掌握科學(xué)有效的UI設(shè)計(jì)自學(xué)姿勢(shì)（超全面）》

幽默有趣的前端小課堂：
《零基礎(chǔ)也能看懂！寫(xiě)給設(shè)計(jì)師的前端小知識(shí)之網(wǎng)頁(yè)排版（附實(shí)戰(zhàn)）》

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專(zhuān)注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線(xiàn)端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書(shū)：史上最全的設(shè)計(jì)師圖書(shū)導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量112萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com