161113-讀書筆記 | 寫給大家看的設(shè)計(jì)書 · 四大設(shè)計(jì)原則

第一章 引言

一旦能夠說出什么東西的名字躲查,就會很容易注意到它蚓聘。你就會掌握它影所,擁有它,讓它受你所控栈幸。
優(yōu)秀的設(shè)計(jì)需要知道三點(diǎn):

  • 學(xué)習(xí)四大基本原則
    • 對比
    • 重復(fù)
    • 對齊
    • 親密性
  • 認(rèn)識到自己沒有運(yùn)用這些原則
  • 應(yīng)用基本原則

第二章 親密性

什么是親密性
親密性原則:將相關(guān)的項(xiàng)組織在一起,移動(dòng)這些項(xiàng)嗅钻,使它們的物理位置相互靠近碧注,這樣一來骨田,相關(guān)的項(xiàng)將被看作凝聚為一體的一個(gè)組柿冲,而不再是一堆彼此無關(guān)的片段。

親密性箴言
物理位置的接近就意味著存在關(guān)聯(lián)宿饱。
親密性意味著存在關(guān)聯(lián)铭乾。

親密性小結(jié)
如果多個(gè)項(xiàng)相互之間存在很近的親密性片橡,它們將成為一個(gè)視覺單元爆哑,而不是多個(gè)孤立的元素。彼此相關(guān)的項(xiàng)應(yīng)該歸在一組晕窑。要有意識地注意你是怎樣閱讀的,你的視線怎樣移動(dòng):從哪里開始丢郊;沿著怎樣的路徑盔沫;到哪里結(jié)束;讀完之后枫匾,接下來看哪里架诞?整個(gè)過程應(yīng)當(dāng)是一個(gè)合理的過程,有確定的開始干茉,而且要有確定的結(jié)束谴忧。

  • 根本目的
    親密性的根本目的是實(shí)現(xiàn)組織性。盡管其他原則也能達(dá)到這個(gè)目的角虫,不過利用親密性原則沾谓,只需簡單地將相關(guān)的元素分在一組建立更近的親密性,就能自動(dòng)視線條理性和組織性戳鹅。如果信息很有條理均驶,將更容易閱讀,也更容易被記住枫虏。此外還有一個(gè)很好的“副產(chǎn)品”妇穴,利用親密性原則,還可以是空白(這是設(shè)計(jì)者們最喜歡的)更美觀(也更有條理)隶债。

  • 如何實(shí)現(xiàn)
    微微瞇起眼睛腾它,統(tǒng)計(jì)眼睛停頓的次數(shù)來數(shù)一數(shù)頁面上有多少個(gè)元素。如果頁面上的項(xiàng)超過3~5個(gè)死讹,就要看看哪些孤立的原色可以歸在一組建立更近的親密性携狭,使之成為一個(gè)視覺單元。

  • 要避免的問題
    避免一個(gè)頁面上有太多孤立的元素回俐。
    不要在元素之間留出同樣大小的空白逛腿,除非各組同屬于一個(gè)子集稀并。
    標(biāo)題、子標(biāo)題单默、圖表標(biāo)題碘举、圖片能否歸入其相關(guān)材料?在這個(gè)問題上一定要非常清楚(哪怕只有一點(diǎn)含糊都要盡量避免)搁廓。在有很近親密性的元素之間建立關(guān)系引颈。
    不同屬一組的元素之間不要建立聯(lián)系!如果元素彼此無關(guān)境蜕,要把它們分開蝙场。
    不要僅僅因?yàn)橛锌瞻拙桶言胤旁诮锹浠蛑匾?/p>

第三章 對齊

什么是對齊
對齊原則:任何元素都不能再頁面上隨意安放。每一項(xiàng)都應(yīng)當(dāng)與頁面上的某個(gè)內(nèi)容存在某種視覺聯(lián)系粱年。對齊原則要求特別小心售滤,再不能像從前那樣,只要頁面上剛好有空間酒吧元素隨意“扔”到那里台诗。

