卡片式设计有什么好处,简述卡片式设计的优缺点

卡片式设计采用图像与文字说明相结合的方式将信息传达给受众,在有限的矩形空间中建立了无限的可能性。

卡片式设计有什么好处,简述卡片式设计的优缺点-1

时至今日, 卡片式设计已然不是一种设计趋势, 而是一种设计潮流, 其影响力遍布于网页及移动端的使用场景中。

既然卡片式设计流行于当前的界面设计中,那么在界面的差异性中卡片式设计必然存在一定的相似性。卡片式设计具有哪些标志性的特点,又适宜运用在哪些设计场景中,是我们首要关注和讨论的问题。

卡片式设计有什么好处,简述卡片式设计的优缺点-2
01 卡片式设计的特点

1. 多样的呈现形式

在运用卡片设计的过程中,出现形式较多的是卡片颜色与背景底色有明显的颜色区分,即在视觉上能轻易区分卡片的存在,当光标悬浮在卡片上时会出现一层轻微的阴影。

卡片式设计有什么好处,简述卡片式设计的优缺点-3

另一种相对简洁的设计形式是整个卡片隐藏于背景的底色中,虽然视觉上缺少了矩形卡片的存在,但在浏览的过程中仍能清晰地识别卡片之间成组的信息。

这种形式最大的亮点是呈现了及时的反馈效果,当光标悬浮或点击卡片时,显现的卡片与周围的信息有明显的区分。

卡片式设计有什么好处,简述卡片式设计的优缺点-4

2. 灵活的纵深布局

界面设计中卡片的形式与生活中实体卡片的样式有着异曲同工的效果——将图像与文字组合在一起来传达信息。和实体卡片相比,界面中卡片的高度能够上下伸缩、灵活多变,做到有弹性地调节卡片内不同容量的信息。

卡片式设计有什么好处,简述卡片式设计的优缺点-5

3. 直观的信息层级

在瀑布流的界面中,每个卡片都是独立存在的小个体,它们之间共同存在但不互相影响,促成了页面的整齐统一,所以保证用户在巨大的信息量下也不至于产生混乱、迷失方向。

多数的卡片在有限的矩形空间中乘载着很多相关联的信息,内容各不相同但信息的层级关系却相似。卡片上的资讯虽然只是看似简短的标题或摘要,却是卡片背后真正有价值的内容能够呈现与否的关键,所以卡片上信息层级的直观性不言而喻,分明的层级能够引导用户的浏览视线,有秩序地阅读与点击。

卡片式设计有什么好处,简述卡片式设计的优缺点-6
02 卡片式设计的使用场景

1. 信息流(feed流)

信息流常见的展现形式包括以文字为主、以图片为主和以视频为主。文字为主的形式多出现在资讯类的产品中,例如知乎、汽车之家等。

本文转载自:https://www.gylmap.com

优点是可识别强、信息简洁明确,通过对标题简洁的处理能快速告诉用户卡片上的核心内容,吸引用户快速点击阅览。

卡片式设计有什么好处,简述卡片式设计的优缺点-7

图片为主的形式使用最多的要属Pinterest、花瓣这类网站,相较与文字,图片浏览的速度更快,一图胜千言,图片相较于文字具有更强的视觉冲击力和感染力,更能吸引用户的注意力和点击。

卡片式设计有什么好处,简述卡片式设计的优缺点-8

多数的设计中信息流的呈现形式主要是上下竖向滚动,在Plus X的网页设计中,采用了横向滑动的形式,图片信息为主的卡片整齐划一地展现出来,见惯了上下滚动的设计,这种左右滑动的操作能为用户带来了焕然一新的使用体验。

卡片式设计有什么好处,简述卡片式设计的优缺点-9

短视频的快速流行为信息流注入了新鲜的活力。视频信息流的形式在淘宝直播、抖音等移动端产品中应用较多,视频画面通常占满全屏,最大限度地利用卡片式设计。

视频具有图片和文字不具有的动感,满足用户的视听体验,具有强烈的感官冲击力;沉浸式的界面设计让用户能够持续不断地浏览内容;只需要上下滑动这种简单的操作方式便可切换视频,适用人群广泛。

卡片式设计有什么好处,简述卡片式设计的优缺点-10

2. 发现页

卡片式设计本质上是不同信息的集合处理。越来越多的产品在发现页面会使用不同尺寸的卡片组合来突出重点信息,卡片灵活的排列组合也让页面变得更加规范。Flipboard作为一个资讯类平台,其设计和市面上其他同类的产品有着很大的区别。产品非常注重卡片式的设计,利用卡片来强调信息主次,统一的形式贯穿在整个产品中。

卡片式设计有什么好处,简述卡片式设计的优缺点-11

