20個以細膩動畫取勝的優(yōu)秀網(wǎng)頁設計

目前很多網(wǎng)頁設計已經(jīng)運用新的HTML5視頻以及CSS3+JS來實現(xiàn)很棒的動畫效果，不過我們在使用動畫時也不能太弦，可以適當?shù)牟⑶矣幸饬x的去使用，這才不會分散網(wǎng)站訪客的注意力。

　　網(wǎng)頁設計中如何合理使用動畫效果呢?

　　我們可以參考圖趣網(wǎng)整理的20個融合細微動畫的優(yōu)秀網(wǎng)頁設計作品，這些網(wǎng)頁使用了簡單并不復雜的動畫效果，在擁有好看界面同時用戶也不會被無關的動畫而分心。建議谷歌/火狐瀏覽器打開。

　　AQUATILIS EXPEDITION

　　使用了HTML5視頻作為網(wǎng)頁背景，視頻內(nèi)容為簡單的波浪動畫，網(wǎng)站整體為暗調風格，其中有個邊框背景不錯，可以借鑒下：)

　　Little Forge

　　BarCamp Omaha 2014

　　這網(wǎng)站的動畫僅僅是背景上的云彩，但里面的插畫相當好看，so… 網(wǎng)頁設計師還是要學習點繪畫功能更好。

　　WILD

　　Nerisson

　　Dragone

　　這個背景banner動畫只是一些雨滴效果，但去能讓氣氛更加融合呦。

　　Blu Homes

　　LETTERS, INC.

　　Omnisense

　　INDUSTRY

　　雪山?哪就為它加雪吧!

　　The Beauty of Brewing

　　首屏動畫和上面雨滴案例差不多，為了讓情景更生動一些。此外，這網(wǎng)站的圖片虛實技巧的使用可以多看看。

　　Bicycle Speed Shop

　　Thermodo

　　Bellroy

　　這個網(wǎng)站的產(chǎn)品處理很特別，都給它們加上雨水、雪、冰碎來增加真實感，也能體現(xiàn)產(chǎn)品“防水防雪防沙”功效?

　　Siberia

　　云霧動畫用得很好，能過banner文字來做出空間感。

　　Carbure Digital Workshop

　　里面的圖標可以用鼠標拖動……

　　The Fernway

　　High Tide

　　有高潮，才HIGH，不是嗎?

　　總結

　　網(wǎng)站界面很好看是吧?但設計的背景設計師是花了多少心思我想就只有他們知道了。接下來的品牌網(wǎng)站建設，我建議同學們可以從這里獲取些靈感，嘗試這些使用一些細微動畫美化網(wǎng)頁，增加氛圍：)