對齊箴言
只使用一種對齊方式完箩。
在對齊的對象之間畫出對齊線。
在打破規(guī)則之前必須清楚規(guī)則是什么拉队。

對齊小結(jié)
任何元素都不能在頁面上隨意擺放弊知。每個(gè)元素應(yīng)當(dāng)與頁面上的另外一個(gè)元素存在某種視覺聯(lián)系
在設(shè)計(jì)中粱快,統(tǒng)一性是一個(gè)重要的概念秩彤。要讓頁面上的所有元素看上去統(tǒng)一、有聯(lián)系而且彼此相關(guān)事哭,需要在各個(gè)單獨(dú)的元素之間存在某種視覺紐帶呐舔。盡管這些孤立元素在頁面上的物理位置可能并不靠近,但是通過適當(dāng)放置慷蠕,可以讓他們看上去是有聯(lián)系而且相關(guān)的珊拼,并且與其他信息統(tǒng)一×骺唬可以看看你喜歡的那些設(shè)計(jì)澎现。一個(gè)精美的設(shè)計(jì)不論最初看上去多么雜亂無章,總能找出其中的對齊方式每辟。

  • 根本目的
    對齊的根本目的是使頁面統(tǒng)一而且有條理剑辫。其效果類似于把客廳里四處零落的洋娃娃撿起來,并把它們放在一個(gè)玩具箱中渠欺。
    不論創(chuàng)建精美的妹蔽、正式的、有趣的還是嚴(yán)肅的外觀,通常都可以利用一種明確的對齊(當(dāng)然胳岂,要結(jié)合適當(dāng)?shù)淖煮w)來達(dá)到目的编整。

  • 如何實(shí)現(xiàn)
    要特別注意元素放在哪里。應(yīng)當(dāng)總能在頁面上找出與之對齊的元素乳丰,盡管這兩個(gè)對象的物理位置可能相距很遠(yuǎn)掌测。

  • 要避免的問題
    要避免在頁面上混合使用多種文本對齊方式(也就是說,不要將某些文本居中产园,而另外一些文本右對齊)汞斧。
    另外,要著力避免居中對齊什燕,除非你有意識地想要?jiǎng)?chuàng)建一種比較正式粘勒、穩(wěn)重(通常也更乏味)的表示。并不是完全杜絕使用居中對齊屎即,有時(shí)可以有意地選擇這種對齊方式庙睡,但是不要把它作為默認(rèn)選擇。

第四章 重復(fù)

什么是重復(fù)
重復(fù)原則:設(shè)計(jì)的某些方面需要在整個(gè)作品中重復(fù)剑勾。重復(fù)元素可能是一種粗字體埃撵、一種粗線赵颅、某個(gè)項(xiàng)目符號虽另、顏色、設(shè)計(jì)要素饺谬、某種格式捂刺、空間關(guān)系等。讀者能看到的任何方面都可以作為重復(fù)元素募寨。

重復(fù)箴言
可以把重復(fù)認(rèn)為是“一致性”
不過重復(fù)還不只是自然的一致族展,這是一種統(tǒng)一設(shè)計(jì)各個(gè)部分的有意識的行為。

