支付宝充值页重制,年轻化AIGC设计!
郑州/UI设计师/1年前/2967浏览
版权
支付宝充值页重制,年轻化AIGC设计!
整个充值页面板块可以分为两大类分别为主功能(充值功能)、辅功能(活动/服务)
头部卡片主用于用户信息展示与切换,以用户号码为主要信息,用户余额为二级信息进行标注,卡片信息权重为 号码(即用户信息)> 余额 > 运营商信息 > 我的入口
话费余额使用浅黄色标注,区分颜色并略微增加用户余额紧迫感,增加流量余额显示,提醒用户流量充值需求
使用手机卡芯片作为图标,降低用户认知成本,使头部卡片与现实中的手机卡相关联,增加卡片亲近感,使页面风格更年轻可爱化,使用运营商主题色与LOGO底纹,直观表达账户运营商信息
左右滑动即可切换不同卡片,切换为不同运营商时主题也会跟着运营商的色调进行变化
会员卡片和优惠券为充值时可提供优惠的功能,样式醒目色彩丰富可以增加用户点击率
会员卡使用表示尊贵的金色与金属质感呈现,既可以丰富页面色彩,增加点击率,也可凸显VIP的尊贵感,优惠券采用券票样式设计,降低用户认知成本,使用红色表达“优惠”、“红包”,凸显主题的同时增加用户注意率
将充值数量更改为选择式,增加悬浮支付按钮,增强用户点击欲望,选择时使用沁透的蓝色光框进行标记,增加视觉精致度,活动或功能使用浅彩色底板区分,既做出了样式区分,也不会有过于浓重的色彩使主次不平衡
活动板块主要展示特惠活动于其他充值,页面营销色彩浓重,使用大量彩色卡片设计区分活动内容且抓住用户眼球,滑动向底部时充值分类将悬挂于顶端,当充值板块彻底隐藏后,对支付悬浮按钮进行隐藏
充值服务为功能类板块,使用轻透的浅彩色卡片设计,既可以增加页面精致程度,也不会有过于浓重的色彩破坏主次,页面头部采用浅蓝色渐变,呼应支付宝主题色,增强品牌感,下方板块选择浅蓝色渐变与白色投影卡片配合,增强页面轻透感与立体感,卡片选择12pt平滑圆角与浅彩色大扩散投影,可以增加页面亲近感和质感,使整体风格更加年轻化
合理调整页面边距、板块间距与卡片间距,使页面更有更有年轻感、松弛感、呼吸感
卡片内插画素材皆为AIGC生成后抠图处理使用
18
Report
声明
46
Share
相关推荐
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
You may like
相关收藏夹
Log in
18Log in and synchronize recommended records
46Log in and add to My Favorites
评论Log in and comment your thoughts
分享Share



















































































