4大基本設計原則

摘抄學習自《寫給大家看的設計書》by Robin Williams

?對比 Contrast

要避免頁面上的元素太過相似。如果元素不相同吱七,那么就干脆讓他們截然不同汽久。

重復 Repetition

讓設計中的視覺要素在整個作品中重復出現(xiàn)。既能增加條理性踊餐,還可以加強統(tǒng)一性景醇。

對齊 Alignment

任何東西都不能再頁面上隨意安放。每個元素都應當與頁面上另一個元素有某種視覺聯(lián)系吝岭。

親密性 Proximity

彼此相關的項應當靠近三痰,歸組在一起吧寺。有助于組織信息,減少混亂散劫,為讀者提供清晰的結構稚机。


對比

如果兩個項不完全相同,就應當使之不同获搏,而且應當截然不同赖条。要想實現(xiàn)有效的對比,就必須強烈颜凯,千萬不要畏畏縮縮谋币。

具體

不要害怕讓一些項很小,這樣不僅可以與更大的項形成對比症概,還能留出更多的空白蕾额。

對比的根本目的,一是增強頁面的效果彼城;二是有助于信息的組織诅蝶,讓讀者能立即了解信息以何種方式組織,以及從一項到另一項的邏輯流程募壕。

對比元素不能讓讀者混淆调炬,也不能錯誤地強調重點。

要避免的問題

如果想形成對比舱馅,就加大力度缰泡。

要避免使用兩種或多種類似的字體。

如果各個項不完全一樣代嗤,就干脆讓它們截然不同棘钞。



重復

讀者能看到的任何方面都可以作為重復元素。設計的某些方面需要在整個作品中重復干毅。

具體

有時重復的項并不一定完全相同宜猜,而只是存在明確關聯(lián)的緊密相關的對象。

使用重復原則時硝逢,有時可以把一個元素從現(xiàn)在的設計中抽取出來姨拥,并根據(jù)這個元素創(chuàng)建一個新設計。

不要把重復用的太濫渠鸽,而應當盡量“采用多樣性實現(xiàn)統(tǒng)一”叫乌。也就是說,如果一個重復元素很明確徽缚,那么可以采用多種不同方式重復這個元素综芥,而不是簡單地重復同一個元素。

重復的根本目的就是統(tǒng)一猎拨,并增強視覺效果膀藐。

具體實現(xiàn)方式

重復可以認為是保持一致性。

可以增加一些純粹為建立重復而設計的元素红省。

要避免的問題

要避免太多地重復一個元素额各,重復太多會讓人討厭。要注意對比的價值吧恃。



對齊


定義

任何元素都不能再頁面上隨意安放虾啦。每一項都應當與頁面上的某個內容存在某種視覺聯(lián)系。

具體

居中對齊是初學者最常用的對齊方式痕寓,這種對齊看起來很安全傲醉,感覺上也很舒服。居中對齊會創(chuàng)造一種更正式呻率、更穩(wěn)重的外觀硬毕,這種外觀顯得更中規(guī)中矩,但通常也很乏味礼仗。

一定要堅持一個原則:頁面上只使用一種文本對齊吐咳,所有文本都左對齊、或右對齊元践、或者全部居中韭脊。

在頁面上放其他項時,一定要確保每一項都與頁面上的其他項存在某種對齊单旁。

我們的眼睛喜歡看到有序的事物沪羔,這會給人一種平靜、安全的感覺象浑。此外也有助于表達信息蔫饰。

應當找一條明確的對齊線,并用它來對齊融柬。

如果涉及中的對齊很明確死嗦,那么可以有意識地打破對齊,但一定要表現(xiàn)出這是有意的粒氧。一定要干脆一些越除,要么全部采用一種方式,要么全都不采用這種方式外盯。千萬不要保守摘盆。

但,在打破規(guī)則之前必須清楚規(guī)則是什么饱苟。

對齊的根本目的是是頁面統(tǒng)一而且有條理孩擂。

具體實現(xiàn)方式

