什么是滾動(dòng)視差?視差滾動(dòng)(Parallax Scrolling)是指讓多層背景以不同的速度移動(dòng)，形成立體的運(yùn)動(dòng)效果，帶來非常出色的視覺體驗(yàn)。

視差滾動(dòng)原本是一個(gè)天文術(shù)語，而現(xiàn)在在網(wǎng)頁設(shè)計(jì)中，視差設(shè)計(jì)的驚艷表現(xiàn)，讓視差設(shè)計(jì)的網(wǎng)站收到熱捧，而視差設(shè)計(jì)的創(chuàng)意通過網(wǎng)頁的長度發(fā)生不同應(yīng)對(duì)的動(dòng)畫，可以說是相當(dāng)不錯(cuò)的。

下面來看這個(gè)例子：（點(diǎn)擊圖片查看網(wǎng)站效果）

這個(gè)設(shè)計(jì)中，通過U盤不斷的移動(dòng)，從手中掉落，插入手機(jī)，放入口袋，使得整個(gè)產(chǎn)品的使用方式在瀏覽完成整個(gè)網(wǎng)站之后得以非常直觀的呈現(xiàn)在用戶面前，而后面的背景滾動(dòng)的方式也盡不相同，使得整個(gè)網(wǎng)站在上線之初所獲得的驚艷和創(chuàng)意大受贊譽(yù)！

我們?cè)賮砜纯瓷倌昱傻墓倬W(wǎng)：

少年派的視差滾動(dòng)可謂和電影一樣驚心動(dòng)魄！ 視差滾動(dòng)讓整個(gè)故事非常震撼的重現(xiàn)在我們的眼前，多場景，純色的大膽運(yùn)用，表達(dá)出的意味也非常的棒。

滾動(dòng)視差網(wǎng)站時(shí)一個(gè)隨著滾動(dòng)不斷變化的，所以設(shè)計(jì)時(shí)與傳統(tǒng)網(wǎng)頁有很多不同。在設(shè)計(jì)初期設(shè)計(jì)師要判斷這個(gè)頁面適不適合采用滾動(dòng)視差。在決定采用滾動(dòng)視差之后就需要設(shè)計(jì)者整理現(xiàn)有的內(nèi)容資料，將其故事化或場景化，然后根據(jù)構(gòu)思設(shè)計(jì)出關(guān)鍵狀態(tài)的視覺設(shè)計(jì)稿，在重構(gòu)設(shè)計(jì)師實(shí)現(xiàn)的時(shí)候通常并不會(huì)一帆風(fēng)順，通常會(huì)因?yàn)閷?shí)現(xiàn)成本等各種問題需要設(shè)計(jì)師返回去重新修改設(shè)計(jì)稿。通過反復(fù)的溝通，反復(fù)的磨合才能完成預(yù)想中的漂亮的滾動(dòng)視差網(wǎng)站。

讓我們?cè)诳纯雌渌膸讉€(gè)視差滾動(dòng)的網(wǎng)站案例：

滾動(dòng)視差設(shè)計(jì)中的一些細(xì)節(jié)：

1. loading 。

滾動(dòng)視差網(wǎng)站由于內(nèi)容分層會(huì)用到很多大尺寸圖片或者png圖片，所以往往比較大，所以這個(gè)時(shí)候千萬別忘了設(shè)計(jì)loading動(dòng)畫。

2. 斜線的運(yùn)用。

當(dāng)斜線從底部向上劃入的時(shí)候，通常視覺上會(huì)給人一種是從右下角以一定角度劃入的錯(cuò)覺。所以斜線的布局也經(jīng)常被采用在滾動(dòng)視差網(wǎng)站的設(shè)計(jì)中去。

3.純色的運(yùn)用

沒有比純色的背景更直觀更簡潔。純色可以有很多種表達(dá)方式

純色比漸變和圖片更容易延展，并且純色很容易區(qū)分視差區(qū)間。

一個(gè)視覺設(shè)計(jì)其實(shí)做設(shè)計(jì)的時(shí)候有很多束縛，能夠遇到一個(gè)可以玩滾動(dòng)視差的項(xiàng)目不容易，遇到了就不要輕易放掉，好好玩一把，它會(huì)讓你的設(shè)計(jì)增色不少。