縱觀交互規(guī)劃開(kāi)展史，即是立異的交互形式被廣為承受后變成規(guī)范，舊的交互形式不斷被篩選的前史。所以交互形式開(kāi)展也是一個(gè)“物競(jìng)天擇，優(yōu)勝劣汰”的進(jìn)程。
　　交互規(guī)劃是一個(gè)創(chuàng)造性的作業(yè)，運(yùn)用立異的方法美麗地處理商品疑問(wèn)，是一個(gè)交互規(guī)劃師價(jià)值的表現(xiàn)。當(dāng)立異的交互規(guī)劃被用戶認(rèn)可、被業(yè)界同行學(xué)習(xí)，更是一種無(wú)窮的工作滿足感。這種立異紛歧定是驚天地泣鬼神的革命性規(guī)劃，一個(gè)小小的交互組件的立異就能夠讓商品體會(huì)增色不少。

　　一、翻滾條的立異【重構(gòu)法】

　　我們先來(lái)回想一下閱覽PDF文檔的兩種翻滾方法：1、手型東西拖動(dòng) 2、翻滾條。

　　要翻看后邊的信息，用手型東西向上拖動(dòng)，用翻滾條則是向下拖動(dòng)，兩種操作方法的原理是什么呢?

　　把文檔分紅可視區(qū)域A和全體區(qū)域B。翻滾條滑塊對(duì)應(yīng)的是文檔的可視區(qū)域A。因此翻滾條拖動(dòng)的是可視區(qū)域A，而手型東西拖動(dòng)的是全體區(qū)域B，兩種操作方法拖動(dòng)的主體紛歧樣，所以方向恰好相反。

　　翻滾條能夠理解為文檔在筆直方向上的縮略圖，滑塊能夠表明可視區(qū)域當(dāng)時(shí)方位，可視區(qū)域占全體區(qū)域的份額。跟著文檔全體區(qū)域不斷增高，可視區(qū)域所占的份額越小，因此滑塊高度不斷變小。計(jì)算過(guò)IE、FF、Office等常用軟件，通�；瑝K高度到8px時(shí)就不再縮小。當(dāng)滑塊高度只剩8px時(shí)，翻滾條的拖動(dòng)體會(huì)就適當(dāng)?shù)牟睢?br />
　　Google wave對(duì)翻滾條做了斗膽的立異。

　　1、 上下按鈕與滑塊連在一起(優(yōu)點(diǎn)：從滑塊到上下按鈕的鼠標(biāo)運(yùn)動(dòng)間隔變短;疑問(wèn)：點(diǎn)擊上下按鈕，滑塊無(wú)法跟隨運(yùn)動(dòng))

　　2、 翻滾條的滑塊高度固定不變(優(yōu)點(diǎn)：處理了滑塊極小的疑問(wèn);疑問(wèn)：無(wú)法表明可視區(qū)域的份額)

　　這兩處修正優(yōu)化了傳統(tǒng)翻滾條的疑問(wèn)，卻導(dǎo)致翻滾條基本特點(diǎn)(“方位”與“份額”)疑問(wèn)。為處理導(dǎo)致的新疑問(wèn)，谷歌 wave的翻滾條引入了兩個(gè)新元素：

　　1、 半透明灰色塊 (點(diǎn)擊上下按鈕，滑塊無(wú)法跟隨運(yùn)動(dòng)，則半透明灰色塊運(yùn)動(dòng)——處理方位疑問(wèn))

　　2、 停止條 (wave內(nèi)容不斷增多，停止條方位不斷向下，用來(lái)表明內(nèi)容全體高度——處理份額疑問(wèn)。惋惜這個(gè)停止條視覺(jué)效果讓人以為是可拖動(dòng)的，簡(jiǎn)略導(dǎo)致疑問(wèn)。)

　　Google Wave花了這么大心思立異翻滾條，也面臨著翻滾條復(fù)雜化后導(dǎo)致的用戶習(xí)氣疑問(wèn)。自己認(rèn)為這個(gè)翻滾條立異是因商品需求而做的，wave一個(gè)頁(yè)面也許一起存在4個(gè)翻滾條，當(dāng)4個(gè)傳統(tǒng)翻滾條一起出如今一個(gè)頁(yè)面上效果可想而知。Wave翻滾條不管視覺(jué)仍是交互上都是很“輕”的規(guī)劃，與商品全體上還算恰當(dāng)。

　　====================================================

　　蘋果對(duì)翻滾條的改善則簡(jiǎn)略有用：加錨點(diǎn)。

　　mac官網(wǎng)： 加錨點(diǎn)橫向翻滾條，點(diǎn)擊錨點(diǎn)，滑塊翻滾到相應(yīng)方位

　　iphone音樂(lè)專輯列表：加錨點(diǎn)的翻滾條，輕觸字母，列表翻滾到相應(yīng)方位

　　加錨點(diǎn)的方法讓翻滾條增加了導(dǎo)航和準(zhǔn)確定位功用，變得愈加易用。

　　二、組合查找框的立異 【組合法】

　　多見(jiàn)的帶條件查找框是“輸入框+下拉菜單+按鈕”三個(gè)控件構(gòu)成的，適宜的控件組合能夠帶來(lái)非常好的效果。

