聲明：
1. 粗略回答此題，此答案目的在于授予漁之技，而非展示魚之貌，因此請(qǐng)閱讀重點(diǎn)。所以，也請(qǐng)各路語言潔癖咬文嚼字美學(xué)鑒賞黨慎入；
2. 本答案僅就一般規(guī)律進(jìn)行總結(jié)，旨在傳授個(gè)人經(jīng)驗(yàn)于行業(yè)新人。如果你自認(rèn)是行業(yè)老鳥或高手，請(qǐng)慎入。另外，請(qǐng)不要拿個(gè)例來進(jìn)行反駁推翻。
3. 重點(diǎn)部分已加粗。
一、我們所說的細(xì)節(jié)是什么
讓我們先來定義一下，在設(shè)計(jì)中，普通觀看者，會(huì)把什么當(dāng)作為細(xì)節(jié)。
在看完以上對(duì)比后，我先來問幾個(gè)問題。
第一個(gè)問題：
各位可以根據(jù)自己對(duì)于「細(xì)節(jié)」二字的理解，從以上兩張圖中，選擇出你認(rèn)為更有「細(xì)節(jié)」的一圖。
第二個(gè)問題：
不管你選擇的是哪一個(gè)，請(qǐng)你說出你認(rèn)為該圖有「細(xì)節(jié)」的緣由。 先不急著給「細(xì)節(jié)」二字下結(jié)論，讓我們?cè)賮砜纯戳硪唤M對(duì)比。而這次的對(duì)比，會(huì)復(fù)雜一些。
還是和之前一樣。請(qǐng)大家來回答我?guī)讉�(gè)問題。
第一個(gè)問題：
各位依然根據(jù)自己對(duì)于「細(xì)節(jié)」二字的理解，來選擇出你們認(rèn)為更有細(xì)節(jié)的是哪張圖？
第二個(gè)問題：
請(qǐng)把你在前圖中，總結(jié)出的對(duì)于「細(xì)節(jié)」的原因，套用到現(xiàn)在這兩張圖中來，看看你所定義的產(chǎn)生「細(xì)節(jié)」的原因，是否依然存在？
現(xiàn)在，我就來將大家看到前面幾張圖時(shí)的心理活動(dòng)進(jìn)行一個(gè)還原。
第一組對(duì)比圖：
在這樣兩張對(duì)比中，大多數(shù)人會(huì)認(rèn)為第二個(gè)「我」字更有細(xì)節(jié)。這里的細(xì)節(jié)感來自于畫面中的裝飾性元素（投影）。
一張圖，我們的視覺能夠在上面停留的點(diǎn)或者時(shí)間，相對(duì)來說越多越久，我們的心理感受便會(huì)認(rèn)為這張圖越有細(xì)節(jié)。
就拿上面兩張圖來說，第一張圖，我們?cè)诳催^之后，大約僅零點(diǎn)一秒不到的時(shí)間，就可以反應(yīng)出，圖中只有一個(gè)漢字而已。而這時(shí)候，我們的視覺與大腦會(huì)立刻做出后面兩種反應(yīng)中的一個(gè)。
第一種反應(yīng)，我們會(huì)立刻在畫面中去尋找可以供我們觀看的第二個(gè)元素。如果找不到，那么我們就會(huì)立刻將注意力從畫面上轉(zhuǎn)移。
而第二種反應(yīng)，是我們會(huì)立刻從畫面上轉(zhuǎn)移注意力，不再觀看了，因?yàn)闆]有可以看的內(nèi)容。
接下來，我還是通過圖例的方式，來讓大家感受一下裝飾性元素對(duì)于細(xì)節(jié)感的影響。
上圖，是一個(gè)按鈕。是一個(gè)沒有任何設(shè)計(jì)裝飾的按鈕，這個(gè)按鈕以最直白的漢字為表現(xiàn)形式。
而接下來，大家看到的圖，是增加了起伏、投影、亞克力質(zhì)感等多種裝飾性手法的按鈕。
大家可以自己感受一下，哪一個(gè)會(huì)讓我們感覺更有細(xì)節(jié)。
還是讓我們結(jié)合之前所說的，視覺停留時(shí)間的問題。
第一個(gè)按鈕，我們看到之后，大腦會(huì)立刻做出反應(yīng)，這是兩個(gè)漢字而已，接下來，我們會(huì)開始主動(dòng)尋找第二個(gè)視覺停留點(diǎn)。這時(shí)候，我們會(huì)注意到灰色的底色，再接下來，我們有可能會(huì)注意到深灰色的文字。但是，當(dāng)我們把這一切全部都觀察結(jié)束后，當(dāng)我們無法再?gòu)漠嬅嬷姓业娇晒┯^看的點(diǎn)時(shí)，我們便會(huì)轉(zhuǎn)移視線。
而第二個(gè)擬物設(shè)計(jì)的按鈕。我們第一眼會(huì)看到文字，接下來看到的是灰色底色，再接下來看到的是凸起的按鈕，倒角弧邊，模仿亞克力質(zhì)感的光影關(guān)系，文字下方的疊加投影等等。由于有更多的裝飾性元素，所以，我們的視線會(huì)比第一張圖停留時(shí)間更長(zhǎng)，我們也會(huì)認(rèn)為第二張圖更有細(xì)節(jié)。 以上，是產(chǎn)生細(xì)節(jié)感的第一個(gè)原因。
我們視覺的停留時(shí)間，決定了我們是否會(huì)認(rèn)為畫面更具有細(xì)節(jié)。而增加畫面的裝飾元素，是增強(qiáng)細(xì)節(jié)的一個(gè)手段之一。
接下來，開始分析我們?cè)谇懊婵吹降牡诙M對(duì)比圖。
這兩組對(duì)比圖，都是畫面復(fù)雜且雜亂的。結(jié)合我們上面所說，畫面里的內(nèi)容都是豐富的。這些豐富的內(nèi)容，不管是不是來自于人為的設(shè)計(jì)，都可以使得我們的視覺在畫面中停留很長(zhǎng)時(shí)間。但是，我相信會(huì)有很多人會(huì)認(rèn)為第二副更細(xì)節(jié)感。
而第二張圖的細(xì)節(jié)感，來自于畫面的構(gòu)圖（中軸線式）。
這樣的構(gòu)圖方式使得本來色彩與物件雜亂的畫面，增添了一點(diǎn)規(guī)則感。而我們所認(rèn)為的細(xì)節(jié)，其實(shí)就來自于規(guī)則感。
第一張圖，雖然畫面中有很多內(nèi)容可供觀看，但是，這些內(nèi)容，無論是擺放的位置，還是色調(diào)，都是雜亂的。所以，即便有很多內(nèi)容可供觀看，雜亂的布局會(huì)影響觀看者的情緒，使得觀看者不愿多看下去了。 而第二張圖。雖也是雜亂的色彩與物件，但是，由于有了中軸線式的對(duì)稱構(gòu)圖�？梢匀藶榈模沟糜^看者的視覺疲勞降低。先看整體，再看左邊，接著再看右邊。人的視覺活動(dòng)被構(gòu)圖形式引導(dǎo)。所以，細(xì)節(jié)感便來自于此。
以上，是兩個(gè)基礎(chǔ)的測(cè)試環(huán)節(jié)。其實(shí)，我已經(jīng)把產(chǎn)生「細(xì)節(jié)」的兩大要素告訴各位了。
畫面中的裝飾元素進(jìn)行規(guī)則規(guī)律的出現(xiàn)（擺放），是使得觀看者產(chǎn)生細(xì)節(jié)感的另一個(gè)原因。
二、簡(jiǎn)潔的界面怎么樣讓用戶覺得很有細(xì)節(jié)？
在前面，我提到過，裝飾性元素會(huì)讓畫面有細(xì)節(jié)感。但是，這些裝飾元素的堆砌，與簡(jiǎn)潔其實(shí)并不沖突。我們還是來看圖例。
上面兩組對(duì)比。如果僅僅從所謂的「簡(jiǎn)潔」的角度出發(fā)來看，明顯是第一張圖更加簡(jiǎn)潔。但是，我們不會(huì)認(rèn)為第一張圖比第二張圖更有細(xì)節(jié)。
所以說，裝飾設(shè)計(jì)的細(xì)節(jié)，與簡(jiǎn)潔之間是沒有關(guān)系的。
有些設(shè)計(jì)，之所以給人感覺既簡(jiǎn)潔，也有細(xì)節(jié)。是因?yàn)樵O(shè)計(jì)元素在畫面中高度統(tǒng)一和諧。
由于問題問的是界面設(shè)計(jì)，所以，后面的列子，我就以界面設(shè)計(jì)來做舉例。
上個(gè)月，我很想找一款用來寫日記的APP。找了很久很久，也看到不少用戶推薦的應(yīng)用。可是下載完，打開后，我就不想再開第二次。
因?yàn)榻缑嬖O(shè)計(jì)的太粗糙。我感覺將我的心情用那樣的界面應(yīng)用記錄下來，是對(duì)自己情緒的不負(fù)責(zé)任。
我需要的APP其實(shí)很簡(jiǎn)單，簡(jiǎn)潔，易用，可以多平臺(tái)同步。能夠插入圖片與音頻視頻。
可是，下載后的一些應(yīng)用。
設(shè)計(jì)粗糙。粗糙來自于哪里？來自于元素的不和諧。低幼化的字體，將整個(gè)界面的設(shè)計(jì)分拉低。
簡(jiǎn)潔，但具有細(xì)節(jié)的設(shè)計(jì)。是指所出現(xiàn)的元素和諧統(tǒng)一。
即便是裝飾性的設(shè)計(jì)，也是符合整個(gè)畫面基調(diào)，不會(huì)出現(xiàn)違和感的元素（色彩、字體、圖形等）。
上面的圖，即便簡(jiǎn)潔，但是卻有一種山寨感，就是因?yàn)樵兀ㄎ淖值淖煮w）與畫面風(fēng)格不統(tǒng)一。商務(wù)感的灰色背景與虛線，卻搭配上了低幼感的字體。
三、如何設(shè)計(jì)出簡(jiǎn)潔，但又有細(xì)節(jié)感的界面？
第一步：學(xué)會(huì)做加法
積累屬于你自己的素材庫(kù)
我有屬于自己的素材庫(kù)，那就是我的腦子。我平時(shí)看得很多。不同于看過就算了的過眼浮略。我每次看到覺得不錯(cuò)的設(shè)計(jì)，我一定會(huì)反復(fù)的問自己，為什么我會(huì)覺得這個(gè)設(shè)計(jì)不錯(cuò)？是配色打動(dòng)了我？字體選擇的很好？構(gòu)圖很好？模特很漂亮？總之，我會(huì)不斷的問自己很多問題，直到清楚究竟。然后，再將我覺得不錯(cuò)這部分記憶下來。存入我腦中的素材庫(kù)里。時(shí)間久了，我腦子里光是標(biāo)題文字的處理形式，毫不夸張的說，起碼有成千上萬種。再將這些設(shè)計(jì)處理方式任意進(jìn)行組合排列，我都可以演變出數(shù)百萬種新的裝飾手法。
這一部分的心得，我在問題：學(xué)排版有什么推薦的書籍或者其他途徑嗎？
在我看來，買什么書來學(xué)，并不是最重要的。
重要的是，你帶著怎么樣的眼光來看待問題和學(xué)習(xí)。
有一天，我與一個(gè)做廣告工程的朋友在路上行走，我們同時(shí)觀察到路邊的一個(gè)車站廣告牌。他在乎的是，那個(gè)鋼結(jié)構(gòu)廣告牌的結(jié)構(gòu)原理；而我則看上了畫面中大美女的奇尺大乳！
因此，我的建議是，隨手拿起你購(gòu)買的報(bào)紙，帶著思考與疑問去閱讀：
1. 當(dāng)你感覺閱讀比較順暢時(shí)，你應(yīng)該思考，到底是哪些方面讓你感覺順暢？是文字的行距還是文字的間距。
2. 當(dāng)你感覺閱讀輕松時(shí)，你應(yīng)該思考，到底是哪些方面讓你感覺輕松？是字號(hào)的大小剛好，還是文字顏色選擇的復(fù)合你的習(xí)慣？
3. 當(dāng)你對(duì)某則新聞內(nèi)容深信不疑時(shí)，你應(yīng)該思考，到底是文章的內(nèi)容有理有據(jù)，還是標(biāo)題字體的選擇讓你覺得中規(guī)中矩的認(rèn)可？
以下就不再一一列舉。只你帶著發(fā)現(xiàn)與思考的眼光去閱讀，哪怕新華字典都會(huì)是你學(xué)習(xí)版式設(shè)計(jì)的好老師。
帶著疑問去觀察，去學(xué)習(xí)，去記憶。將別人的變成自己的，在腦中，積累屬于你自己的素材庫(kù)。
第二步：學(xué)會(huì)做減法
學(xué)會(huì)發(fā)現(xiàn)問題，避免這些問題出現(xiàn)在自己的設(shè)計(jì)中，就是在做減法。
看得多了，腦子會(huì)亂。在學(xué)習(xí)的時(shí)候，除了知道要吸取什么，也要知道丟棄什么。
知道不能怎么做，與知道要怎么做，同樣重要！
四、簡(jiǎn)潔的界面怎么樣讓用戶覺得很有細(xì)節(jié)？（總結(jié)）
1.先積累屬于你自己的素材庫(kù)，這樣你可以解決缺乏細(xì)節(jié)的問題。
2.再通過尋找素材（裝飾設(shè)計(jì)手法）中的規(guī)律，去解決簡(jiǎn)潔的問題。
3.素材（構(gòu)圖、色彩、圖形、字體等等）之間關(guān)系和諧統(tǒng)一了，設(shè)計(jì)便自然簡(jiǎn)潔了！
本文作者：@eno-one，新浪微博：-eno-one-
本文由@yunyi在知乎整理的文章，轉(zhuǎn)載請(qǐng)注明出處并保留原文鏈接。
感謝您對(duì)極地作品的預(yù)覽，品牌策劃與設(shè)計(jì)，形象店設(shè)計(jì)制作，專注中高端品牌策劃設(shè)計(jì)，我們更專業(yè)，歡迎咨詢微信/手機(jī)：13656226579 0512-89169975 www.fulefood.cn
|
