在界面設計中，卡片作為常用設計方式之一，較好地平衡了視覺美感和功用性，在幫助界面從單一信息展示頁跨入更個性的體驗轉變中，發(fā)揮著重要作用。
1 什么是卡片
物理世界中，卡片是用以承載信息的獨立矩形薄片。例如電話卡、明信片、身份證、撲克等均屬此類，其具有外形小巧、方便靈活、內(nèi)部信息獨立、易分發(fā)等特點。
轉至虛擬世界，卡片繼續(xù)延續(xù)了其靈活、易分發(fā)的特點，在內(nèi)容推薦、功能分類等模塊中十分常見。
卡片一般由信息內(nèi)容和操作組成，卡片外部主要呈現(xiàn)該卡片包含的最重要（最具吸引力）信息和操作，卡片內(nèi)部再進行詳細闡述，提升用戶瀏覽和操作效率。如我們常見的Pinterest、Instagram等都采用了卡片式布局的方式來處理和展示信息。
2 為什么卡片好用
1. 極佳的隱喻：卡片是我們物理世界中常見的信息載體，當它延伸至虛擬世界后，其信息結構和交互方式更容易被感知和理解。
2. 極強的內(nèi)容組織力：卡片間相互獨立，歸納組合相同維度內(nèi)容，區(qū)分并聚合不同維度的內(nèi)容，形成清晰連貫的內(nèi)容組合。
3.屏幕拓展：同形態(tài)的卡片排列，欲露未露的一部分可暗示用戶滑動查看更多（獵物獎勵原理，也鼓勵用戶下意識地滑動以獲取更多信息），提高空間利用率。
4.統(tǒng)一性：卡片近乎無窮無盡的變化和組合形式?jīng)Q定了其可以根據(jù)承載設備的尺寸，輕松擴展或者收縮，有利于構建跨設備的統(tǒng)一美學性。
5.抓住注意力：通過模擬景深的效果來表達內(nèi)容信息的層級關系，突出重點內(nèi)容（拉開與背景環(huán)境的差異），具有空間感（吸引力）。
6.靈活性：正因為卡片內(nèi)容的相互獨立，決定了卡片間可以隨意組合、動態(tài)呈現(xiàn)重點，幫助用戶更有效地獲取對其有用的信息。
7. 強大的交互性、操作性，視覺深度，例如陌陌刪名牌，app store首頁卡片通過擴展收縮的手勢來開關詳情頁。該部分可借助移動端的自然手勢交互方法進行設計。
3 卡片怎么用
適用
A、流：流是根據(jù)一定規(guī)則抽離出信息庫中的部分信息，重新排列組合呈現(xiàn)給用戶的信息組合。信息塊內(nèi)部信息類別豐富且操作多樣，信息塊之間獨立分散，如Pinterest。
B、發(fā)現(xiàn)探索類：在該場景下，信息多含有較強的視覺效果，以卡片的形式展現(xiàn)，可使用戶更沉浸于當前內(nèi)容，如最美有物首頁。
C、獨立的信息塊：當需要單獨呈現(xiàn)某信息時，卡片作為容器的作用就發(fā)揮了出來。例如，iPhone待機狀態(tài)下，出現(xiàn)的通知組，獨立呈現(xiàn)、互不干擾、單獨操作；常見的彈窗也屬于此列。
不適用
卡片雖然具有以上優(yōu)點，卻也因此而具有信息密度較低、占空間的特點。
在設計中，當頁面內(nèi)容屬于未承載很多操作且同質(zhì)化時，可直接使用列表代替，例如新聞推薦頁，每個信息組僅由結構化的文本和圖片的組成，完全可用簡單的網(wǎng)格代替。