　　1、【輸入框+下拉菜單】組合
　　新浪微博的查找框，將下拉選項(xiàng)融合到輸入框提示里，挑選查找規(guī)模的操作愈加便當(dāng)。

　　

#p#分頁(yè)標(biāo)題#e#



　　Google reader這么的帶輸入操作的下拉菜單，讓下拉菜單愈加易用。(這種控件組合在word、photoshop等軟件里很多見(jiàn)，如字體挑選控件)

　　2、【按鈕+下拉菜單】組合


　　豆瓣與Flickr的查找按鈕后邊加了一個(gè)下拉箭頭，按鈕與下拉挑選操作合二為一 (flickr這個(gè)規(guī)劃與它網(wǎng)站主導(dǎo)航條體會(huì)共同，豆瓣用這種規(guī)劃在其整站看來(lái)則略顯突兀)
　　三、文件上載組件的立異 【瘦身法】

　　規(guī)范的文件上載組件是由“輸入框(偽)+閱覽按鈕+提交按鈕”構(gòu)成。之說(shuō)以稱之為“偽輸入框”是由于它首要承當(dāng)顯示文件途徑的效果，所以Firefox下點(diǎn)擊這個(gè)輸入框是開(kāi)端文件挑選操作，chrome更是把偽輸入框改造成了按鈕，復(fù)原控件最初始的效果。

　　運(yùn)用規(guī)范文件上載組件常常會(huì)呈現(xiàn)兩個(gè)提交按鈕，最常常的誤操作即是：選完文件后，直接點(diǎn)擊“保存頭像設(shè)置”，所以杯具了。

　　Gmail附件上載的規(guī)劃對(duì)文件上載組件做了兩次瘦身手術(shù)。

　　曩昔的gmail附件上載過(guò)程是：1、點(diǎn)擊“增加附件”(點(diǎn)擊后呈現(xiàn)一個(gè)不帶提交按鈕的上載組件)，2、挑選文件(選完后主動(dòng)開(kāi)端上載)。去掉了那個(gè)提交按鈕。


　　如今的gmail附件上載過(guò)程是：1、點(diǎn)擊“增加附件”(點(diǎn)擊后主動(dòng)開(kāi)端上載，且有上載進(jìn)度條)。去掉了輸入框和提交按鈕，只剩下一個(gè)閱覽按鈕，上載只需求一次點(diǎn)擊操作。

　　四、翻頁(yè)的立異 【代替法】

　　傳統(tǒng)的翻頁(yè)方法是“上一頁(yè)+頁(yè)碼+下一頁(yè)”，我們最了解的規(guī)劃。

　　Bing圖像查找

　　Google reader

　　看圖購(gòu)

　　而近年鼓起的這種“無(wú)盡翻滾翻頁(yè)”的翻頁(yè)方法，即翻滾條拖動(dòng)到最底部后開(kāi)端加載后邊的內(nèi)容，而不再有“上一頁(yè)+頁(yè)碼+下一頁(yè)”這么的連接。

　　相對(duì)而言twitter、Iphone app store這么的“遞進(jìn)式翻頁(yè)”則沒(méi)那么急進(jìn)，保留了一個(gè)翻頁(yè)按鈕，是介于傳統(tǒng)翻頁(yè)與無(wú)盡翻滾翻頁(yè)的一種折中方法。


　　這兒講到的翻頁(yè)組件立異，是用新的翻頁(yè)方法代替?zhèn)鹘y(tǒng)翻頁(yè)組件。從信息的構(gòu)造來(lái)看，傳統(tǒng)翻頁(yè)是將信息分段，而“無(wú)盡翻滾翻頁(yè)”歸于信息翻滾。這兩種方法對(duì)應(yīng)現(xiàn)實(shí)生活中的原型是：書本和電影膠片，書本把信息拆分到每頁(yè)里去翻動(dòng)，電影膠片的信息則一幀幀的翻滾而過(guò)。


　　從信息活動(dòng)速度和翻頁(yè)便當(dāng)性來(lái)看，“信息翻滾”遠(yuǎn)遠(yuǎn)大于“信息分段”。這兩種翻頁(yè)方法應(yīng)當(dāng)怎么挑選?我想這應(yīng)當(dāng)取決于用戶對(duì)后邊內(nèi)容的需求強(qiáng)度，像谷歌查找成果頁(yè)這種越往后信息質(zhì)量越低的場(chǎng)景，用戶對(duì)翻頁(yè)需求并不那么激烈。Google reader這么不是按信息質(zhì)量排序的場(chǎng)景，供給高速的翻頁(yè)方法是個(gè)相對(duì)必要的做法。需求留意的是，翻滾翻頁(yè)不利于內(nèi)容準(zhǔn)確定位和信息回溯。#p#分頁(yè)標(biāo)題#e#

　　信息活動(dòng)速度對(duì)信息承受者心態(tài)有很大影響，活動(dòng)速度越快信息吸收量相對(duì)越小，所以閱覽pdf文檔比閱覽紙質(zhì)書本心情煩躁，不由得去翻頁(yè)，是在“掃描”而不是“閱覽”(自己片面感觸，如有雷同純屬必然)

　　由此也延伸出一點(diǎn)，交互規(guī)劃師的作業(yè)責(zé)任除了架構(gòu)信息，還應(yīng)當(dāng)操控信息的活動(dòng)速度和供給量。