優(yōu)化卡片式規(guī)劃的規(guī)律

優(yōu)化卡片式規(guī)劃的規(guī)律

卡式規(guī)劃是近幾年中很盛行的一種規(guī)劃，不管是網(wǎng)頁(yè)規(guī)劃，仍是移動(dòng)應(yīng)用的規(guī)劃中，卡片式規(guī)劃都被廣泛的運(yùn)用到各個(gè)行業(yè)領(lǐng)域的規(guī)劃傍邊。下面來(lái)跟我們說(shuō)說(shuō)，八大規(guī)律能夠優(yōu)化你的卡片式規(guī)劃。

一、了解結(jié)構(gòu)

卡片與物理上的卡片類(lèi)似。能夠把它們了解為容器，將內(nèi)部的內(nèi)容信息分組、分層級(jí)展示，整合安排起來(lái)。

二、暗影/點(diǎn)擊態(tài)

暗影或是邊框線(xiàn)有助于使卡片愈加顯著，詳細(xì)使用哪一種視覺(jué)樣式要視你的 UI 風(fēng)格而定。

三、背景

卡片的另外一個(gè)長(zhǎng)處是，能夠隨意配置背景的顏色，使用多樣的視覺(jué)氣氛，只需跟卡片放在一起不突兀就行。

四、字號(hào)和字重

文字越小，用戶(hù)閱讀的功率越低，用戶(hù)需要花更多時(shí)間去辨認(rèn)和閱讀；文字越大，用戶(hù)閱讀的功率越高，用戶(hù)能夠快速辨認(rèn)內(nèi)容。錯(cuò)誤的使用字重會(huì)影響界面的可用性和漂亮度。

五、比照

卡片已經(jīng)是小層級(jí)的容器了，所以比照度在信息分層和優(yōu)先級(jí)上起重要作用。

六、按鈕

能夠使用一般按鈕、文本按鈕或圖標(biāo)按鈕。在筆直卡片上，按鈕一般放置在底部上；在水平卡片上則是在右側(cè)或底部。

七、信息空間排布

包裹著可聚焦元素的適宜內(nèi)邊距（Padding），以及能夠安排信息的滿(mǎn)足空間(Space)

在可聚焦元素之間添加恰當(dāng)?shù)目障�，也留滿(mǎn)足的間距來(lái)對(duì)內(nèi)部信息進(jìn)行分組。

八、聚焦與懸停

鼠標(biāo)滑過(guò)時(shí)，為了讓卡片愈加突出，一般的做法是給卡片加深一點(diǎn)的暗影或許將卡片位置略微舉高一些。

現(xiàn)在人們獲取信息速度越來(lái)越快，卡片能忽略設(shè)備的差異給用戶(hù)供給更好的服務(wù)。這也是以用戶(hù)體會(huì)為中心的規(guī)劃。相比傳統(tǒng)單一的頁(yè)面規(guī)劃，卡片不僅作為信息載體，還能夠供給更多個(gè)性化的用戶(hù)體會(huì)，使界面規(guī)劃明晰平衡、富有美感、簡(jiǎn)約時(shí)髦而又具備良好可用性。而卡片作為容器，能夠適應(yīng)不同屏幕巨細(xì)而不損壞信息的展示作用。