作為一個產(chǎn)品，我并不是很認同當今視覺設(shè)計界一些潮流，比如不假思索地留白。

留白、減少視覺壓力幾乎是如今的視覺設(shè)計師張口必談的話題。

無論做的是什么樣的界面，只要有足夠留白，界面里面就被稱之為高大上；而如果界面做得擁擠，就會被認為器小，甚至被稱之為“美工”。

但是我想說的是，視覺設(shè)計師和美工的區(qū)別不在與此，而在于有沒有根據(jù)場景區(qū)別化設(shè)計的能力。

問題的來源

有一些看似簡單的視覺問題，會對產(chǎn)品造成非常大的影響。

我第一次深度意識到這個問題，是在上一家公司做互聯(lián)網(wǎng)招聘產(chǎn)品的產(chǎn)品經(jīng)理。當時，B端產(chǎn)品剛剛進入風(fēng)口。傳統(tǒng)B端產(chǎn)品用戶體驗差，界面難看，是一個很重要的改進方向。公司也花了重金聘請高級視覺設(shè)計師。開始對一些界面做升級。

剛開始的時候，我們也非常贊同專業(yè)的人員做專業(yè)的事情，他們做出來的界面也非常賞心悅目，其中包括簡歷詳情頁。他們采用了大量的留白和圖形化標識，使得界面非常清爽簡潔，幫助HR看簡歷的時候減少視覺壓力，大幅度提升舒適感。

但是，產(chǎn)品上線之后，情況非常糟糕——HR每日瀏覽的簡歷數(shù)量下降了近40%。

我們剛開始以為只是改版的磨合期，但是數(shù)據(jù)后來一直維持在低位，并且開始有HR陸陸續(xù)續(xù)向客戶經(jīng)理反饋現(xiàn)在看簡歷的時候非常不方便。

以前，簡歷第一屏的信息就足夠豐富了，HR掃一眼就能做出決策，然后繼續(xù)查看“下一份”。但是現(xiàn)在，總是需要上下滾動屏幕，操作麻煩，而且思路不連貫。

那么是不是我們內(nèi)容的順序不對呢？把最重要的放到第一屏不就可以了嗎？

后來事實證明，這種區(qū)分主次的C端產(chǎn)品的思路在B端產(chǎn)品這里根本站不住腳。對于HR來說，除了項目經(jīng)驗這項稍微不太重要外，其他的如教育背景、工作年限、工作公司等信息，都非常重要。具體重要性的排名，不同的HR有所不同，且同一個HR在不同時期也不同。經(jīng)過思考和權(quán)衡發(fā)現(xiàn)，最好的解決辦法仍是讓這些項目都在一屏顯示，但是界面會非常擁擠。

做出綜合決策的時候，總是希望一眼能掃到所有的信息。后來，我開始不斷的推動界面緊湊化改版，尤其是簡歷界面，數(shù)據(jù)效果和反饋越來越好。

但是視覺設(shè)計師總是抵觸的，因為與他們的認知不相符，他們的觀念里仍然認為：沒有足夠留白的視覺設(shè)計拿不出手。

除此之外，我還開始注意到，B端留白較多的松散界面導(dǎo)致很多的問題。比如列表管理頁，如果列表上下間距大，會使得批量操作、按時間找內(nèi)容、翻頁等操作非常麻煩；列表字段的間距大，會使得列表中字段太少，展示是信息不充分，總是需要頻繁點詳情頁查看。

為何留白總被視作無需置疑的真理？

視覺留白在視覺設(shè)計領(lǐng)域如此被深信不疑，有很重要的一個原因是歐美發(fā)達國家互聯(lián)網(wǎng)產(chǎn)品界面都看起來簡潔，留白很多；于是引導(dǎo)的審美潮流就成了這樣的。至于為什么歐美界面留白多，我之前的文章有分析（《為什么歐美國家的產(chǎn)品界面更簡潔，你們可能想多了》）

有人說留白是因為視覺負荷；我個人是有認知心理學(xué)背景的，我可以很負責(zé)任的說，視覺負荷這個詞有被過度強調(diào)了。有人利用短時記憶理論“神奇的數(shù)字7”來說明界面上的區(qū)塊不應(yīng)該超過7個，但是實際上，界面中的視覺信息并不需要存儲在短時記憶中，所以根本沒有這樣的短時記憶限制。

我作為一個產(chǎn)品，如果你視覺設(shè)計師做出來的界面的數(shù)據(jù)效果比我做的原型扔上去都要差，那么你做這個界面的意義何在？我最近幾年的工作經(jīng)歷都是做B端以及SAAS產(chǎn)品，碰到視覺設(shè)計師不合時宜的留白導(dǎo)致的問題實在是非常之多。

我并不是反對留白，只是認為要分場景。無法區(qū)分場景而肆意留白的視覺設(shè)計師不是設(shè)計師，只是更美的美工。

如何識別場景

我們需要分清楚以下不同的維度：

• 信息管理界面與信息展示界面的不同；
• 主動使用與被動使用的不同；
• 用戶是否經(jīng)常使用界面，是否熟悉界面；
• B端產(chǎn)品和C端產(chǎn)品的不同。

信息管理界面與信息展示界面的不同

信息管理界面，就是需要用戶進行操作的界面，比如增刪查改。

信息管理界面往往需要用戶對列表項進行對比、識別，然后做出操作。這種界面，一定要保持緊湊，減少用戶頻繁上下滾動界面，否則思路容易被打斷。

