专栏名称: IXDC
IxDC由广州美术学院设计学院、香港理工大学设计学院、网易、腾讯、华为、中国电信、中国移动、金山等单位联合发起。是全国第一个受政府认可和领导的交互设计专业委员会,致力于引领中国交互设计行业发展。
目录
相关文章推荐
51好读  ›  专栏  ›  IXDC

卡片UI好做吗?方寸之间的小卡片,却蕴涵了很多设计巧思

IXDC  · 公众号  ·  · 2024-10-22 08:30

正文

本文授权转自:UX设计Studio(ID:IXDStudio)

小卡片会出现在手表或者大屏幕的模块内,是一种常见的设计形式。如果在一个大屏幕内进行很多小卡片的组合,就叫Bento UI(便当盒设计)Bento box(便当盒)。


小卡片的布局并不容易,设计师需要在仅有的区域内,尽量做到视觉节奏轻盈、颜色搭配合理、布局清晰。


在表盘内的设计,只要关注当前内容的清晰度和美观度即可。配色和留白就看设计师自己的能力发挥了。


作者 clarissa


但如果在区域内进行小卡片的模块组合,需要考虑不同模块间的视觉重量、配色的呼 应度,信息密度的均匀。可以试试重颜色+轻内容,搭配轻颜色+重内容,来交错使用。


作者 Brandi


当然,不同模块间如果可以做到颜色呼应,就更好了。


作者 MOWU DESIGN


一个小卡片内尽量留20%-30%的间距留白,可以让卡片内容显得更加轻盈。如果信息密度太大,会让页面过于臃肿。圆角和卡片间的留白也要做到尽量留空。


作者 Ethan Pierce


作者 Jakub Wojnar-Płeszka


果然,好看的设计,还是需要留空再留空~ 你认为卡片 UI 设计中最重要的因素是什么呢?

-END-
文章转载: UX设计Studio 版权归原作者所有
原文链接:https://mp.weixin.qq.com/s/ulRe8jefZIci71KZl7PKdw
版权声明:“IXDC”所推送的文章,除非确实无法确认,我们都会注明作者和来源,本公众号对转载、分享的内容、陈述、观点判断保持中立,不对所包含内容的准确性、可靠性或完善性提供任何明或暗示的保证,仅供读者参考。部分文章推送时未能与原作者取得联系,若涉及内容或作品等版权问题,烦请原作者联系我们,给出内容所在的网址并提供相关证明资料,我们会核查后立即更正或者删除有关内容!本公众号不承担任何责任,并拥有对此声明的最终解释权。
联系微信:18802086168
联系电话:18802086168
编排 | 巫 欢
终审 | 苏 菁







请到「今天看啥」查看全文