用一張封面來理解畫面中的層次

設計師在前期的時候,一定要先學會做加法,不要盲目學習那些簡潔風格的大神,人家都是從復雜變到簡潔的,理解了復雜才知道如何簡化,如果新手直接跳過復雜,那最后執(zhí)行出來的東西很可能就不是簡潔,而是“簡單”。

菜心每周的推文都有一張封面,以前做封面,那叫一個痛苦啊,后面慢慢理解了層次,現在就已經好多了,今天就拿一張封面來看看到底如何在畫面中增加層次,大綱如下:

1.沒有層次

2.第一個層次

3.第二個層次

4.第三個層次

5.第四個層次

6.第五個層次

7.第六個層次

8.第七個層次

我擦,這大綱牛逼了,真整齊!

1.沒有層次

弄個底色,把兩排文字往上一拍,這就屬于一點層次都沒有的情況,當然白色字與黑色背景的層次我們就忽略不計了,誰都不會傻到背景和文字用一樣的顏色。

2.第一個層次

好了,來加我們的第一個層次,變!

哇,好棒,字體層級一下就區(qū)分開了,瞬間就有設計感了,不錯,繼續(xù)!


3.第二個層次

這,發(fā)生了什么變化嗎?

當然,英文字體變粗了,這一步就是粗細的對比,產生第二個層次。

厲害了!

4.第三個層次

咦?英文字體怎么好像變瘦變高了?

是的,這就是字體之間寬窄的對比,形成第三個層次。

5.第四個層次

這一步是字體間距的層次,這個是以前做平面排版時經常遇到的一個首發(fā),比如標題的字體間距很緊,那副標題的字體間距就可以松散一些,增加對比,體現層次,如下圖:

6.第五個層次

在字體與黑色背景中間加一層修飾元素,很常用的手法,也是為了豐富層次,算是我們的第五個層次!


7.第六個層次

背景也是可以加層次,例如用一張真實的圖片,降低透明度,放在背景上面,或者自己做一張有層次的設計圖等等,如下圖:

這就是我們的第6個層次。


8.第七個層次

如果你嫌那個輔助元素(透明的線條矩形)有違和感,還可以讓它和背景圖融合到一起,例如下圖這種做法:

這樣層次就更豐富了,(不過顏色沒有上一個豐富),我們就算它是第七個層次吧!

好了,一張封面就差不多完成了,里面所有的層次都和大家說了。

總結

其實增加層次的方法太多了,就不一一列舉了,希望這個簡單的例子能給大家?guī)硪恍﹩l(fā),多去發(fā)現并總結一些增加層次的設計手法,并加以練習,這樣以后即使沒有參考,那些常用的方法都記在腦子里面了,你也可以隨時做出一幅有設計感的畫面,這就是設計師獨有的一技之長長長長長長長長長長長長長長長長

好長??!科科!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 發(fā)現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 15,650評論 4 61
  • 盡管沒有一個粉絲我還是執(zhí)著的經驗著。
    playxy閱讀 347評論 0 0
  • 青春歲月,我們的生活信條就是“性,藥,搖滾樂”。生命有很多種樂趣,所謂“藥”,可以是酒精,可以是足球或者任何讓你全...
    一諾的家閱讀 537評論 0 1
  • 文件大小格式化 字符串工具類
    白水螺絲閱讀 547評論 0 0

友情鏈接更多精彩內容