在互联网时代，许多产品或平台都推出了各自的会员体系和会员服务，而在这个过程中，会员卡片这一组件也被广泛应用。那么，你知道会员卡片这一组件在设计时应当遵循哪些策略吗？一起来看看本文的分析和总结吧。
会员卡片是少数几种概念和样式都来源于现实，并且设计上相差不大的组件。在手机出现之前的很多年里，各种高端的店铺、银行、俱乐部都会给重要的客户发放实体的VIP卡片，一来彰显客户地位，二来提供针对性的服务促进高端用户的消费。
(相关资料图)
进入互联网时代之后，各大内容提供商也纷纷效仿实体店推出了会员服务，会员卡片也就顺理成章地被继承了下来。
会员卡片的使用场景极为单一，不用我说大家基本上也都清楚，就是会员中心页面，有些APP会把会员卡片外置到「我的」页面，作为会员页面的入口进行突出展示。当然，「我的」页面中的卡片为了压缩高度，信息会比会员中心更精简一点。
在聊具体的卡片设计之前，我想先说一下会员卡片的设计目的，会员卡片是一种典型的视觉化组件，它本身被设计出来并不需要承载任何交互目标，跟勋章一样，它是一种视觉性的代表，代表了用户尊贵的地位。
由此目的，我们可以确定进行会员卡片设计的首要任务就是视觉性。
会员卡片的核心内容其实非常有限，由于需要突出视觉元素，所以只需要展示几个最核心的信息即可。
用户信息：核心信息，头像+昵称，或者单独昵称 有效期信息：核心信息，会员权益的到期日 升级进度条：一些有会员等级规则的App还会在卡片上展示升级的进度条 主视觉元素：视觉化元素，通常是卡片上最显眼的插画、3D图形 会员(等级)标志：视觉化图标，比较成熟的App会针对自己的会员体系设计专门的logo 背景：卡片的背景，有时会添加一些纹理会员卡片的构成基本上就这几类，其中有些app甚至为了简化，主视觉元素都不会加入，或者干脆就把背景和VIP标志当作主视觉，这可以根据App的调性进行选择。
1）纯色
纯色卡片是比较少见的一类会员卡片，因为纯色并不能体现明显的视觉特征，所以纯色可能会令人觉得寡淡。当如果App整体调性便是扁平、简约的，那么可以使用纯色作为卡片背景。
而由于会员卡片代表尊贵的特性，其取色也会在几个比较有限的范围内取，例如：金、银、黑、主色。
2）渐变
更常见的背景是渐变的背景，不管是线性渐变或非线性的，渐变总能给人一种动态、流淌的视觉感受，另一方面，渐变还可以模拟真实卡片的光影质感，这一点无疑是纯色给不了的。
3）纹理
在纯色、渐变的基础上加上线条或者色块的纹理，或者干脆将图形或插画做成背景纹理的一部份，能够强化卡片视觉特征，让卡片不至于那么枯燥。
主视觉元素指的是作为视觉焦点存在的图形、插画，但并不是所有卡片都需要一个主视觉元素，所以其实很多App都会选择不做这个复杂的主视觉。如果你要做的话，可以考虑以下几种形式：
1）视觉化的图标
把可以指代「会员」这个意象的图标进行视觉化设计，这些图标有：王冠、钻石、App Logo、V标等等，可以进行的视觉化形式有：3D化、拟物化、金属质感设计、水晶质感设计等等。
2）插画
也有的App会采用插画作为主视觉的方案，这可以在偏扁平化的风格中使用。
在拥有复杂等级规则的会员制度中，卡片也依等级做出差异化设计，除了等级本身的不同之外，也有会在卡片背景色彩和主视觉元素上做出差异化设计的做法。
这里收集了一些会员卡片的线上案例，也可以作为设计时的参考：
作者：酸梅干超人；公众号：超人的电话亭（ID：Superman_Call）
本文由 @超人的电话亭 原创发布于人人都是产品经理，未经许可，禁止转载。
题图来自Unsplash ，基于 CC0 协议
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
关键词：
相关的文章>>
热门搜索：
资讯
更多
会员卡片，应该如...
当前需要下调超额...
人民银行：5月债券...
当前关注：断臂求...
美国负债史上首次...
武汉站到武昌站坐...
图说健康
更多
疏风解毒胶囊的作用与功效是什么?疏风解毒胶囊可以起到解毒利咽...
艾叶的功效与作用有哪些?1、散寒止痛艾叶为菊科蒿属植物艾的叶...
治疗白发的偏方有哪些?1 桑白皮30克，五倍子15克，青葙子60...
紫癜性肾炎是什么病?所谓的紫癜性肾炎，就是由于患者对于某些东...
维生素ad是什么?维生素AD是指维生素A和D的混合制剂，是两种脂溶...
乙肝小三阳严重吗?乙肝小三阳有些比较严重，也有些不太严重的，...
常见疾病
更多体育健身
更多
随着科学技术的不断发展，信息技术水平得到了不断的提升，自媒...
天津北方网讯：6月21日晚，天津市2023第三届海河国际消费季暨第...
记者了解到，陕西多地近期开展6月份HPV疫苗接种预约工作。西安...
数字储能网讯：近日，多地气温持续攀升，京津冀鲁多地气温达到4...
“瓦格纳”没有牵动金融市场神经？华尔街：情况不明，后市未定
原标题：高质量发展调研行丨1+1＞2原本发展垫底的广东汕尾如何...
