推薦：交互設(shè)計實用指南系列(0) – 我們眼中的交互設(shè)計
交互設(shè)計(Interaction Design, 縮寫 IxD 或者 IaD),是定義、設(shè)計人造系統(tǒng)的行為的設(shè)計領(lǐng)域。人造物，即人工制成物品，例如，軟件、移動設(shè)備、人造環(huán)境、服務(wù)、可佩帶裝置以及系統(tǒng)的組織結(jié)構(gòu)。交互設(shè)計在于定義人造物的行為方式(the “interaction”,即人工制品在特定場

“操作入口明確”，就是指產(chǎn)品的任何一個功能都要有明確、合理的入口。“操作入口”，指的是產(chǎn)品內(nèi)部不同模塊之間的轉(zhuǎn)接元素，例如在Web產(chǎn)品中，按鈕控件、輸入框、文字鏈等都屬于操作入口；“明確”指的是入口的視覺感是清晰的、可識別的；“合理”是指入口的出現(xiàn)是符合用戶操作邏輯的，適時的。

之所以要提出“操作入口明確”，是因為用戶在使用產(chǎn)品的過程中，往往遵循的是可分析的行為邏輯。對于產(chǎn)品本身而言，必須有相對應(yīng)的操作提示來引導(dǎo)用戶最有效地獲取信息，還原為實現(xiàn)層面就是明確、合理的操作入口。如果說首頁是整個網(wǎng)站的門戶，那么操作入口就是連接各個子頁面的樞紐。設(shè)計師的終極目的， 就是通過對這些樞紐的優(yōu)化讓用戶利用最有效的方式在最短時間內(nèi)完成自己的預(yù)期任務(wù)。

對于基于WEB的電子商務(wù)而言，核心價值是信息資源，而能否將這些海量數(shù)據(jù)合理地推送給用戶，則是產(chǎn)品生存的關(guān)鍵。操作入口的設(shè)計，甚至可以看做 “通過對引導(dǎo)方式的優(yōu)化間接達到對信息資源的歸類”——這很像圖書館中的書類標(biāo)簽管理，用戶可以根據(jù)不同的類目標(biāo)簽找到自己想看的書。失敗的操作入口所帶來的后果往往是災(zāi)難性的，功能失效、位置隱蔽、信息干擾……都會給用戶帶來嚴(yán)重的挫敗感，使其絕望地湮沒在茫茫的信息海洋中。所以，明確合理的操作入口設(shè)計，是對產(chǎn)品“有效性”的保障，更是對用戶體驗的尊重。

那么，在具體的設(shè)計中如何做到“操作入口明確”呢？

1、強化重點，弱化周邊

星爺《唐伯虎點秋香》中的精彩片段，一聲“美女”換來諸多牛鬼蛇神的壯觀回眸和秋香MM的驚鴻一瞥——“美女這東西是要需要比較地”。WEB產(chǎn)品也 一樣，尤其是海量信息的電子商務(wù)網(wǎng)站，由信息架構(gòu)衍生出的各類功能入口相當(dāng)復(fù)雜，部署在頁面的各個角落，一不留心就被疏漏。通常有兩種方法來解決這類問題：一是增加入口數(shù)量，即“廣撒網(wǎng)”，同樣的功能入口有多個，以此增加功能模塊的使用率，不過這種方法存在較大隱患，后面會詳細分析；二是“強化重點，弱化周邊”，即在視覺上將入口模塊凸顯出來，采用精妙的布局，并適當(dāng)弱化周邊的信息展示，加大二者的權(quán)重對比，客觀上增加用戶識別的準(zhǔn)確性。

例如地球人最熟悉的Google首頁：

www.google.com

濃郁藝術(shù)氣息的LOGO作為唯一的色彩元素有效地抓住了瀏覽者的視覺中心，輸入欄和Button作為功能核心占據(jù)了頁面的心臟位置，這種組合讓用戶 通過第一視覺便能夠準(zhǔn)確理解頁面所表達的信息邏輯——“輸入關(guān)鍵詞”+“點擊按鈕”=“Everything you want”。

再看一個反例，如圖：

download.pchome.net

面對這樣一個下載頁面，面對這樣一個搶眼的大Button（標(biāo)記②），相信即使是電信用戶，也會很大方地支持下網(wǎng)通……但是，點擊之后彈出的卻是下載遨游瀏覽器的窗口，崩潰之余再仔細查看，終于發(fā)現(xiàn)在華麗的廣告位旁邊蜷縮著一個毫無特色的“立刻下載”（標(biāo)記 ①）——剎那間，無數(shù)用戶被這種飽含“讓賢”哲理的設(shè)計深深震撼了！

2、入口信息明確易識別

上面提到，增加入口數(shù)量雖然在一定程度上有助于提高功能模塊的使用率，但也存在致命的缺陷——入口信息不明確。因為“入口”等同于用戶的“選擇”， 入口越多，選擇越多，“過多的選擇等于沒有選擇”，這勢必會造成用戶使用產(chǎn)品時的疑惑：這幾個鏈接和按鈕好像都一樣啊，該選哪個呢？所以，要根據(jù)頁面本身 的信息量嚴(yán)格控制同功能入口的數(shù)量，保證有效的識別性，讓用戶迅速找到正確的入口。

這次用我們可愛的兄弟產(chǎn)品“支付寶”為例，看看改版前后的細節(jié)變化：

改版前

改版后

通過對比，我們可以發(fā)現(xiàn)，管理頁面中部分相同功能的入口出現(xiàn)了多個，對于新手用戶來說，很可能造成不必要的困惑；而在新版本中，每個功能模塊只有一個入口，明晰簡潔。

另外，對于入口元素本身而言，需要通過適合的展現(xiàn)形式來提示用戶此入口的功能屬性。例如，一個標(biāo)準(zhǔn)的按鈕控件，用戶會知 道“可以點擊”，但點擊后會發(fā)生什么交互行為，需要通過其他視覺元素進行信息提示（如按鈕上的文字或者具有標(biāo)識性的ICON），告訴用戶當(dāng)前的情況和可行的操作方案，這點有些類似生活中的“指示設(shè)計”。

下圖是eBay首頁的注冊區(qū)，通過按鈕文字和輔助文本信息，新手用戶也能夠很清楚地了解眼前這兩個Button代表的意義。

www.ebay.com

3、根據(jù)用戶定制合適的入口

交互設(shè)計離開用戶研究便是閉門造車，在設(shè)計產(chǎn)品操作入口的同時，要充分考慮到不同用戶的需求。用戶劃分維度很多， 《About Face3.0》中根據(jù)與產(chǎn)品的相關(guān)度將其分為“新手”、“中間用戶”和“專家”。這三類用戶對產(chǎn)品的了解程度并不一致，操作行為習(xí)慣也大相徑庭，若再通 過其他維度將其細分（如“有無目的”、“性別年齡”等），會相當(dāng)復(fù)雜，在對產(chǎn)品進行進一步優(yōu)化時，應(yīng)當(dāng)考慮到操作入口對不同用戶的適用性。

“在交互和界面設(shè)計中，如何用同一個界面滿足新手用戶和專家用戶的需求是長久以來存在的難題之一。雖然大多數(shù)中間用戶傾 向于保留在這一類型中，但新手不會永遠是新手。要維持高水平的技術(shù)程度很困難，因此專家門也在快速變化。新手的變化更快，新手和專家隨著時間推移都會傾向 于成為中間用戶�！保ā禔bout Face 3.0》第三章），所以針對用戶的定性研究和定量分析會顯得尤為重要。不過，無論如何劃分用戶人群，有一點共性是至始至終的——產(chǎn)品操作入口設(shè)計的終極目 的是讓用戶迅速有效地完成核心需求。

小 結(jié)

綜上所述，對于信息龐雜的電子商務(wù)網(wǎng)站而言，出色的操作入口設(shè)計好似科幻片中的“星際之門”，能讓用戶隨心所欲地抵達任意空間，享受完美的交互體驗；同樣，失敗的設(shè)計也能讓用戶猶如墜入希臘神話中恐怖的克里特島迷宮，郁悶不可自拔�！安僮魅肟诿鞔_”，是所有優(yōu)秀交互產(chǎn)品的 共性之一，也是每一個設(shè)計師“想用戶之所想”的職責(zé)所在。

分享：網(wǎng)頁界面設(shè)計速成