寫給大家看的設(shè)計(jì)讀書筆記課件

《寫給大家看的設(shè)計(jì)書》RobinWilliams[美]羅賓·威廉姆斯讀書分享《寫給大家看的設(shè)計(jì)書》RobinWilliams讀書分享1關(guān)于作者{}羅賓·威廉姆斯(RobinWilliams)是世界著名的設(shè)計(jì)師、技術(shù)專家和暢銷書作家。通過寫書和授課，她已經(jīng)影響了整整一代數(shù)字設(shè)計(jì)師。同時(shí)，作為Adobe和Mac技術(shù)社區(qū)內(nèi)的偶像級(jí)專家，她擁有大批的擁戴者。她是PublishMagazine、AdobeMagazine等雜志的專欄作家。是MacWorldExpo等業(yè)界重要活動(dòng)和組織的顧問委員會(huì)成員。還創(chuàng)辦了SantaFe電影藝術(shù)學(xué)院。除本書外，她還著有幾十部暢銷圖書和獲獎(jiǎng)著作，包括TheNon-Designer'SWebBook、RobinWilliamsDesignWorkshop、TheLittleMacBook等，有的書已被翻譯為15種文字。產(chǎn)生了世界性的影響。關(guān)于作者{}羅賓·威廉姆斯(RobinWilliams)是2關(guān)于本書在這個(gè)創(chuàng)意無處不在的時(shí)代，越來越多的人需要成為設(shè)計(jì)師。簡(jiǎn)歷、論文、做演示用的PowerPoint、個(gè)人主頁、博客、社團(tuán)活動(dòng)海報(bào)、給客戶的信函或者電子郵件……。處處都在考驗(yàn)?zāi)愕脑O(shè)計(jì)能力。在設(shè)計(jì)大師RobinWilliams看來，設(shè)計(jì)其實(shí)很簡(jiǎn)單。在這部暢銷全球多年、影響了一代設(shè)計(jì)師的經(jīng)典著作中，RobinWilliams將優(yōu)秀設(shè)計(jì)的秘訣歸納為對(duì)比、重復(fù)、對(duì)齊和親密性四條基本原則，并用簡(jiǎn)潔通俗、幽默生動(dòng)的文筆，同時(shí)配以大量經(jīng)過修改進(jìn)行前后對(duì)比的實(shí)例圖解和設(shè)計(jì)練習(xí)（并提供解答），直觀清晰地傳授給讀者。通過《寫給大家看的設(shè)計(jì)書》，普通讀者很快就能夠自信地設(shè)計(jì)出專業(yè)級(jí)別的作品，而專業(yè)設(shè)計(jì)師也將從中獲得靈感和解決問題的途徑。關(guān)于本書在這個(gè)創(chuàng)意無處不在的時(shí)代，越來越多的人需要成為設(shè)計(jì)師3思維導(dǎo)圖思維導(dǎo)圖4

約書亞樹一旦能說出什么東西的名字,就很容易注意到它。你就會(huì)掌握它,擁有它,使它在你的控制中。設(shè)計(jì)的目的是為了向用戶更好地表達(dá)信息，并且將信息以更好地視覺效果呈現(xiàn)出來，書中介紹的四大原則（親密性、對(duì)齊、重復(fù)、對(duì)比）就是為以上目的服務(wù)的，好的設(shè)計(jì)往往也就是因?yàn)楹芎玫臐M足四大原則。

約書亞樹一旦能說出什么東西的名字,就很容易注意到它。你就會(huì)5

四大原則相關(guān)性是指哪些元素更加相關(guān)，哪些元素沒那么相關(guān)，可以通過控制元素間的距離來管理（親密性原則）2.不同的元素之間可能距離遠(yuǎn)近不同，可以通過為不同的元素制造某種對(duì)齊來實(shí)現(xiàn)即便如此它們也是整齊有序的（對(duì)齊原則）3.一致性是指哪些信息在整體上是屬于同一級(jí)別/類別等，可以通過為一致的信息設(shè)計(jì)相同（相似）的視覺元素來管理（重復(fù)原則）4.重要性是指對(duì)用戶來說哪些信息更重要，可以通過制造視覺上的對(duì)比來管理（對(duì)比原則）親密性對(duì)齊重復(fù)對(duì)比

四大原則相關(guān)性是指哪些元素更加相關(guān)，哪些元素沒那么相關(guān)，可6四大原則

親密性根本目的：實(shí)現(xiàn)組織性同一個(gè)頁面上通常會(huì)擺放很多元素，親密性原則倡導(dǎo)通過物理距離來管理同一個(gè)頁面上不同元素之間的關(guān)聯(lián)性，相關(guān)性高的元素應(yīng)該緊挨在一起，相關(guān)性低的元素之間應(yīng)該保持一定的距離。親密性原則解決的問題是如何將我們需要呈現(xiàn)的信息更有條理（突出相關(guān)性）的展現(xiàn)在用戶面前。四大原則

