阿里裝修托管
微信人工客服 |
在現(xiàn)實(shí)生活在，視覺信息老是很吸引人的眼球，卡片規(guī)劃的運(yùn)用不只僅僅僅一種趨勢(shì)。
有數(shù)據(jù)顯現(xiàn)2014年 移動(dòng)端運(yùn)用率遠(yuǎn)遠(yuǎn)高于桌面端，頁面規(guī)劃都能極好的習(xí)氣小屏幕。這個(gè)定論即是：簡(jiǎn)略的界面?zhèn)€性，比方：扁平化規(guī)劃，極簡(jiǎn)規(guī)劃，尤其是卡片規(guī)劃比從前都要盛行。
好的卡片規(guī)劃不會(huì)運(yùn)用太多的加載時(shí)間，一起它也能在不相同的屏幕上切換自若。小的模塊關(guān)于用戶來說更能吸引留意力（尤其在移動(dòng)端），它在Pinterest上培育大家的習(xí)氣，然后在Facebook和Twitter上面推行，卡片規(guī)劃能運(yùn)用于各個(gè)領(lǐng)域的網(wǎng)站規(guī)劃。
在這篇文章中，咱們將會(huì)討論卡片規(guī)劃的崛起：為何它們有用，它們?cè)趺戳?xí)氣于呼應(yīng)規(guī)劃和material design，在將來又會(huì)發(fā)作啥？
啥是抽屜式規(guī)劃？深圳網(wǎng)絡(luò)公司
為了了解抽屜式規(guī)劃，你首先得先了解卡片是啥。
一個(gè)卡片具有屬于自個(gè)的信息。一張卡片能包括一切信息 — 視覺、文本、連接等等— 可是一切這些內(nèi)容都是一張卡片里邊的內(nèi)容。
這種獨(dú)立填滿全部屏幕抽屜式展現(xiàn)信息的方法 被Guardian 叫做“抽屜方式”。它讓用戶愈加直接清晰的看到全部界面，也有利于用戶迅速的尋覓他們需要的信息。（最主要的是，這種方法可以有利于咱們自個(gè)操控，下面的文章我會(huì)解說為何。）
讓人覺得很有吸引力的是：它們運(yùn)用的卡片界面是互相疊加的。
Trello 能讓用戶創(chuàng)立他們自個(gè)想要的任何卡片列表。一切人都能創(chuàng)立“to-do”卡片 ，一起可以按照自個(gè)的需要進(jìn)行分類。
Trello不只讓卡片具有靈敏性，并且還能被用戶隨意擺放。Trello的成功是因?yàn)橄噍^于傳統(tǒng)列表式規(guī)劃，它讓用戶感受很簡(jiǎn)略。
UI卡片在移動(dòng)端和呼應(yīng)式規(guī)劃中的運(yùn)用
正如上文說到的，卡片為呼應(yīng)式結(jié)構(gòu)供給了超卓的兼容性，因?yàn)橐恍┫馜es Traynor把他叫做“頁面的將來
這種規(guī)劃可以在移動(dòng)端隨意極好的變換。
首先，它可以自個(gè)拓展或許縮短去習(xí)氣任何屏幕的尺度。規(guī)劃師可以很靈敏的操控卡片的份額（幾組卡片可以十分好的習(xí)氣互相）。例如,你可以規(guī)劃固定的寬度和共同的距離來習(xí)氣可變化的高度。留意他們兩個(gè)的文本信息、圖畫和色彩的個(gè)性都是共同的?？ㄆ?guī)劃讓用戶在不相同的設(shè)備上有共同性的體會(huì)。網(wǎng)絡(luò)公司
你可以看到這個(gè)優(yōu)勢(shì)在UXPin的e-book里邊被使用。留意他們從移動(dòng)端到全屏的界面是十分清晰的。
另外一個(gè)優(yōu)勢(shì)是怎么讓卡片習(xí)氣大家手指操作。在觸屏上，操作它就像按動(dòng)一個(gè)按鈕相同不需要花費(fèi)多少精力。這個(gè)主意很簡(jiǎn)略：點(diǎn)擊卡片，讓它與內(nèi)容交互。
像菲茨定律習(xí)氣于頁面規(guī)劃展現(xiàn)那樣，點(diǎn)擊區(qū)域越大就越簡(jiǎn)單互相作用。還記得咱們有多少次掙扎在移動(dòng)設(shè)備上點(diǎn)擊一些文本連接么？
卡片和Material Design
Material Design很依靠卡片式規(guī)劃，卡片描繪在Material Design指南里值得你去尋覓一個(gè)好的解說。
卡片規(guī)劃的將來
卡片規(guī)劃方式不斷的重塑自身以習(xí)氣新的應(yīng)戰(zhàn)，而呼應(yīng)式和移動(dòng)端或許會(huì)受最大的影響。就像2015&2016頁面規(guī)劃趨勢(shì) 描繪的那樣，這種規(guī)劃盛行的改動(dòng)是因?yàn)?nbsp;Material Design 在安卓系統(tǒng)里邊的運(yùn)用。
1.技能
卡片不也許永遠(yuǎn)是靜態(tài)的。跟著網(wǎng)絡(luò)功能的進(jìn)步，也可以支撐更豐厚的多媒體內(nèi)容。你也許會(huì)看到更多細(xì)節(jié)的元素，比方主動(dòng)更新內(nèi)容可是不會(huì)影響全部用戶體會(huì)。
視頻能更換圖片（規(guī)劃師考慮這個(gè)疑問很多年了）或許會(huì)變得很盛行。Use Your Interface（上圖），這些GIF動(dòng)畫功能讓全部頁面體會(huì)十分愉悅。
2.深度的交互
在不久的將來，卡片或許可以變得愈加的有構(gòu)思。就像咱們看見 Material Design，它十分依靠自己的交互，跟著主動(dòng)排序和實(shí)時(shí)更新等功能的更新（比方天氣預(yù)報(bào)）。
Windows手機(jī)里邊現(xiàn)已開端運(yùn)用卡片式主動(dòng)分類方法，很有也許別的移動(dòng)手機(jī)也會(huì)運(yùn)用這種方法。
3.尺度
圖片并排的規(guī)劃趨勢(shì)，也讓卡片十分好的運(yùn)用大尺度屏幕。
大卡片上能規(guī)劃更多的細(xì)節(jié)和雜亂的字體，它從視覺上讓用戶感受很舒暢。巨細(xì)卡片替換的時(shí)分，大卡片在視覺上更讓人感受舒暢。
Arkitekter（如上圖）是如何運(yùn)用大尺度和中等尺度作為信息規(guī)劃的。有些卡片有連接，有些卡片是靜態(tài)的信息。巨細(xì)不相同的卡片出現(xiàn)方法，讓全部頁面更有呼吸感。
4.可穿戴的
多虧了google眼鏡，它讓卡片的UI規(guī)劃在穿戴設(shè)備上奠定了根底。
盡管有很多人以為google眼鏡會(huì)失敗，可是也有一部分人以為它有商場(chǎng)。不管如何，穿戴設(shè)備的UI規(guī)劃必須要極好的使用空間來規(guī)劃，而卡片規(guī)劃是它最有用的挑選。
關(guān)鍵
在一切的前言和設(shè)備上，卡片規(guī)劃現(xiàn)已成為規(guī)劃常用的一種方法。他們當(dāng)前的方式也許會(huì)跟著技能的開展有所改動(dòng)，可是他們確實(shí)是存在的。
究竟，這些規(guī)劃并不是一個(gè)表格。別忘了，在不久前卡片僅僅一張包括內(nèi)容的紙片罷了。
專注設(shè)計(jì)14年
深一云服務(wù)器
拒絕不當(dāng)利
500強(qiáng)企業(yè)網(wǎng)
10000家客戶案
83位技術(shù)團(tuán)隊(duì)
只做有排名
200人服務(wù)團(tuán)隊(duì)
