歡迎來到合肥浪訊網(wǎng)絡科技有限公司官網(wǎng)
  咨詢服務熱線:400-099-8848

規(guī)劃師給你科普什么是卡片規(guī)劃

發(fā)布時間:2021-01-22 文章來源:本站  瀏覽次數(shù):3038

      目前“卡片式規(guī)劃”在越來越遭到規(guī)劃師的青睞,尤其是在APP的界面規(guī)劃上。“卡片式規(guī)劃”已經(jīng)漸漸進入到各行各業(yè)之中,咱們耳熟能詳?shù)膌inkedin和facebook都是在用卡片式規(guī)劃。那么什么是卡片式規(guī)劃,卡片式規(guī)劃又會帶來怎樣的用戶體會呢,F(xiàn)在就由規(guī)劃師給咱們科普一下吧。


1. 遵從「一卡一概念」準則

      卡片的一切內(nèi)容只能和一個主題相關(guān)。一個卡片能夠包含多種元素,但應該首要表現(xiàn)同類信息或內(nèi)容。這樣用戶才能更輕松地挑選他們所喜歡或愿意分享的內(nèi)容。


一個模塊(或卡片)「包含」一次用戶交互。

2. 保證整個卡片都可點擊

     遵從菲茲規(guī)律(Fitts’s Law),要讓用戶能夠點擊或觸擊卡片的任何部分,而不只是文字鏈接或圖片。無論在移動端的觸擊屏幕,仍是需求鼠標操作的主桌面端,有相對大面積的觸擊區(qū)都可大大提高卡片的可用性。菲茲規(guī)律是人機交互領(lǐng)域一個非常重要的法則。其基本觀念是,當一個人用鼠標來移動鼠標指針時,屏幕上的方針其某些特征會使得點擊變得輕松或困難。方針離得越遠,抵達就越費勁;方針越小,就越難點中。

小提示:推薦運用一點暗影來呈現(xiàn)深度,讓咱們知道卡片是可點擊的。


3. 保證卡片的視覺享受感

      要說什么樣的卡片才是成功的,那必定是有杰出規(guī)劃和可用性的卡片了。對卡片稍加打磨,參加少許美學特征,卡片會讓人感覺了解,一起構(gòu)思十足。

 

當開端著手規(guī)劃卡片時,你應當特別注意以下幾個方面:


     根據(jù)卡片的規(guī)劃一般首要依托視覺規(guī)劃,而運用很多圖片便是卡片規(guī)劃的一大亮點。研討發(fā)現(xiàn)已證實,圖片能夠提高網(wǎng)頁或 app 的全體規(guī)劃。所以,參加圖片也使得根據(jù)卡片的規(guī)劃愈加引人入勝。


暗影和突變

      參加暗影和突變這兩種元素,能夠有效地讓用戶將你規(guī)劃的卡片與現(xiàn)實生活中的對應什物聯(lián)絡在一起。但在規(guī)劃時,一定要仔細考慮怎么運用這兩種元素:如果卡片四周和旮旯都加上暗影,要再想讓用戶將它與現(xiàn)實生活中的對應什物聯(lián)絡在一起就有點難了。帶有圓角的卡片從視覺上看來就像是一張撲克牌。當然,要想吸引用戶注意力,還能夠經(jīng)過排版來實現(xiàn)。卡片一切內(nèi)容都應該簡略易懂,無妨試試從最大可讀性角度來規(guī)劃:挑選簡略的字體和易于閱覽的配色方案(文本內(nèi)容在純色布景下,且布景色彩和文字色彩有鮮明對比的,這樣的文本才是最清晰易讀的)。
盡量操控字體的種類數(shù)量。關(guān)于絕大多數(shù)狀況而言,單一的字體足矣。
小提示:卡片主內(nèi)容文本,選用 sans-serif 字體正常粗細的作用非常好。


4. 約束卡片內(nèi)容篇幅

      卡片一般不大,其作為用戶了解更多細節(jié)信息的「入口」,所以它本身不需求承載過多細節(jié)內(nèi)容。當你試圖在卡片里添加很多內(nèi)容,導致卡片變得過寬或過長,那它就會失去其原有的「擬物」作用。


5. 參加動畫和動效

       動畫如果運用得好,能夠大大提高用戶體會。其能夠協(xié)助用戶在根據(jù)卡片的界面中更好地定位,并樹立不同卡片狀態(tài)之間的視覺相關(guān)。

視覺提示

視覺提示協(xié)助用戶更好地了解怎么與界面進行交互。當需求向用戶展示某些詳細功用怎么操作時,它就顯得頗為有用了。展示導航功用的提示。

視覺反應

視覺反應在界面規(guī)劃中適當重要,因為它能直接和用戶的自然希望相相關(guān)。在現(xiàn)實生活中,各種物品一般都會對咱們的行為作出反應,這也是大眾習以為常的反應。比方電腦的開關(guān)按鈕,當你按下開關(guān)鍵時,你能夠感遭到按鈕被按下的力氣反應,一起還有聲音反應。在電腦端,你能夠經(jīng)過「懸停作用」來顯示相關(guān)元素的交互行為。懸停動畫能夠增加功用的可發(fā)現(xiàn)性,一起,也運用戶體會愈加風趣。在卡片中參加懸停動畫。運用懸停作用還能夠激活更多選項。


擴大

擴大能夠呈現(xiàn)從原圖到細節(jié)視圖的過渡:用戶選中卡片就能夠直接看到相關(guān)詳細信息。不過要注意,要確認讓用戶感覺他們?nèi)栽谙嗤季翱蚣芟逻M行交互。


動畫能夠?qū)⒖s略圖和細節(jié)視圖相相關(guān)。


結(jié)束語

      卡片是界面規(guī)劃領(lǐng)域創(chuàng)新型新元素。它不僅僅是一張卡片,它仍是發(fā)明優(yōu)質(zhì)內(nèi)容和規(guī)劃最佳用戶體會最靈活的布局方式之一。

上一條:“剁手族”的無底洞,商城...

下一條:規(guī)劃獅教你怎么優(yōu)化圖片功...