也許你已經(jīng)發(fā)現(xiàn)了，今年來越來越多的網(wǎng)站和應(yīng)用，尤其是那些注重設(shè)計的，都有這樣的趨勢。曾經(jīng)用來劃分區(qū)域的邊框和邊線逐漸消失，然而在干凈的界面上，通過距離分割，各區(qū)域的差別依舊清晰可辨。

　　那么卡片化呢？

　　如果你的設(shè)計思維還停留在卡片話，那就落伍了，因?yàn)闊o框界面的趨勢下，卡片的概念被淡化?？ㄆc否有何重要？反正用戶甚至不會察覺，他們只關(guān)心自己來這里的終目的，界面對他們來說只是搜尋信息的手段之一罷了（如果有很好的搜索功能可用的話，說不定根本不用掃一眼界面）。

　　沒錯，卡片化的由來有它的合理性。幾年前大家注意到顯示屏的尺寸越來越不可預(yù)期，設(shè)計師急需一種設(shè)計手段，來讓設(shè)計出的界面能夠適應(yīng)不同尺寸的屏幕?？ㄆ瑒偤媚軌蚪鉀Q這一點(diǎn)，因?yàn)樗鼘?nèi)容封裝成固定的小區(qū)塊，像水一樣，可以放在任何比自己大的容器中。不但如此，卡片式界面還可以根據(jù)需要隨時刪減卡片，以此靈活控制界面上的內(nèi)容種類和數(shù)量。由此響應(yīng)式界面的大環(huán)境下，卡片化這個詞被越來越多地注意到。

　　其實(shí)無框界面與卡片化并不真正相沖，將內(nèi)容分裝成小區(qū)塊的概念依舊還在，只是此時卡片已經(jīng)完全透明，不需要看到卡片的樣子了。

　　無框的優(yōu)勢？

　　用文字來討論太過抽象，所以我用無框的概念優(yōu)化了一個大家熟悉的有框界面。不要問我是哪個網(wǎng)站，哈哈~

　　下圖：上面的是原版界面，下面的是我修改的無框版。我這個修改主要只是將框去掉而已，然后為了配合無框風(fēng)格對細(xì)節(jié)做了一些修改，目的僅僅是為了對比同一個界面在有框和無框兩種情況下看起來有什么不同。

　　掌控注意力

　　看上圖的原版界面時，眼很有可能看到的是卡片中的邊線，而不是內(nèi)容。這是因?yàn)榘咨ㄆ突疑尘暗膶Ρ确浅Ｃ黠@，而尺寸又很大，所以非常吸引注意力。而卡片中的內(nèi)容，因?yàn)樵诳ㄆ袛D作一團(tuán)，所以很容易被忽視。

　　看上圖中的無框版界面時，因?yàn)闆]有邊線，只有內(nèi)容，所以用戶眼的注意力肯定是在內(nèi)容上。

　　用戶之于界面，寶貴的莫過于注意力。因?yàn)橐粋€產(chǎn)品想要提供給用戶的功能是越多越好，但是用戶的注意力始終只有那么一丁點(diǎn)。所以，掌控用戶的注意力是設(shè)計師的關(guān)鍵使命。如果界面上擺放了過多色彩顯明、吸引注意力的“裝飾”，用戶看到內(nèi)容的幾率變下降了。當(dāng)然，即便有邊框，還是能夠通過對邊框的特殊設(shè)計來控制用戶的注意力不分散，但是邊框越多，難度就越大。