2015-2016年最流行的APP設(shè)計(jì)是什么？比如，F(xiàn)acebook那樣的

Facebook仍是內(nèi)容驅(qū)動(dòng)型卡片設(shè)計(jì)的優(yōu)秀案例，并將繼續(xù)引領(lǐng)更多基于新聞和博客的功能設(shè)計(jì)。

譯者注：本文譯自UXPin出品的電子書Mobile Design Book of Trends 2015&2016的第六章Bite-Sized Cards。這本電子書結(jié)合豐富案例講述了2015-2016年間重要的移動(dòng)設(shè)計(jì)趨勢，共含6章節(jié)：靈巧的手勢操作、層級(jí)化的移動(dòng)界面、雋永的字體排印、扁平化設(shè)計(jì)、愉悅的微交互、小卡片。本文將來分享小卡片設(shè)計(jì)。注：以下圖片全部來自UXPin。

對(duì)于APP設(shè)計(jì)，2015儼然是卡片設(shè)計(jì)年。從網(wǎng)站到移動(dòng)應(yīng)用，不同屏幕尺寸的卡片無處不在，卡片展現(xiàn)形式與實(shí)物相似。通過手指滑動(dòng)，用戶可以輕松地在卡片容器中翻閱。

（Photo credit: Trello）

無論你是否意識(shí)到這一點(diǎn)，卡片會(huì)長期存在下去。

坦白說，卡片式風(fēng)格似乎只是為APP而生。你無法想象現(xiàn)在有多少APP正在使用卡片式設(shè)計(jì)。讓我們做一個(gè)小實(shí)驗(yàn)：拿起你的手機(jī)，打開你看到的前10個(gè)應(yīng)用，有多少用了卡片設(shè)計(jì)呢？

我們已經(jīng)知道卡片式設(shè)計(jì)統(tǒng)治了移動(dòng)端，接下來讓我們深入了解如何實(shí)際使用它們吧。

卡片式界面入門課

卡片式布局將信息分布在一系列矩形卡片容器中，如圖像、文本、按鈕、鏈接等。這些卡片可以分層或移動(dòng)，并依據(jù)屏幕尺寸自適應(yīng)適配，如果你將手機(jī)橫豎屏切換，卡片將堆疊降落為新的卡片隊(duì)列。

卡片是整齊的信息容器。正如電子書《Web UI現(xiàn)狀和未來趨勢：卡片設(shè)計(jì)模式》中所言，最好把每個(gè)卡片視為單一的想法或基本動(dòng)作。

（Photo credit: Apple AirDrop）

讓我們來看看蘋果設(shè)備上常見的AirDrop功能。當(dāng)有數(shù)據(jù)傳入時(shí)，一個(gè)卡片式通知會(huì)彈出，你可以選擇接受或拒絕傳輸數(shù)據(jù)。無論是手機(jī)、平板電腦或筆記本電腦，云傳輸功能均以同樣的交互模式實(shí)現(xiàn)，這意味著用戶很容易對(duì)操作行為有一定預(yù)期，知道如何使用。

雖然卡片最近才流行開來，這個(gè)設(shè)計(jì)倒并不新。Pinterest奠定了卡片作為主要設(shè)計(jì)模式的地位，而很多其他公司緊隨其后實(shí)踐卡片設(shè)計(jì)。

（Photo credit: Tinder）

卡片式設(shè)計(jì)越來越流行的原因之一，在于它與手機(jī)屏幕的兼容性。根據(jù)屏幕尺寸自適應(yīng)卡片大小，與大多數(shù)移動(dòng)用戶場景都完美匹配，而矩形的審美也符合UI設(shè)計(jì)。

細(xì)想卡片的設(shè)計(jì)，它幾乎完美適配了手機(jī)屏幕的大小和形狀。由于存在多種不同型號(hào)的屏幕尺寸，所以這里的卡片尺寸并不是一個(gè)精確的數(shù)值，而是一個(gè)極具代表性的長寬比。

卡片式設(shè)計(jì)的精髓在于桌面端和移動(dòng)設(shè)備的交集設(shè)計(jì)，在互動(dòng)性和可用性之間尋求平衡點(diǎn)。正如我們在《移動(dòng)界面模式》中首次描述過的，跨越不同的設(shè)備，卡片式設(shè)計(jì)創(chuàng)建了一個(gè)更為一致的體驗(yàn)。在響應(yīng)式設(shè)計(jì)中尤其是這樣，卡片作為“內(nèi)容容器”可以輕松地放大縮?。ㄏ裰匦露询B擺放箱子一樣）。