親密性根本目的：實(shí)現(xiàn)組織性7四大原則

親密性讓具有相關(guān)性的設(shè)計(jì)元素適當(dāng)靠近，形成一個(gè)視覺單元。有助于組織信息，讓結(jié)構(gòu)更加清晰。(1)左圖，版面上的一堆元素關(guān)系不明確。我們會(huì)認(rèn)為他們之間沒有關(guān)聯(lián)。(2)右圖，讓有關(guān)系的元素適當(dāng)靠近，我們很容易知道他們之間是有聯(lián)系的。四大原則

親密性讓具有相關(guān)性的設(shè)計(jì)元素適當(dāng)靠近，形成一個(gè)視覺8四大原則

親密性如何實(shí)現(xiàn)如果多個(gè)項(xiàng)相互之間有很近的親密性，它們就會(huì)成為一個(gè)視覺單元，而不是多個(gè)孤立的元素。微微瞇起眼睛，統(tǒng)計(jì)眼睛停頓的次數(shù)來數(shù)一數(shù)頁面上有多少個(gè)元素。如果頁面上的項(xiàng)超過3～5個(gè)（當(dāng)然，這取決于具體情況），就要看看哪些孤立的元素可以歸在一組建立更近的親密性，使之成為一個(gè)視覺單元。要避免的問題1.不要僅僅因?yàn)橛锌瞻拙桶丫瓢稍胤诺浇锹浠蛑醒?.避免一個(gè)頁面上有太多的孤立的元素3.不要在元素之間留出同樣大小的空白，除非各組同屬于一個(gè)子集4.標(biāo)題、子標(biāo)題、圖表標(biāo)題、圖片能否歸入其他的資料自由親密性的元素之間建立聯(lián)系5.不屬于同組的元素要分開，不要僅僅因?yàn)橛锌瞻拙桶言胤旁诮锹浠蛑醒?。四大原則

親密性如何實(shí)現(xiàn)9四大原則

對(duì)齊根本目的：實(shí)現(xiàn)秩序性頁面上的不同元素之間會(huì)因?yàn)殛P(guān)聯(lián)性不同而會(huì)有不同的物理距離，對(duì)齊原則倡導(dǎo)的是將這些不同元素建立視覺上的某種聯(lián)系，而不是被隨意的擺放，建立這種聯(lián)系的方式就是為元素尋找某種對(duì)齊。對(duì)齊性原則解決的問題是如何將要呈現(xiàn)的信息有秩序的展現(xiàn)在用戶面前四大原則

對(duì)齊根本目的：實(shí)現(xiàn)秩序性10四大原則

對(duì)齊元素之間在版面上，形成某種視覺聯(lián)系。建立一種清晰、精巧、而且清爽的外觀。版面若不存在一定對(duì)齊關(guān)系，會(huì)讓整個(gè)版面顯得雜亂無章。四大原則

對(duì)齊元素之間在版面上，形成某種視覺聯(lián)系。建立一種清11四大原則

對(duì)齊元素之間在版面上，形成某種視覺聯(lián)系。建立一種清晰、精巧、而且清爽的外觀。當(dāng)我們以一定的關(guān)系，對(duì)元素進(jìn)行對(duì)齊。我們很容易對(duì)信息進(jìn)行解讀。四大原則

對(duì)齊元素之間在版面上，形成某種視覺聯(lián)系。建立一種清12四大原則

對(duì)齊如何實(shí)現(xiàn)1.不建議初學(xué)者輕易使用居中對(duì)齊2.盡量只使用一種對(duì)齊方式3.頁面上每一個(gè)項(xiàng)都應(yīng)該與其他項(xiàng)存在某種對(duì)齊4.標(biāo)題和正文對(duì)齊的雷區(qū)要避免的問題1.要避免在頁面上同時(shí)使用多種對(duì)齊方式2.要盡量避免居中對(duì)齊，除非你有意識(shí)的想要?jiǎng)?chuàng)建一種比較正式的、穩(wěn)重的表示。并不是完全杜絕使用居中對(duì)齊，有時(shí)可以有意識(shí)的使用這種對(duì)齊方式，但不要把它作為默認(rèn)的選擇。四大原則

對(duì)齊如何實(shí)現(xiàn)13四大原則

對(duì)齊如何實(shí)現(xiàn)1.不建議初學(xué)者輕易使用居中對(duì)齊如果文本為左對(duì)齊或右對(duì)齊，讓文本聯(lián)系在一起的那條看不見的線會(huì)更明確，因?yàn)楝F(xiàn)在有一條“硬”的豎邊。這就使左對(duì)齊和右對(duì)齊的文本看起來外觀更清晰、效果更分明。四大原則

