話說(shuō)土匪老濕在他的大作 《交互設(shè)計(jì)之回歸篇》 里曝光了上次有意思小組競(jìng)賽我們小組分享的話題 “瞬間的快感”，但這一極具噱頭的主題，土匪老濕惜字如金只用了廖廖幾字作了歸納…汗，字?jǐn)?shù)沒(méi)夠，字?jǐn)?shù)沒(méi)夠。。。以下我將采用圖文并茂的方式來(lái)說(shuō)明我們的觀點(diǎn)。

在第一個(gè)瞬間，也就是當(dāng)一位瀏覽者剛剛打開(kāi)我們網(wǎng)站的時(shí)候，他最先可能是想看看這個(gè)網(wǎng)站的名字及其功能; 而下一個(gè)瞬間可能就開(kāi)始移動(dòng)手中的小鼠標(biāo)到自已感興趣的東西上點(diǎn)點(diǎn)。再然后則可能是尋找從哪里注冊(cè)等等。然而在這些瞬間中怎么樣才能讓瀏覽者找到快感，提升他的滿意度呢？

1、按鈕的鼠標(biāo)按下?tīng)顟B(tài)

我們知道按鈕有未動(dòng)作、鼠標(biāo)經(jīng)過(guò)、鼠標(biāo)按下、彈起四種狀態(tài)，但是現(xiàn)在大多數(shù)網(wǎng)站的按鈕都只設(shè)計(jì)了未動(dòng)作、鼠標(biāo)經(jīng)過(guò)這兩種狀態(tài)，其中更有不管你小鼠標(biāo)怎么蹂躪它都只有一種狀態(tài)者。這里我不是說(shuō)這些做法不好，只是覺(jué)得如果我們?cè)谠O(shè)計(jì)的時(shí)候加上鼠標(biāo)按下?tīng)顟B(tài)會(huì)提升瀏覽者的滿意度，讓他們?cè)邳c(diǎn)擊之中獲得快感。就像我們平常進(jìn)行的開(kāi)關(guān)燈操作一樣，當(dāng)手指放在開(kāi)關(guān)面板上按下，伴隨著“啪”這個(gè)輕脆聲音，開(kāi)關(guān)被按下，燈亮了。

上圖中百度一下的鼠標(biāo)按下?tīng)顟B(tài)加深了顏色，google搜索則直接將底色置灰，從視覺(jué)上給了瀏覽者最直觀的感受這個(gè)按鈕我按下了。

2、鼠標(biāo)經(jīng)過(guò)也可以這樣

我們?cè)谠O(shè)計(jì)的時(shí)候，為了讓瀏覽者更好的理解文字表述的含義或當(dāng)前所處的狀態(tài)都會(huì)給文字配上相應(yīng)的一個(gè)icon，當(dāng)鼠標(biāo)經(jīng)過(guò)的時(shí)候通常的做法就是直接改變顏色和改變一下方向。但是淘寶首頁(yè)處理極具創(chuàng)新，原來(lái)鼠標(biāo)經(jīng)過(guò)也可以這樣。

ps:以上效果用Firefox 或 chrome 查看
上圖中搜索后面的小三角在未動(dòng)作的是指向下方的，當(dāng)鼠標(biāo)經(jīng)過(guò)的時(shí)候小三角順時(shí)鐘旋轉(zhuǎn)180度指向下方，鼠標(biāo)離開(kāi)后逆時(shí)針旋轉(zhuǎn)180回到原位;淘寶天下前面的icon在鼠標(biāo)經(jīng)過(guò)的時(shí)候順時(shí)針旋轉(zhuǎn)35度，鼠標(biāo)離開(kāi)后逆時(shí)針旋轉(zhuǎn)35度回到原位。這種處理方式讓瀏覽者擺脫了枯燥的瀏覽，這個(gè)瞬間心情愉悅。

3、彈出層也有新花樣

彈出層是我們?yōu)g覽網(wǎng)頁(yè)時(shí)經(jīng)常會(huì)遇到的東東，它的好處我就不說(shuō)了，這里我提出來(lái)是想說(shuō)說(shuō)它們出現(xiàn)和消失的方式。通常的作法是當(dāng)瀏覽者觸發(fā)之后給一個(gè)半透明遮罩層，彈出層與之一同出現(xiàn)。迅雷7就來(lái)了一個(gè)新花樣。

上圖中當(dāng)我們點(diǎn)擊皮膚設(shè)置（黃色小衣服）按鈕之后，會(huì)看到時(shí)皮膚主題這個(gè)彈出層以180度水平旋轉(zhuǎn)這個(gè)“高難度動(dòng)作”登場(chǎng)，當(dāng)我們點(diǎn)擊關(guān)閉按鈕時(shí)，它又以放大加漸隱“風(fēng)騷”離去。和平常彈出層直來(lái)直往的方式相比，讓我們?cè)谀且凰查g感受到愉快、興奮。當(dāng)然并不是所有的彈窗加上這樣的效果就會(huì)提升滿意度，效果的加強(qiáng)伴隨而來(lái)的是過(guò)程時(shí)間的增加，在這里需要處理好的是平衡性的問(wèn)題，在枯燥的一系列操作中，動(dòng)態(tài)效果的點(diǎn)綴會(huì)使人眼前一亮，頻繁的濫用只會(huì)產(chǎn)生視覺(jué)疲勞。

除了上面所說(shuō)的按鈕、鼠標(biāo)經(jīng)過(guò)的狀態(tài)、彈出層還有很多細(xì)節(jié)比如：下拉菜單出現(xiàn)的方式可以由淺變深、由小變大等等，我這里就不一一列舉了。每一個(gè)細(xì)節(jié)，每一個(gè)瞬間都有可能加強(qiáng)也可能摧毀瀏覽者對(duì)某個(gè)產(chǎn)品或公司的信心。我們?cè)诠ぷ髦袘?yīng)該注重每一個(gè)交互細(xì)節(jié)，它們對(duì)于完整的用戶(hù)體驗(yàn)來(lái)說(shuō)，都是不可或缺的一部分。只有不斷的改進(jìn)創(chuàng)新，才能提升用戶(hù)的滿意度。

最后借用書(shū)上的一句話“良好的用戶(hù)體驗(yàn)，全在于那些完美的瞬間?！?以上表達(dá)了我個(gè)人對(duì)細(xì)節(jié)提升用戶(hù)滿意度方面的一些理解，水平有限，不足處，歡迎指正。

原文：http://www.xmued.com/?p=1561