如何做出像知乎周刊那樣的 banner?

超級喜歡知乎周刊的各種banner,(?????) ?這種設計是如何實現的呢?(整個圖片的靈感,至字體設計)

@趙趙@賈鵬@ui設計@Uiazoul@uiuinn)


謝邀!這個坑想填很久了~簡單說一下。

1.字體:粗細體、襯線與無襯線的均衡搭配。

知乎周刊:方正soon宋三簡體

zhihu weekly、vol:華聞黑體

079:黑體-簡

萌芽……:蘭亭黑-簡

2.排版:疏密令人舒適。

3.背景:要與內容息息相關,扁平化!低飽和度和亮度。

(我的這個專欄其實梗是《白熊咖啡廳》,所以找了張同人圖,圖侵刪)

拿可愛的梅梅吧~

好像怪怪的~

調整下~

來個小版的~

(梅梅:我頭上的花花呢!)

以上。

比較粗糙~見諒~


謝邀!

多看多偷就可以了。我還沒到可以點評風格的水平,一起努力哈~

這是我為了學習而做的網頁,您平時可以多訪問看看別人的作品,多吸取精華,然後根據自己的理解,把看到的學到的融入到自己的作品裡。

http://www.hiimii.com

祝好!


想做出類似的效果可以先分析一下這幾張banner~渣渣路人答主很不要臉地就這幾張banner分析一下_(:D?┌)

—————————————————1.圖形

圖形使用扁平化的圖或者是簡潔,小清新的手繪圖片。

當然圖片要和標題有一定聯繫啦~

這些可以找素材,當然也可以自己做~

2.字體

知乎周刊用的襯線體。

周刊期數和標題用無襯線體。

當然標題還要用粗體~

3.版式

版面最左最右的約八分之一的位置不能放文案,最上最下留空約六分之一的位置不能放文案。這是我感覺啦…做的時候可以和知乎這幾張banner對比一下看看位置。

知乎周刊和Zhihu Weekly 和vol.xx三者的相對位置是固定不變的,這三者和標題相對位置也是固定的,和標題是左對齊的。排版的時候把他們當作整體也可以~

最後就是文案和圖形的放置了,這個要看素材是什麼了。

4.顏色

色系不超過三種,顏色的亮度和飽和度不要太高(所謂的性冷淡的顏色?)

—————————————————

純手機碼字…有什麼不對的請指正…orz


推薦閱讀:

交互效果圖無法「脫胎換骨」,就只剩「誰丑誰尷尬」了
一起學習 Material Design 01
導師說| 關於交互設計,Crystal有一大波Offer案例…
彈窗、模態、提示、浮層,這幾位是什麼關係?
聊天縮略圖背後的故事

TAG:知乎 | 交互設計 | 平面設計 | banner | 知乎周刊數字雜誌 |