對(duì)齊如何實(shí)現(xiàn)14四大原則

對(duì)齊如何實(shí)現(xiàn)2.盡量只使用一種對(duì)齊方式在得到更多培訓(xùn)之前，一定要堅(jiān)持一個(gè)原則：只使用一種對(duì)齊方式。頁面上只使用一種文本對(duì)齊，所有文本都左對(duì)齊，或右對(duì)齊，或者全部居中。四大原則

對(duì)齊如何實(shí)現(xiàn)15四大原則

對(duì)齊如何實(shí)現(xiàn)3.頁面上每一個(gè)項(xiàng)都應(yīng)該與其他項(xiàng)存在某種對(duì)齊在頁面上放其他項(xiàng)時(shí)，一定要確保每一項(xiàng)都與頁面上的其他項(xiàng)存在某種對(duì)齊。如果文本行水平擺放，則按其基線對(duì)齊。如果有多個(gè)單獨(dú)的文本塊，則對(duì)齊其左邊界或右邊界。如果有圖片元素，將其邊界與頁面的其他邊界對(duì)齊。4.標(biāo)題和正文對(duì)齊的雷區(qū)絕對(duì)不要在左對(duì)齊的正文或縮進(jìn)的文本上方將標(biāo)題居中。如果文本沒有明確的左邊界和右邊界，就無法區(qū)分標(biāo)題是否確實(shí)居中，看起來它只是懸掛著而已。四大原則

對(duì)齊如何實(shí)現(xiàn)16四大原則

重復(fù)根本目的：讓元素重復(fù)出現(xiàn)，目的就是統(tǒng)一，并增強(qiáng)視覺效果。重復(fù)原則倡導(dǎo)通過通過視覺元素的重復(fù)來更好的組織信息（通常針對(duì)單頁作品）和增強(qiáng)作品的整體性（主要是對(duì)多頁作品）。(1)左圖，同樣的信息，不經(jīng)過重復(fù)分組，整體很難獲取到信息的中心和重點(diǎn)。(2)右圖，當(dāng)我們對(duì)對(duì)信息進(jìn)行“重復(fù)”分組。讀者很容易從中獲取到有用的信息。四大原則

重復(fù)根本目的：讓元素重復(fù)出現(xiàn)，目的就是統(tǒng)一，并增強(qiáng)17四大原則

重復(fù)如何實(shí)現(xiàn)1.從標(biāo)題和子標(biāo)題入手要?jiǎng)?chuàng)建重復(fù)元素，可以從標(biāo)題和子標(biāo)題入手，這是一個(gè)很好的起點(diǎn)，因?yàn)檫@些元素很可能在某個(gè)方面是一致的。2.其他可以專門做一個(gè)圖片設(shè)計(jì)，并且將某些一致元素（如標(biāo)題）作為這個(gè)圖片設(shè)計(jì)的一部分。要避免的問題要避免太多地重復(fù)一個(gè)元素，重復(fù)太多會(huì)讓人討厭。四大原則

重復(fù)如何實(shí)現(xiàn)18四大原則

重復(fù)如何實(shí)現(xiàn)1.從標(biāo)題和子標(biāo)題入手要?jiǎng)?chuàng)建重復(fù)元素，可以從標(biāo)題和子標(biāo)題入手，這是一個(gè)很好的起點(diǎn)，因?yàn)檫@些元素很可能在某個(gè)方面是一致的。2.其他可以專門做一個(gè)圖片設(shè)計(jì)，并且將某些一致元素（如標(biāo)題）作為這個(gè)圖片設(shè)計(jì)的一部分。要避免的問題要避免太多地重復(fù)一個(gè)元素，重復(fù)太多會(huì)讓人討厭。四大原則

重復(fù)如何實(shí)現(xiàn)19四大原則

重復(fù)重復(fù)是指設(shè)計(jì)的內(nèi)容中有些方面需要在整個(gè)作品中重復(fù)，重復(fù)的元素可能是字體、顏色、格式等。在設(shè)計(jì)中，我們常常將將權(quán)重相等的內(nèi)容用相同的性質(zhì)表現(xiàn)出來。重復(fù)的目的是統(tǒng)一，并增強(qiáng)視覺效果，但要避免過多地重復(fù)一個(gè)元素，讓人感覺不太舒服，要注意對(duì)比的價(jià)值。四大原則

重復(fù)重復(fù)是指設(shè)計(jì)的內(nèi)容中有些方面需要在整個(gè)作品中重20四大原則

重復(fù)顏色、圖標(biāo)、構(gòu)圖等重復(fù)出現(xiàn)，頁面的一致性得到提升四大原則

重復(fù)顏色、圖標(biāo)、構(gòu)圖等重復(fù)出現(xiàn)，頁面的一致性得到提21四大原則

