唯美網頁設計

推薦五個採用視差特效網站

差滾動效果是網頁設計的趨勢。當您建立3D滾動效果時,網頁的背景以較慢的速度移動到前景。提供很好及微妙的深度元素,有助於產生一個獨特和令人難忘的網站。我們收集了一些採用該技術且產生很棒的效果網站。在某些情況下,視差滾動是特效的主軸; 此外它添增了一些層次感,讓前面的圖片有彈出移動的效果。

Firewatch

Firewatch遊戲網站,是採用視差滾動效果範例之一,使用六個移動層創造深度感。這效果的確很棒,因為沒有滾動延遲(通常伴隨著視差效應),而且只能在頁面頂部使用 – 網站的其他部分仍然可以讀取信息而不會有暈眩感。如果你想看這是如何做的,可以連結至CodePen參考。

Costa Coffee

這是令人印象深刻的高品質網站,該團隊以高質感的方式詮釋該網站,整體充滿了動畫插圖和互動元素的視覺豐富的視差特效。


Garden Studio

Garden Studio的例子,則是在網站上方以讓人愉悅的方式產生視差效果,然後再進入靜態的頁面,效果變化很微妙的卻不特別不顯眼。

Peugeot Hybrid4

車子大廠Peugeot網站採用視差滾動來自動播放漫畫。當您向下滾動頁面(或使用自動滾動的自動播放功能)時,就會有播放漫畫的作用,此特效有助於宣傳汽車製造商的新HYbrid4技術。

Jess & Russ

設計大師Russ Maschmeyer和Jessica Hische的婚禮網站不用懷疑充滿美麗浪漫的氣氛 。該網站繪製了他們浪漫的故事,並通過視差滾動來增加插圖的深度。他們在2012年結婚,但網站仍然值得一看。