基于微信平台而快速崛起的微信读书也同样注重卡片式的设计,在产品的发现页采用了左右滑动的卡片样式,每个卡片中都包含不同类型的信息,充分释放了信息的传递而不至于局限在小小的屏幕中。书架也采用了标准的卡片结构,整齐有序的排列带来清晰易读的体验。

卡片式设计有什么好处,简述卡片式设计的优缺点-12
结语

卡片式设计的流行同样得益于自身的灵活性,这种设计形式在跨设备、跨屏幕上有着天然的优势, 也更加实用,为设计提供了更多的组合形式,给观者带来了良好的使用体验。

对生活中的实体卡片的熟悉,也让我们习惯于接受这种设计形式的出现。卡片也不是万能的,设计师要做的是在正确的场景中合理地利用卡片式设计。

秒鲨号所有文章资讯、展示的图片素材等内容均为注册用户上传(部分报媒/平媒内容转载自网络合作媒体),仅供学习参考。用户通过本站上传、发布的任何内容的知识产权归属用户或原始著作权人所有。如有侵犯您的版权,请联系我们反馈!本站将在三个工作日内改正。
(0)

大家都在看

  • 做蛋糕怎么做视频(烤箱做蛋糕视频教程)

    大部分人买了烤箱以后,做的第一款产品都是蛋糕,蛋糕在家就能轻松做。 今天老师教大家怎么烘烤蛋糕?怎么脱模?建议保存~ 烘烤的温度: 一般在150-200℃,具体要看产品的要求和烤箱…

    2022年4月22日 专栏投稿
  • 笔记本cpu排行榜(笔记本cpu排行天梯图)

    我们想要知道CPU之间的性能高低,只需要通过一张“CPU”天梯图,就可以快速了解。笔记本移动版CPU相比台式机CPU在型号上更加繁多,并且杂乱无章,相同的型号下,CPU分为标压和低…

    2022年6月5日
  • 充电宝怎么用(新充电宝的正确使用方法)

    就像手机一样,充电宝已成为人们生活中必不可少的物品之一。每当您出远门时,就一定随身携带。对于没有手机就无法生存依赖手机的人们而言,尤其如此。许多人仍然对它的使用有误解。电子产品的任…

    2022年6月9日 专栏投稿
  • 怎么养小猫(新手怎么养猫咪幼崽)

    现在随着人们生活水平的提高,也更加希望增加精神层面的幸福感,加之生活节奏较快,很多人都喜欢养一只宠物,作为精神依托,伴随着铲屎官成长,给铲屎官带来欢乐。 刚睁眼的小奶猫,是不是很萌…

    2022年4月13日 专栏投稿
  • win10怎么管理员运行cmd(cmd管理员模式用法全解)

    对于很多深度技术的老用户来说,在windows10专业版系统中以管理员身份运行打开cmd命令都不是什么大的问题,但是肯定有一部分的深度系统的小伙伴不知道方法的。别着急,接下来深度系…

    2022年5月12日
  • C语言日历代码(日历代码实现)

    前天我们通过一段代码展示了如何通过Python的Pandas包生成一个日历表,如果各位感兴趣可以参考:通过Pandas生成日历表; 不得不说在 DB Engine(https://…

    2022年6月10日 专栏投稿
  • 小米稳定版root权限(小米9pro稳定版root教程)

    现在的小米已经是全球第四大智能手机品牌实力是毋庸置疑的,他牢牢掌握着中国中低端机领域的话语权,冲击高端市场也取得令人瞩目的成绩,向我们充分展示其作为国产领头品牌的魅力。没错,现在的…

    2022年5月9日 专栏投稿
  • 朱良春用药经验集(朱良春治疗乳腺增生结节)

    朱良春,男,生于1917年8月,江苏镇江市人。早年拜孟河御医世家马惠卿先生为师。继学于苏州国医专科学校,并于1938年毕业于上海中国医学院,师从章次公先生,深得其传,从医已逾70载…

    2022年7月2日
  • 2k和4k的区别(笔记本2k和4k差别大吗)

    如今哪怕是2000元价位的入门级笔记本,它们的屏幕也都达到了全高清(FHD,1080P)标准,一些高端机型甚至开始武装2.5K~4K的超高清屏幕。问题来了,笔记本电脑的屏幕需要那么…

    2022年6月8日 专栏投稿
  • 阳虚怎么办(阳虚的人怎么调理)

    患者咨询:廖医生你好,我今年40岁,像我这个年纪按道理说是壮年,平时工作压力大而且用脑太多,经常写材料,昼夜冥想。 喝过枸杞大枣桑椹人参黄精覆盆子,泡的水,感觉没啥用。 最近脚发凉…

    2022年4月16日
品牌推广 在线咨询
返回顶部