要特別注意元素放在那里。應當總能在頁面上找出與之對齊的元素箱熬,盡管這兩個對象的物理位置可能相距甚遠类垦。

要避免的問題

要避免在頁面上混合使用多種文本對齊方式狈邑。

要著力避免居中對齊,除非有意識地想要穿件一種比較正式蚤认、穩(wěn)重的表示米苹。并不是完全杜絕,但不要把它作為默認選擇砰琢。



親密性


定義

將相關的項組織在一起蘸嘶,移動這些項,使它們的物理位置相互靠近陪汽,那么相關的項將被看作凝聚為一體的一個組训唱。

具體

需要清楚哪些信息應當重要,哪些信息不用強調挚冤,可以通過分組形象地表現(xiàn)這種信息况增。

親密性的思想并不是說所有的一切都要更加靠近,其真正的含義是:如果某些元素在理解上存在關聯(lián)你辣,或者相互之間存在某種聯(lián)系巡通,那么這些元素在視覺上也應當有所關聯(lián)。

親密性的根本目的是實現(xiàn)組織性舍哄。如果信息更有條理宴凉,將更容易閱讀,也更容易被記住表悬。

親密性的副產(chǎn)品

可以使空白更美觀弥锄,也更有條理。

具體實現(xiàn)方式

微微瞇起眼睛蟆沫,統(tǒng)計眼睛停頓次數(shù)來數(shù)一數(shù)頁面上有多少個元素籽暇。如果頁面上的項超過3~5個(it depends),就要看看哪些孤立元素可以跪在一組簡歷更近的親密性饭庞,使之成為一個視覺單元戒悠。

要避免的問題

不要僅僅因為有空白就把元素放在角落或中央。

避免一個頁面上有太多孤立的元素舟山。

不要在元素之間留出同樣大小的空白绸狐,除非各組同屬于一個子集。

標題累盗、子標題寒矿、圖標標題、圖片能否歸入其相關材料若债?在這個問題上一定要非常清楚符相。在有很近親密性的元素之間建立關系。

不同屬一組的元素之間不要建立關系蠢琳。如果元素彼此無關啊终,要把它們分開镜豹。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市蓝牲,隨后出現(xiàn)的幾起案子逛艰,更是在濱河造成了極大的恐慌,老刑警劉巖搞旭,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異菇绵,居然都是意外死亡肄渗,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進店門咬最,熙熙樓的掌柜王于貴愁眉苦臉地迎上來翎嫡,“玉大人,你說我怎么就攤上這事永乌』笊辏” “怎么了?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵翅雏,是天一觀的道長圈驼。 經(jīng)常有香客問我,道長望几,這世上最難降的妖魔是什么绩脆? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮橄抹,結果婚禮上靴迫,老公的妹妹穿的比我還像新娘。我一直安慰自己楼誓,他們只是感情好玉锌,可當我...
    茶點故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著疟羹,像睡著了一般主守。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上阁猜,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天丸逸,我揣著相機與錄音,去河邊找鬼剃袍。 笑死黄刚,一個胖子當著我的面吹牛,可吹牛的內容都是我干的民效。 我是一名探鬼主播憔维,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼涛救,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了业扒?” 一聲冷哼從身側響起检吆,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎程储,沒想到半個月后蹭沛,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡章鲤,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年摊灭,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片败徊。...
    茶點故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡帚呼,死狀恐怖,靈堂內的尸體忽然破棺而出皱蹦,到底是詐尸還是另有隱情煤杀,我是刑警寧澤,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布沪哺,位于F島的核電站沈自,受9級特大地震影響,放射性物質發(fā)生泄漏凤粗。R本人自食惡果不足惜酥泛,卻給世界環(huán)境...
    茶點故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望嫌拣。 院中可真熱鬧柔袁,春花似錦、人聲如沸异逐。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽灰瞻。三九已至腥例,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間酝润,已是汗流浹背燎竖。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留要销,地道東北人构回。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親纤掸。 傳聞我的和親對象是個殘疾皇子脐供,可洞房花燭夜當晚...
    茶點故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內容