重復(fù)小結(jié)
設(shè)計(jì)中視覺元素的重復(fù)可以將作品中的各部分連在一起拔鹰,從而統(tǒng)一并增強(qiáng)整個(gè)作品仪缸,否則這些部分只是彼此孤立的單元。重復(fù)不僅對只有一頁的作品很有用列肢,對于多頁文檔的設(shè)計(jì)更顯重要(對此我們通常稱之為保持一致)恰画。

  • 根本目的
    重復(fù)的目的就是統(tǒng)一拴还,并增強(qiáng)視覺效果欧聘。不要低估頁面視覺效果的威力,如果一個(gè)作品看起來很有趣焕妙,它往往也更易于閱讀孝偎。

  • 如何實(shí)現(xiàn)
    重復(fù)可以認(rèn)為是保持一致性衣盾,而且我相信你早已經(jīng)這樣做過。現(xiàn)在势决,需要把現(xiàn)有的一致性更向前推一步果复∷涑可不可以專門做一個(gè)圖片設(shè)計(jì),并且將某些一致元素(如標(biāo)題)作為這個(gè)圖片設(shè)計(jì)的一部分私植?在每個(gè)頁面底部或每個(gè)標(biāo)題下面使用一條粗細(xì)為1磅的線嗎曲稼?或者是不是使用一條更粗的線(4磅)湖员,使重復(fù)元素顯得更明顯娘摔、更生動(dòng)?
    再看看有沒有可能增加一些純粹為建立重復(fù)而設(shè)計(jì)的元素鸭津。是不是有一個(gè)編號項(xiàng)列表曙博?可不可以使用另外一種字體或逆序數(shù)字怜瞒,然后對出版物中的每一個(gè)編號列表都重復(fù)同樣的處理父泳?最初惠窄,可以只是找出現(xiàn)有的重復(fù)杆融,然后將其加強(qiáng)。熟悉了這種思想以后蒋腮,再開始創(chuàng)建新的重復(fù)元素池摧,來增強(qiáng)設(shè)計(jì)的效果并提高信息的清晰度激况。
    重復(fù)就像是強(qiáng)調(diào)你的衣著乌逐。如果一位女士穿著一件可愛的黑色晚禮服,戴著一項(xiàng)別致的帽子绢慢,她可能會用紅色高跟鞋呐芥、紅色口紅和一朵紅色小花來突出她的晚禮服奋岁。

  • 要避免的問題
    要避免太多地重復(fù)一個(gè)元素闻伶,重復(fù)太多會讓人討厭蓝翰。要注意對比的價(jià)值。
    太多的重復(fù)講混淆重點(diǎn)畜份。

第五章 對比

什么是對比
對比原則:頁面上的不同元素之間要有對比效果爆雹,達(dá)到吸引讀者的對比效果。如果兩個(gè)項(xiàng)不完全相同钙态,就應(yīng)當(dāng)使之不同册倒,而且應(yīng)當(dāng)是截然不同驻子。

對比箴言
對比不僅可以用來吸引眼球。還可以用來組織信息脾歧、清晰層級鞭执、在頁面上指引讀者兄纺,并且制造焦點(diǎn)估脆。

對比小結(jié)
在頁面上增加對比能吸引人的眼球疙赠。我們的研究喜歡看到對比的事物朦拖。如果頁面上放兩個(gè)不完全相同的元素(比如有兩種不同字體璧帝,或者有兩種不同線寬)睬隶,它們就不能類似苏潜。要實(shí)現(xiàn)有效的對比,這兩個(gè)元素必須截然不同贴唇。

  • 根本目的
    對比的根本目的有兩個(gè)滤蝠,這兩個(gè)目的相輔相成,無法分開。一個(gè)目的是增強(qiáng)頁面的效果更卒,如果一個(gè)頁面看起來很有意思问拘,往往更有可讀性。另一個(gè)目的是有助于信息的組織崖咨。讀者應(yīng)當(dāng)能立即了解信息以何種方式組織油吭,以及從一項(xiàng)到另一項(xiàng)的邏輯流程。對比元素不能讓讀者混淆歌豺,也不能錯(cuò)誤地強(qiáng)調(diào)重點(diǎn)(即本不該是重點(diǎn)的元素)类咧。

  • 如何實(shí)現(xiàn)
    可以通過字體選擇痕惋、線寬值戳、顏色述寡、形狀柿隙、大小叶洞、空間等來增加對比。增加對比很容易禀崖,途徑有很多衩辟。這可能是增加視覺效果最有意思也是最讓人滿意的方法了。重要的是:對比一定要強(qiáng)烈波附。

  • 要避免的問題
    不要猶豫艺晴。如果你想形成對比昼钻,就加大力度。不要將一種粗線與一種更粗的線進(jìn)行對比封寞。不要將棕色文本與黑色標(biāo)題建立對比然评。要避免使用兩種或多種類似的字體。如果各個(gè)項(xiàng)不完全一樣狈究,干脆讓它們截然不同磅废!