對(duì)比根本目的：增強(qiáng)頁面效果、有助于信息的組織各種元素（字體、顏色、大小、線寬、空間…）不相同，就讓它們徹底不同。(1)左圖，它們之間有對(duì)比，但是很弱。讓人有種覺得是不是作者選錯(cuò)了字體，而不會(huì)認(rèn)為是特意選擇的。(2)右圖，要不同，我們就讓它們“大大的不同”。四大原則

對(duì)比根本目的：增強(qiáng)頁面效果、有助于信息的組織(1)22四大原則

對(duì)比如何實(shí)現(xiàn)1.常用的對(duì)比方式要增加有意思的對(duì)比，最容易的方法就是實(shí)現(xiàn)字體對(duì)比（這也是本書第二部分的重點(diǎn)）。不過不要忘記，還可以利用線、顏色、元素之間的間隔、材質(zhì)等形成對(duì)比。要避免的問題如果兩個(gè)項(xiàng)不完全一樣，干脆讓他們截然不同。如果兩個(gè)元素雖然不同，但是區(qū)別不大，這時(shí)候就不是對(duì)比了，而是沖突。不應(yīng)該用12磅大小的字體與14磅大小的字體進(jìn)行對(duì)比。四大原則

對(duì)比如何實(shí)現(xiàn)23四大原則

對(duì)比要避免頁面上的元素太過類似。如果元素(字體、顏色、大小、線寬、形狀、空間等)不相同，那就干脆讓它們截然不同。要讓頁面引人注目，對(duì)比通常是最重要的一個(gè)因素，正是它能使讀者首先看這個(gè)頁面。四大原則

對(duì)比要避免頁面上的元素太過類似。如果元素(字體、顏24四大原則

小結(jié)作者總結(jié)了好設(shè)計(jì)遵循的四大基本原則，它們可以幫助我們更好地提升自己的設(shè)計(jì)水平，比如制作簡(jiǎn)歷、PPT，甚至是寫一篇文章（本文貼的圖基本都沒做好對(duì)齊……）；它們也可以幫我們更客觀的去評(píng)價(jià)我們見到的作品，而不只是簡(jiǎn)單的說出自己的主管感受。另外，作者在介紹理論的同時(shí)給出了很多具體的例子幫助讀者更好地理解四大原則，非常值得一讀。顏色和字體顏色和字體是設(shè)計(jì)作品中最常使用的元素之一，作者同樣深入淺出的介紹了如何為作品選擇合適的顏色組合和字體組合。

四大原則

小結(jié)作者總結(jié)了好設(shè)計(jì)遵循的四大基本原則，它們可以幫25實(shí)例實(shí)例26實(shí)例實(shí)例27實(shí)例實(shí)例28實(shí)例隔行間隔均勻，充滿整個(gè)畫面看不出各行內(nèi)容之間的聯(lián)系YourAttitudeIsYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9如何實(shí)現(xiàn)親密性？實(shí)例隔行間隔均勻，充滿整個(gè)畫面YourAttitude如29實(shí)例如何實(shí)現(xiàn)親密性？隔行間隔均勻，充滿整個(gè)畫面看不出各行內(nèi)容之間的聯(lián)系YourAttitudeIsYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9YourAttitudeisYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9實(shí)例如何實(shí)現(xiàn)親密性？隔行間隔均勻，充滿整個(gè)畫面YourA30實(shí)例如何實(shí)現(xiàn)親密性？隔行間隔均勻，充滿整個(gè)畫面看不出各行內(nèi)容之間的聯(lián)系YourAttitudeIsYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9YourAttitudeisYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9通過設(shè)置不同間隔來指示各項(xiàng)的接近程度或關(guān)系重要性。實(shí)例如何實(shí)現(xiàn)親密性？隔行間隔均勻，充滿整個(gè)畫面YourA31實(shí)例如何實(shí)現(xiàn)對(duì)齊？居中對(duì)齊是一種合法的對(duì)齊方式，但邊界是“軟”的，看不出“對(duì)齊線”的強(qiáng)度。而文本左對(duì)齊或右對(duì)齊能夠讓文本聯(lián)系起來的線更明確。文本外觀更清晰、效果更分明。YourAttitudeisYourLifeLessonsfromraisingthreechildrenasasinglemomRobinWilliamOctober9實(shí)例如何實(shí)現(xiàn)對(duì)齊？居中對(duì)齊是一種合法的對(duì)齊方式，但邊界是“軟32實(shí)例如何實(shí)現(xiàn)對(duì)齊？居中對(duì)齊是一種合法的對(duì)齊方式，但邊界是“軟”的，看不出“對(duì)齊線”的強(qiáng)度。而文本左對(duì)齊或右對(duì)齊能夠讓文本聯(lián)系起來的線更明確。文本外觀更清晰、效果更分明。YourAttitudeisYourLifeLessonsfromraisingthreechildrenasasingle