早在近幾年，元素重疊的設(shè)計越來越多，到現(xiàn)在已經(jīng)慢慢成為主流設(shè)計中的一種了。

        生活中常見的重疊設(shè)計 比如 抽屜 電梯 鋼筆殼等等都運用了重疊的方式。

        其實網(wǎng)頁中出現(xiàn)這類設(shè)計也是非常多了，那么

        合理的運用重疊設(shè)計方式，會讓你的設(shè)計變得更好哦~

        下面從網(wǎng)頁中的 圖片 字體 架構(gòu) 色彩 元素

        五個方面來講解重疊的設(shè)計運用方式以及它的作用。

        - ：圖片與圖片(圖形)的重疊設(shè)計運用。

        網(wǎng)頁設(shè)計中重疊運用在圖片中是最常見的設(shè)計方式。

        既能豐富圖片的內(nèi)容，又能在版式上做到靈活。

       01: 打破常規(guī)，展示更多細(xì)節(jié)

       多方面展示圖片的細(xì)節(jié)，通過3張圖片將人物服飾細(xì)節(jié)分別展示出來。告別死板的設(shè)計，板式更加靈活多變。

        02 :豐富圖片展示

        圖片將圖形結(jié)合起來，使得圖片不在單調(diào)，同時富有設(shè)計感，而且有助于品牌的傳達(dá)。下列圖片與背景色進(jìn)行重疊搭配，使圖片變的有富有空間和穩(wěn)重感。

        03:相互關(guān)聯(lián)性

       利用重疊的設(shè)計方式讓板塊于板塊之間相互關(guān)聯(lián)，且具有整體感。告別了原有圖片和文字之間的零散性。

        04: 增強空間感

        下面的海報中，原本很普通的地球，但設(shè)計師是采用背景圖和球進(jìn)行重疊搭配，使

        拉開了畫面的層次感，畫面在視覺上變得有空間感

        05:增加層次感

        下列海報設(shè)計中，奔馳車和背景圖片之間也是采用了重疊的搭配讓整個畫面的層次感加強，破出來的車頭 在視覺具有強烈的沖擊力。

        二：文字與圖片的重疊設(shè)計運用。

        01:文字和圖片讓畫面更靈活。

        下列數(shù)字2014和運動鞋子進(jìn)行重疊設(shè)計，視覺上帶來了一前一后的感覺

        使得整個畫面變得具有活力，給用戶傳達(dá)出了一種輕快的感覺。

        02 : 帶來更真實的感受

        下列設(shè)計，使用文字和和產(chǎn)品進(jìn)行重疊設(shè)計，讓整個文案和產(chǎn)品結(jié)合的更加緊密，而且畫面也富有層次感，給用戶帶來更真實的感受。

        下列案例也是采用了相同的設(shè)計方式

        03:讓文字變具有引導(dǎo)性

        下列是一個相關(guān)流程設(shè)計設(shè)計師將文字和數(shù)字進(jìn)行重疊的設(shè)計方式來處理，

        使得用戶能夠清晰的了解當(dāng)前在第幾步驟，同時讓整段文字變得豐富起來。節(jié)省了大量不必要的空間。

        04: 讓文字更具有設(shè)計感

        如何讓整個單調(diào)的字母，變得更有設(shè)計感，更真實呢?下面案例原本簡單的字母，加上了圖案后，使得整個設(shè)計更真實。更具有設(shè)計感。

        三：網(wǎng)站版式的重疊設(shè)計運用。

        網(wǎng)站不同內(nèi)容版塊之間的重疊設(shè)計，不僅打破常規(guī)的設(shè)計，視覺上得到提升。同時也能更好的展示需求內(nèi)容信息。

        01 : 增強層次感。

        下面的網(wǎng)站是小李子電影宣傳網(wǎng)站。設(shè)計師大膽的利用色塊和主視覺人像進(jìn)行重疊，不僅讓文案信息在版面中節(jié)省了空間清晰的展示。而且還給整個網(wǎng)站視覺增加了層次感。真正做到了給用戶有遠(yuǎn)有近的感覺。

        02 : 整體感增強，不被干擾。

        下面網(wǎng)站是一家食品網(wǎng)站，設(shè)計師打破常規(guī)的布局，利用重疊的方式，將圖片文案和背景元素進(jìn)行結(jié)合，讓整個網(wǎng)頁每一個版塊之間既保持了一定的節(jié)奏感間隙，又避免了彼此不同的板塊之間元素過多而造成的干擾。

        03 : 打破常規(guī)布局

        下面的網(wǎng)站是一家政界人士的宣傳網(wǎng)站，設(shè)計師采用了大量不同大小的色塊和背景進(jìn)行重疊搭配，每個板塊之間進(jìn)行巧妙的銜接，使得畫面整體感增強，同時更視覺上給用戶帶來舒適的體驗。

        下列設(shè)計也是采用了相同的設(shè)計方式。使得整個畫面節(jié)省了空間，利用不同大小的色塊，有效的緩解了畫面的緊迫感，起到了過渡的作用。

        04 ：強化網(wǎng)站的品牌宣傳

        下面網(wǎng)站是一家牛排店的宣傳網(wǎng)站。設(shè)計師如何讓網(wǎng)站給用戶傳達(dá)出牛排優(yōu)雅的感覺?

        相同的方式，設(shè)計師同樣選取了大的背景圖，讓板塊和圖片之間進(jìn)行重疊搭配，使視覺上做到了極大的突破同時又能有效的給用戶傳達(dá)出畫面強烈的氛圍。

        四：色彩之間的重疊設(shè)計運用。

        使用不同的色彩進(jìn)行重疊搭配在視覺上往往會給用戶帶來不一樣的視覺體驗哦

        01;強化視覺沖擊力

        利用鮮明的對比色彩進(jìn)行重疊搭配，使設(shè)計更具有視覺沖擊力和吸引力。下列海報設(shè)計，設(shè)計師將模特用亮紫色漸變到藍(lán)綠色和背景進(jìn)行的重疊搭配改造。極大的增強了視覺沖擊力，同時在視覺上給用戶帶來極大的沖擊感。

        02:讓畫面變得更立體

        下列創(chuàng)意類海報，設(shè)計師同樣運用了色彩重疊的設(shè)計方式來處理，將橙色按照透明度以及飽和度不斷的重疊到藍(lán)色背景使得整個字變得更立體，畫面的設(shè)計感和層次給用戶帶來強烈的視覺沖擊力

        03：豐富畫面

        下列海報設(shè)計，設(shè)計師用粉和藍(lán)色進(jìn)行重疊的方式設(shè)計，讓整個背景告別單調(diào)，視覺感十足。

        五：不同元素之間的重疊設(shè)計運用。

       利用點線面等修飾元素和主體設(shè)計進(jìn)行重疊搭配可以有效讓設(shè)計變得更加有氛圍。

       01：增強畫面的趣味

       下列設(shè)計利用圓方三角的元素，和圖片進(jìn)行重疊的處理，讓原本的圖片不再單調(diào)變得有趣。

        02:增強畫面的品牌氛圍

        下列是一家閱讀相關(guān)的網(wǎng)站設(shè)計頭圖，設(shè)計師

        用紙張元素和背景進(jìn)行重疊的方式搭配，讓整個設(shè)計變得更加有氛圍。

        下列網(wǎng)站頭圖也是運用的重疊的設(shè)計方式

        03：讓局部多個元素具有關(guān)聯(lián)性