APP設計中，卡片式設計是最受歡迎且應用最廣的經典排版方式。卡片式設計不僅能打破傳統界面版式那種呆板布局，還能更好地歸納網站的信息。雖然卡片式設計看上去簡單，但要把控得好，卻並不容易。那麼卡片式設計有什麼好處?

◇ 什麼是卡片式設計?

網頁設計趨勢

卡片是含有圖片和文字在內的小矩形模塊，它是用戶了解更多細節信息的入口。要平衡界面的美學和可用性，卡片式設計是一個不錯的選擇。卡片式設計用起來非常方便，還可以展示包含不同元素的內容。

◆ 卡片式設計有什麼好處?

好處一：完美的擬物

網頁設計趨勢

在APP設計界面中加入卡片式設計，可謂是完美的擬物。卡片式設計雖然沒有特別複雜的設計效果，簡單的投影效果以及仿照真實卡片的操作方式，可被覆蓋、堆疊、移動、划動等，能更好地拓展內容視覺深度和可操作性，讓人下意識有種「這就是平時生活中所用的卡片」的想法，非常真實。

好處二：內容架構

網頁設計趨勢

傳統界面的內容一般會採取縱向滾動操作，展示內容有效。卡片式設計將內容劃分多個有意義的部分，在縱向的內容流里，很好地增加橫向滑動的內容區域，節省不少屏幕空間。

好處三：有利於信息分層和整合

網頁設計趨勢

在卡片式設計中，每張卡片就相當於一個信息模塊，用戶可通過划動快速瀏覽，同時不會出現疑惑。再者，塊狀卡片會讓界面變得更加整齊美觀，同一頁面中不同卡片大小，還能很好地區分信息的重要登記。

好處四：給用戶帶來視覺享受

網頁設計趨勢

卡片式設計的最大亮點就是使用大量圖片，研究發現，圖片可以快速吸引用戶的注意力，同時也提升了網頁設計或APP設計的美觀性，讓設計變得更引人入勝。

◇ 卡片式設計的優秀案例欣賞

一、 網頁類の卡片式設計優秀案例

1. Google Play – Material Design卡片

網頁設計趨勢

無論首頁推薦還是細分類別，卡片式設計都能讓整個界面變得整潔大方，條理性強。配合上下左右的滑動交互，給用戶帶來極強的操作感。

2. Quora

網頁設計趨勢

卡片式設計將信息以區塊形式集中在一起，內容不會以長篇大論的形式出現，避免用戶對此產生畏懼心理。簡單易明的內容更容易引起用戶興趣，並讓用戶快速判斷是否繼續閱讀下去。

3. Linkedin

網頁設計趨勢

Linkedin的網站設計使用的是「文字+圖片+連結」的方式，當所有元素都放在同一卡片上，面積較大的圖片成為卡片的最焦點，讓用戶更容易點擊操作。

4. Pinterest

網頁設計趨勢

這種瀑布流設計為用戶提供無縫式的流暢體驗，減少點擊步驟能最大限度留住用戶。每張卡片都添加微妙的陰影，強化其可見性，同時讓用戶下意識產生「點擊」的衝動。

二、APP類の卡片式設計優秀案例

1. Instagram

網頁設計趨勢

在APP設計中，卡片作為容器的作用更為突出。如Ins作為以圖片為主的APP，所有圖片以正方形放不，保證圖片在feed流里的寬度能全屏顯示，從而看起來更加整齊。

2. Trello

網頁設計趨勢

卡片式設計能幫助用戶更好地進行列表歸類，也可靈活運用，幫助用戶管理任務和工作。

3. Airbnb

網頁設計趨勢

卡片式設計的簡約性和條理性不僅能做好內容區分，也增加APP的用戶體驗。此外，Airbnb的卡片設計採用無框設計，統一且重複的信息元素，讓內容變得更有規律性。

卡片式設計不僅是很好的擬物化設計，還是創建優質內容，營造優質用戶體驗的重要布局手段。