第六章:四大基本原則復(fù)習(xí)

有關(guān)設(shè)計(jì),同時(shí)也是有關(guān)生活的一個(gè)更一般的指導(dǎo)原則是:不要畏畏縮縮潭兽。

本書希望能向你潛移默化地灌輸一種思想:使你提高視覺敏感度账蓉。

要記住遵堵,專業(yè)的設(shè)計(jì)人員總是會“借取”其他理念,他們總在尋找靈感。在借鑒和調(diào)整中沐批,它就會逐步變成你自己的設(shè)計(jì)躺彬。我們都是這樣做的。

不要把關(guān)于設(shè)計(jì)的這些內(nèi)容看得太過嚴(yán)肅犁河,我保證,只要遵循這四個(gè)原則魏烫,就一點(diǎn)能創(chuàng)建出生動(dòng)煌张、有趣、有條理并讓你引以為豪的頁面。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌携悯,老刑警劉巖轴或,帶你破解...
    沈念sama閱讀 216,372評論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件审胸,死亡現(xiàn)場離奇詭異曙求,居然都是意外死亡静浴,警方通過查閱死者的電腦和手機(jī)得问,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評論 3 392
  • 文/潘曉璐 我一進(jìn)店門焚挠,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事噩斟」杓保” “怎么了?”我有些...
    開封第一講書人閱讀 162,415評論 0 353
  • 文/不壞的土叔 我叫張陵嘲驾,是天一觀的道長殃饿。 經(jīng)常有香客問我,道長缴啡,這世上最難降的妖魔是什么壁晒? 我笑而不...
    開封第一講書人閱讀 58,157評論 1 292
  • 正文 為了忘掉前任瓷们,我火速辦了婚禮业栅,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘谬晕。我一直安慰自己碘裕,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,171評論 6 388
  • 文/花漫 我一把揭開白布攒钳。 她就那樣靜靜地躺著帮孔,像睡著了一般。 火紅的嫁衣襯著肌膚如雪不撑。 梳的紋絲不亂的頭發(fā)上文兢,一...
    開封第一講書人閱讀 51,125評論 1 297
  • 那天,我揣著相機(jī)與錄音焕檬,去河邊找鬼姆坚。 笑死,一個(gè)胖子當(dāng)著我的面吹牛实愚,可吹牛的內(nèi)容都是我干的兼呵。 我是一名探鬼主播,決...
    沈念sama閱讀 40,028評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼腊敲,長吁一口氣:“原來是場噩夢啊……” “哼击喂!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起碰辅,我...
    開封第一講書人閱讀 38,887評論 0 274
  • 序言:老撾萬榮一對情侶失蹤懂昂,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后没宾,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體凌彬,經(jīng)...
    沈念sama閱讀 45,310評論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,533評論 2 332
  • 正文 我和宋清朗相戀三年榕吼,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了饿序。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,690評論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡羹蚣,死狀恐怖原探,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤咽弦,帶...
    沈念sama閱讀 35,411評論 5 343
  • 正文 年R本政府宣布徒蟆,位于F島的核電站,受9級特大地震影響型型,放射性物質(zhì)發(fā)生泄漏段审。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,004評論 3 325
  • 文/蒙蒙 一闹蒜、第九天 我趴在偏房一處隱蔽的房頂上張望寺枉。 院中可真熱鬧,春花似錦绷落、人聲如沸姥闪。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽筐喳。三九已至,卻和暖如春函喉,著一層夾襖步出監(jiān)牢的瞬間避归,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評論 1 268
  • 我被黑心中介騙來泰國打工管呵, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留梳毙,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,693評論 2 368
  • 正文 我出身青樓撇寞,卻偏偏與公主長得像顿天,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子蔑担,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,577評論 2 353

推薦閱讀更多精彩內(nèi)容