卡片式設計的優點和不適用性

卡片式設計的由來

卡片設計來源于早已存在于人類生活的各種現實物品。

舉個例子,顯示器、手機、名片,一封信、等等,都是獨立承載信息的一個個卡片。人們不用把電影院搬走就可以通過電視觀看到不同的內容載體,這時候電視充當的是內容載體的入口。而名片盒書信這種卡片感就更強了,你可以把一封信折疊起來,方便攜帶,等到需要的時候再伸展開來,進行詳細閱讀。正是人類生活早已充斥著“卡片設計”,所以當我們手中的設備界面有了“卡片式設計”的時候,人們反而覺得使用起來很方便和有熟悉感。

這些實物的卡片有以下這些好處:

1、體量-輕便易攜(手中的信件、名片、甚至電視機)

2、信息-精簡易懂(例如名片,折疊后的信件)

3、包裝-分類獨立

這些好處在互聯網信息數據爆發的年代,特別需要得到應用。說到這里,首先先科普一下。

最早應用卡片式設計并不是google 的material design 也不是蘋果的IOS design,而是palm webOS。webOS中,傳統意義上的程序概念被弱化,取而代之的是卡片系統。所有的任務均以卡片的形式出現。任何時候點擊手勢區,都會進入卡片視圖。卡片視圖中展現出正在運行的任務,這些任務以多窗口的形式呈現。你可以看到正在運行的全部任務,可以通過滑動進行切換,點擊后進入任務,這樣一種操作方式,是極其美妙的。更為重要的是webOS 中的多任務的流暢度可以得到很好的保證,可以說webOS的多任務是世界上最好的移動系統多任務平臺。

卡片式設計的好處

1、聚焦

每一張卡片都是一個獨立內容單元,在瀏覽和理解上,是獨立區分于其他卡片模塊,所以可以更聚焦地瀏覽當前卡片。

2、多態操作

卡片是可操作性十分強的設計模式,可以橫向滑動,上下伸展,點擊操作等。

3、自由組合

卡片設計的自由組合特性對設計師或者工程師來說都是一種便利和愉悅的體驗摒棄了以往古板而單調的網格單元格式的排版和代碼。不用再為圖片比例不對,需要裁剪而頭痛,記得“瀑布流”提出的時候,風頭可是極盛的。而對用戶,則同樣是視覺上的輕松和自由。

4、視覺上的舒適

卡片設計往往帶有足夠的空間留白、足夠的圖片和通過少量的陰影造就合理的層次,看上去會十分的有質感和舒適感(這里就不貼圖了,可以自行體會一下)

卡片式設計不適用范圍

雖然綜上所述,卡片式設計有這么多的好處。但是因為卡片式設計自身的特性所限,同樣也有不適用的地方。

1、不利于沉浸式閱讀

卡片設計其實就是一個個的框用來界定內容元。當用戶進行沉浸式閱讀時候,這樣的界定反而會令用戶產生脫離。打斷了原有的閱讀或操作。

所以當進行長文本的陳述或者強關聯閱讀類內容(非操作類)進行排列時,盡量避免使用卡片形式設計。(試想想,當你在念一封信的時候,把里面的每一段內容都給你重新用另一封信包裝起來......)

2、小空間條目

當內容過多,可容納空間比較小的時候,不適合用卡片設計。因為卡片劃分的邊界會消耗一定的空間,內容元的空間如果跟劃分空間比例相近,

會扼殺掉卡片設計的優勢,反而增加負擔。

3、內容容易劃分并被感知

當內容空間大量重復容易區分和感知的內容時,也不適用于卡片式的設計。例如相冊:

卡片每一次的卡片邊界的劃分也會消耗一定的用戶的心理認知,在強調極簡設計,碎片化時間的當今,盡量不消耗多余的哪怕是一丁點的認知。

本文配圖出自:http://www.lxweimin.com/p/20ba212a5f0c

同時有對于卡片式有興趣可以讀以下文章:

形式與功能-卡片式設計思考

知乎:卡片式設計有什么好處

僅此一篇,讀懂卡片式設計長盛不衰的秘密

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,501評論 6 544
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,673評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,610評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,939評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,668評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,004評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,001評論 3 449
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,173評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,705評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,426評論 3 359
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,656評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,139評論 5 364
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,833評論 3 350
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,247評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,580評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,371評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,621評論 2 380

推薦閱讀更多精彩內容

  • 卡片式設計的變遷 說到卡片大家都不陌生。日常生活中我們都接觸過哪些卡片呢?細細留意實際上我們每天無時無刻不被卡片所...
    角馬X閱讀 1,895評論 13 24
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,762評論 25 708
  • 庖丁開發:專注于互聯網項目開發 卡片式設計是 app 設計中很重要的一種表達方式,一張好的卡片可以清晰明確的把信息...
    庖丁開發閱讀 12,152評論 2 70
  • 你還記得你的夢想嗎? 舟一 每個人都有自己的夢想,你還記得自己的夢想嗎? 聽到這個問題...
    舟?閱讀 284評論 2 2
  • 我覺得這次醒悟了,或者說,看清了現實。 1.這樣子自己寫下去是不行的,必須站下巨人的肩膀上。(雖然我早已讀過,但這...
    良辰美LiangChen閱讀 239評論 0 0