在電視作品中，段落與段落、場(chǎng)景與場(chǎng)景之間的過(guò)渡或轉(zhuǎn)換，叫做轉(zhuǎn)場(chǎng)。為了使電視片內(nèi)容的條理性更強(qiáng)、層次的發(fā)展更清晰、在場(chǎng)面與場(chǎng)面之間的轉(zhuǎn)換中，需要一定的手法。

網(wǎng)站也是類似的，一個(gè)完整的網(wǎng)站由若干頁(yè)面組成，而每個(gè)頁(yè)面又由若干元素組成。為了使網(wǎng)站內(nèi)容的條理性更強(qiáng)、操作邏輯更清晰、用戶體驗(yàn)更好、用戶轉(zhuǎn)化率更高，在不同元素與頁(yè)面的轉(zhuǎn)換中，也需要一定的技巧。

過(guò)渡效果

a 漸入漸出

這種方式非常常見(jiàn)：比如在酷狗音樂(lè)盒中關(guān)閉音樂(lè)后，聲音在幾秒鐘內(nèi)逐漸停止，而不是馬上消失；凡客首頁(yè)廣告頭圖的輪換也采取了漸入漸出的方式。

b 過(guò)程示意

用動(dòng)態(tài)效果表示當(dāng)前進(jìn)度、處理過(guò)程或反饋結(jié)果。

· 當(dāng)前進(jìn)度：最常見(jiàn)的是進(jìn)度條效果，明確表現(xiàn)出當(dāng)前的進(jìn)度，減少用戶等待時(shí)的焦慮。

· 操作過(guò)程及反饋結(jié)果：

 比如刪除淘寶收藏夾中的商品，該商品會(huì)在逐漸向上滑動(dòng)的同時(shí)漸變消失。這個(gè)動(dòng)作清楚的表示正在刪除的過(guò)程和結(jié)果，而不用再另外提示用戶刪除成功。

優(yōu)眾網(wǎng)的收藏提示，則是一段小星星的動(dòng)畫。

· 視覺(jué)引導(dǎo)：在凡客誠(chéng)品的客戶端中，把商品加入到購(gòu)物車時(shí)的引導(dǎo)動(dòng)畫，既表現(xiàn)了添加的過(guò)程及完成這一操作的反饋結(jié)果，又間接提示了購(gòu)物車的位置，一舉兩得。

c 過(guò)渡動(dòng)畫

 當(dāng)頁(yè)面元素產(chǎn)生變化的時(shí)候，最好能有一些過(guò)渡效果。比如畫面的漸變切換、下拉列表的動(dòng)態(tài)伸展、浮層的逐漸消失等等。突然的變化會(huì)給人生硬的感覺(jué)。

舉個(gè)有趣的小例子：淘寶的收藏夾，鼠標(biāo)滑過(guò)時(shí)，原先的下三角會(huì)旋轉(zhuǎn)180°成為上三角。

d 360度旋轉(zhuǎn)產(chǎn)品

 用戶在網(wǎng)上購(gòu)物時(shí)，希望能夠盡可能多的了解商品的外觀，360°旋轉(zhuǎn)功能更好的滿足了這個(gè)需求。其實(shí)這種方式很早就有了，但是一直沒(méi)怎么普及。

頁(yè)面跳轉(zhuǎn)

頁(yè)面跳轉(zhuǎn)（無(wú)論是原頁(yè)面刷新還是新開(kāi)窗口）給用戶帶來(lái)停頓感，影響用戶體驗(yàn)。

a 避免頻繁翻頁(yè)

翻頁(yè)可以適當(dāng)減輕閱讀的疲勞感，增加一點(diǎn)點(diǎn)的成就感，且賦予內(nèi)容更明顯的物理位置（反復(fù)查找比較容易）。但是它畢竟在一定程度上打斷了我們的閱覽（尤其當(dāng)網(wǎng)速很抱歉的時(shí)候），這可能導(dǎo)致用戶提前離開(kāi)。因此在一些內(nèi)容關(guān)聯(lián)性不強(qiáng)的網(wǎng)站上，可以嘗試適當(dāng)減少翻頁(yè)的次數(shù)——最簡(jiǎn)單的方式是增加一頁(yè)的顯示數(shù)量，但要考慮用戶的承受極限（不同的產(chǎn)品情況不同，需要酌情考慮）。

比如新浪微博的頁(yè)面很長(zhǎng)，當(dāng)滾動(dòng)到底部時(shí)，會(huì)立刻加載后面的內(nèi)容（快到幾乎感覺(jué)不到）。如此反復(fù)幾次，才會(huì)看到頁(yè)面底部的翻頁(yè)組件。

一些新興的電子商務(wù)網(wǎng)站甚至沒(méi)有傳統(tǒng)的翻頁(yè)組件，整個(gè)頁(yè)面一氣呵成。比如優(yōu)眾網(wǎng)，使用滾輪或上下方向鍵就可以繼續(xù)瀏覽商品。

b 避免立即跳轉(zhuǎn)

對(duì)于一個(gè)操作流程來(lái)說(shuō)，每多一個(gè)頁(yè)面，就會(huì)增加用戶的流失率。而點(diǎn)擊鏈接就意味著一定要刷出一個(gè)新頁(yè)面嗎？看看下面這些緩兵之計(jì)吧。

標(biāo)簽： 交互設(shè)計(jì) 網(wǎng)頁(yè)設(shè)計(jì) WEB設(shè)計(jì) 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。