起點(diǎn)課堂會(huì)員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會(huì)特權(quán)
個(gè)人IP打造特權(quán)
30+門專項(xiàng)技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會(huì)員專屬社群
榮耀標(biāo)識連續(xù)性的設(shè)計(jì)——改善產(chǎn)品的體驗(yàn)
“當(dāng)一個(gè)人過馬路的時(shí)候，他在斑馬線上是從馬路的一端，走到另一端?！?/strong>
· 我們可以觀察到這個(gè)過程的變化。
“種子、發(fā)芽、最后開花。”
· 種子到開花的過程我們很少會(huì)看到，那是因?yàn)樗淖兓俣群苈枰獛字苌踔粮L的時(shí)間。
· 而這個(gè)過程通過監(jiān)拍攝像機(jī)快速回放時(shí)，我們也可以看到過程的變化。
…
現(xiàn)實(shí)世界中，我們所感知的事物變化，都是連續(xù)的。
相反
人們制造的科技產(chǎn)品中，卻存在很多不連續(xù)的體驗(yàn)，比如街邊的紅綠燈、飲料機(jī)…；
在計(jì)算機(jī)網(wǎng)絡(luò)中，網(wǎng)頁的設(shè)計(jì)也存在不連續(xù)的問題。
需要關(guān)注的
在設(shè)計(jì)一個(gè)互聯(lián)網(wǎng)產(chǎn)品的時(shí)候，不僅僅只是考慮界面上的圖形表現(xiàn)、布局排版… 其實(shí)還需要考慮到體驗(yàn)的連續(xù)性。我們應(yīng)該關(guān)注細(xì)節(jié)，每個(gè)可操作的環(huán)節(jié)。設(shè)計(jì)師們（產(chǎn)品、交互、視覺設(shè)計(jì)…）都應(yīng)該確保每時(shí)每刻產(chǎn)品的體驗(yàn)都是完美的。
現(xiàn)實(shí)中的連續(xù)
“門在打開/關(guān)閉時(shí)”，我們可以觀察到它的變化的。
關(guān)閉的門 > 打開的門 。過程：從下往上收起。
實(shí)際的例子，這里是騰訊大廈某一樓層：
過程：從中間往左右收起。
以上例子中，我們可以觀察到：門什么時(shí)候打開；什么時(shí)候可以進(jìn)去。
現(xiàn)實(shí)中的斷續(xù)
“自動(dòng)投幣飲料機(jī)，它的操作讓人感知是斷續(xù)的?！?/strong>
飲料機(jī)的操作步驟：投幣 > 選擇飲料 > 拿到飲料
以上例子中，我們只能通過聲音判斷機(jī)器是否正在運(yùn)作。
如果不再聽到機(jī)器運(yùn)作的聲音；等了很長時(shí)間，飲料還沒有出來；那是在說飲料被卡住了？機(jī)器壞了？
“紅綠燈”
紅燈表示停車
綠燈表示通行
駕車在十字路口，我們經(jīng)常會(huì)發(fā)現(xiàn)等紅燈的人多數(shù)時(shí)候會(huì)在綠燈亮?xí)r沒注意到，而受到的困擾是后面的車會(huì)不斷地鳴笛，直到前方的人意識到綠燈已經(jīng)亮起，可以通行。
發(fā)生這個(gè)問題在于紅燈到變換綠燈的過程，是沒有任何過渡或提醒的。大部分都是直接變換。
同樣，騰訊大廈的電梯間，沒有人可以知道這個(gè)電梯什么時(shí)候到達(dá)該樓層。當(dāng)想上、下樓時(shí)，等待電梯到達(dá)是一個(gè)很漫長的時(shí)間，我試過在中午高峰時(shí)期等了半小時(shí)，最后放棄改走樓梯。
這里的問題也類似紅綠燈：等待電梯到達(dá)的過程沒有明確的提示，不知道什么時(shí)候哪一部電梯會(huì)到達(dá)。甚至是電梯發(fā)生了故障到不了，也不知道。等待時(shí)間過長，容易讓人產(chǎn)生焦慮。
網(wǎng)頁中的連續(xù)
flickr批量管理的界面
(訪問?http://www.flickr.com/photos/organize)
Qzone照片上傳界面
(訪問?Qzone 的相冊>上傳照片)
Qzone個(gè)人中心動(dòng)態(tài)
(訪問?Qzone 的個(gè)人中心)
以上的例子中，用戶在感知這些變化的過程時(shí)，可以預(yù)知到將發(fā)生什么變化。
此外，在Flickr批量管理的界面中可以發(fā)現(xiàn)，除了等待過程的動(dòng)態(tài)效果，更多的是，在鼠標(biāo)經(jīng)過可操作的位置時(shí)，動(dòng)態(tài)效果暗示著區(qū)域中有可操作的元素，同時(shí)也暗示著如何去操作。
網(wǎng)頁中的斷續(xù)
Qzone導(dǎo)航項(xiàng)切換的時(shí)候
(訪問?Qzone 的日志)
QQ農(nóng)場偷菜
(訪問?Qzone 的個(gè)人中心>QQ農(nóng)場)
有時(shí)候單擊偷菜，沒有反應(yīng)；重復(fù)單擊很多次… 依然顯示“可摘”。
以上的例子中，缺少等待過程的提示，容易產(chǎn)生誤會(huì)，造成重復(fù)的單擊操作。
連續(xù)的好處
· 不打斷用戶的任務(wù)流──每個(gè)人都希望他的目標(biāo)可以實(shí)現(xiàn)；用戶在每選擇一個(gè)操作時(shí)都希望當(dāng)前的任務(wù)是連貫的。
· 讓產(chǎn)品設(shè)計(jì)更貼心，提高易用性
斷續(xù)導(dǎo)致的問題
· 斷續(xù)會(huì)讓人沒有預(yù)期、無法預(yù)知結(jié)果。
· 面對自動(dòng)售賣機(jī)會(huì)憤怒、等待紅綠燈會(huì)不知所措、等電梯時(shí)焦慮…
· 網(wǎng)頁還沒有打開，重復(fù)點(diǎn)擊刷新。等待時(shí)間太長，離開網(wǎng)站。
· 網(wǎng)站的高級功能不知道怎么用
…
網(wǎng)頁中為什么會(huì)產(chǎn)生斷續(xù)的界面？
網(wǎng)頁的后臺運(yùn)作就好像變魔術(shù)一樣：
1. 用戶激發(fā)一個(gè)操作 ── 鼠標(biāo)單擊一個(gè)超鏈接，從導(dǎo)航上的主頁切換到日志
2. 發(fā)送一個(gè)請求到服務(wù)器 ── 服務(wù)器收到請求，處理，返回結(jié)果
3. 返回一個(gè)結(jié)果給到用戶 ── 頁面內(nèi)容刷新了
單從技術(shù)層面把內(nèi)容呈現(xiàn)給用戶時(shí)，則只會(huì)有1、3；斷續(xù)的原因在于，2沒有呈現(xiàn)給用戶。
如何改善這樣的斷續(xù)變成連續(xù)？
簡單來說，讓“過程”有“提示”動(dòng)畫。
這些過程包括：
· 鼠標(biāo)經(jīng)過
· 鼠標(biāo)單擊
· 鍵盤
等操作行為，包括現(xiàn)在的觸摸屏設(shè)備。
“提示”動(dòng)畫
Gmail郵箱載入界面
等待過程采用動(dòng)畫的進(jìn)度形式，減少用戶的焦慮；
等待時(shí)間過長時(shí)有其他的選項(xiàng)，使得產(chǎn)品更貼心。
什么時(shí)候需要提示？
對于網(wǎng)頁中的時(shí)間，大家比較認(rèn)可的方式：
0.1 秒 在該時(shí)間內(nèi)顯示反饋結(jié)果用戶是可以接受的。
1.0 秒 是用戶保持不間斷的思維流的限定時(shí)間，用戶會(huì)注意到這樣的延遲。
10 秒 是保持用戶關(guān)注當(dāng)前對話框的極限時(shí)間。
·如果沒有特別的信息反饋超過0.1而少于1秒，他們會(huì)比較難以忍受。
·對于長時(shí)間的延遲，用戶會(huì)想在等待完成期間處理其它事務(wù)。所以需要顯示將要完成的時(shí)間（通常選擇進(jìn)度條或百分比來表示），不然用戶期待會(huì)大打折扣。
什么時(shí)候需要?jiǎng)赢嫞?/strong>
· 隱喻的操作──文字鏈、按鈕、某個(gè)操作區(qū)域（鼠標(biāo)經(jīng)過高亮突出可點(diǎn)擊）…
· 等待的過程
· 操作的結(jié)果──下拉列表菜單單擊后展開的抽屜列表、拖動(dòng)后的位置、刪除后將會(huì)消失…
另外一個(gè)特別的例子：
Mac OSX系統(tǒng)中，最小化窗口時(shí)，反應(yīng)了操作的結(jié)果，最小化窗口的位置在哪里：
動(dòng)態(tài)中的微妙設(shè)計(jì)
Android（htc sense）
單擊、選中都采用綠色高光的動(dòng)態(tài)效果。單擊某個(gè)項(xiàng)目后，動(dòng)態(tài)效果暗示著已經(jīng)激活并運(yùn)行了這個(gè)項(xiàng)目。
我經(jīng)常有這樣的煩惱：
“我明明點(diǎn)了，怎么沒反應(yīng)？”，重復(fù)單擊嘗試。—— 用戶經(jīng)常不確定是否已經(jīng)激活了
缺少選項(xiàng)激活過程的提示──沒有一個(gè)動(dòng)態(tài)效果告知用戶：系統(tǒng)正在處理請求。
Ipod
單擊、選中都采用藍(lán)色高光的效果。表面上看，和android的操作效果毫無區(qū)別。
單擊音樂播放，這個(gè)過程偶爾需要花點(diǎn)時(shí)間等待，它將選中的效果一直呈現(xiàn)。
選中狀態(tài)的保留，隱喻了選項(xiàng)被激活── 使用中發(fā)現(xiàn)，將單擊的效果保留可以避免誤會(huì)。
不用冗余的激活過程提示──大多數(shù)人并不會(huì)覺得有延遲。一般情況下，加載過程只在幾秒之間（可接受的范圍）。
如何改善我們的產(chǎn)品？
紅綠燈例子中，在紅燈到綠燈的過程，添加以下某種方式：
1.最后幾秒會(huì)閃爍
2.加上倒計(jì)時(shí)
3.利用聲音快慢來告知，也方便了盲人
4.沙漏的形式
Qzone導(dǎo)航項(xiàng)切換的例子，可以添加等待過程的提示，避免用戶重復(fù)點(diǎn)擊或等待時(shí)間過長離開。
還有很多需要我們一起思考、探討的，如何讓產(chǎn)品體驗(yàn)更貼心…
來源：http://www.shupianhui.com/?p=297
- 目前還沒評論，等你發(fā)揮！