信息展示界面，往往是純粹瀏覽的頁面，所以從上到下滾動查看也沒有什么問題，這種情況下可以適當多留白。

主動使用與被動使用的不同

主動使用者，要做一件事情時，是目的明確的且對做這個任務(wù)的難度是有預(yù)期的，那么你優(yōu)先要考慮的是效率。

比如說電商后臺發(fā)布一個產(chǎn)品詳情或招聘網(wǎng)站發(fā)布一個職位，這些都是字段較多、比較復(fù)雜的表單。有的設(shè)計師擔(dān)心這么復(fù)雜的一個表單，會把用戶嚇跑，于是就加字段間的大留白，減少用戶的視覺壓力。

但是實際上用戶感受到的場景與設(shè)計師是不一樣的，用戶是一個主動使用者，他本身就知道發(fā)布一個產(chǎn)品信息不是那么簡單的事情，那么你所能做的最好的事情，就是讓用戶能盡快的看到并填寫所有字段，而不是拉長頁面高度，增加用戶滾動屏幕的操作。而且頁面拉的太長，會導(dǎo)致有些表單上下文之間的聯(lián)系中斷。

被動使用者，往往是被一些模糊的場景吸引，然后想了解更多。比如說用戶對你的活動感興趣，想要報名你的活動。那么這種情況下，用戶往往是沒有預(yù)期的，如果你給用戶看到的界面或表單很密集的話，那么確確實實會把用戶嚇跑。這種時候，需要注意降低界面信息量，多留白。

用戶是否熟悉

所謂的視覺壓力，往往只會在初次時感受明顯，使用過幾次后，視覺壓力的副作用就會急劇下降，甚至被用戶忽略；但是操作的不方便確是實實在在的，而且副作用會隨著使用的熟練程度越來越明顯。

對于用戶可能會經(jīng)常使用的界面，應(yīng)該以效率優(yōu)先，尤其需要珍重界面第一屏的像素，不要隨意留白浪費空間；比如上文中提到的HR篩選簡歷的頁面。

對于用戶不太可能經(jīng)常使用的界面，比如看過一兩次就不會再看的宣傳頁，應(yīng)該以視覺舒適度優(yōu)先；那么適當?shù)牧舭拙褪荗K的。

B端產(chǎn)品和C端產(chǎn)品的不同

B端的產(chǎn)品，往往是管理信息界面，且是用戶主動使用的有預(yù)期的，也是用戶經(jīng)常使用的，所以B端產(chǎn)品的界面，真的不需要你給他那么多留白。

而C端的產(chǎn)品往往不太一樣，需要時情況而定。C端界面一般留白會相對較多。

比如亞馬遜，C端買家的界面留白就比較多。但是B端賣家的管理界面密集程度也是超過你想象的。

QQ郵箱的例子

在所有的效率型產(chǎn)品中，我最喜歡的就是QQ郵箱界面。

QQ郵箱雖然起步晚，但是目前是國內(nèi)最成功的郵箱。

QQ郵箱堪稱是效率型產(chǎn)品的典范。

在很多視覺設(shè)計師看來QQ郵箱界面很糟糕，幾乎完全沒有留白，密密麻麻全是字。

但是，如果作為郵箱的重度用戶，QQ郵箱的體驗是無與倫比的。QQ郵箱在1080高度的顯示器上，能在一頁顯示完整個列表。對于經(jīng)常要按時間找郵件的人，非常方便。哪怕在小一點的屏幕上，也只要稍微滾動一下鼠標滾輪，就能看全。

對于這種效率型的產(chǎn)品，留白幾乎沒有任何意義。

QQ郵箱的設(shè)計，看起來好像也沒什么，不就是做得密密麻麻了嗎？但是要在整個設(shè)計行業(yè)人云亦云的大潮流之下，大家都說界面要大面積留白的情況下，果斷地不隨波逐流，做出一個真正用戶需要的界面，這才叫真正的設(shè)計！

反面的例子

比較遺憾的是，有的視覺設(shè)計師總是不太接受理性的東西。有的時候，產(chǎn)品和交互無論怎么要求界面緊湊，講再多的道理，視覺設(shè)計師仍然無動于衷；畢竟有的時候，人云亦云的力量實在過于強大，他們體會不到用戶真實操作時候的感受，仍然把不假思索的留白當做真理。

下圖是我們現(xiàn)在做的一個B端產(chǎn)品的列表管理頁（為了避免可能的問題，界面文字已經(jīng)模糊處理）。一個管理列表的界面，在1080高度的屏幕下，第一屏居然只能顯示4個列表項，而在主流的768高度的屏幕下，第一屏只能顯示2個列表項。這哪是一個列表管理頁？我們的產(chǎn)品中的其他某些重要的界面，就有用戶直接提到過界面太松散，很不方便。這種過度留白，非常不符合場景。但是視覺比較強勢，而我沒有成功說服，我也有責(zé)任，后面只能慢慢改進了。

總結(jié)

留白，作為很多視覺設(shè)計師不假思索的基本準則，很多時候是不對的，需要根據(jù)具體的場景區(qū)分。

很多時候減少留白反而能對整體用戶體驗有巨大的提升；效率型產(chǎn)品的視覺設(shè)計的思路不應(yīng)該是簡單的留白，而應(yīng)該是幫助用戶識別信息，提高操作效率。在這種思路下，視覺設(shè)計還有很多要做的。