广州总部电话:020-85564311
广州总部电话:020-85564311

广州网站建设-小程序商城开发-广州小程序开发-企业微信开发公司-网站建设高端品牌-优网科技

20年
互联网应用服务商
请输入搜索关键词
知识库 知识库

优网知识库

探索行业前沿,共享知识宝库

淘宝这些页面设计,暴露了实力!
发布日期:2025-05-22 07:17:38 浏览次数: 809 来源:顶尖设计榜


引言

今年你在淘宝许愿了吗?

不同于以往以“金钱刺激”为核心的权益互动,今年,我们选择回归春节的本质——“祈福”与“期待”,以“情感+权益”双重价值驱动,通过普适且契合新春氛围的许愿概念和低门槛的年俗玩法,设计本次主线玩法。
图片


本次春节互动和乙巳年春晚合作,在设计上更多考虑全民性和普世性,让用户参与时“情绪上”有惊喜有共鸣,“体验上” 简单好玩丝滑。


以下来分享我们在这次活动中的设计思考。




#01 许愿灯 IP 创意设定

我们在传统民俗许愿形式里选择「灯笼」作为许愿的载体,30个权益等级分别对应30盏不同的许愿灯,活动共有5个大波段,贴合春节背景设定为「福禄寿禧财」,每个阶段由一个「淘彩头灯」来诠释主题。灯笼的造型也随着等级提升从简到繁,对应获得的权益也会越大,用户成长路径清晰简单。今年你攒到了几盏许愿灯呢?

图片


图片


每个灯笼的许愿主题设定标准是「我真的有这样的心愿啊」,力求好寓意接地气不无聊,我们把有趣的谐音梗转化为可爱造型,加入拟人化的情绪设计,传统形式结合新表达,给活动垫定一个亲切有趣的情感基调。虽然大家都是冲着红包权益来的,但是可以赏心悦目的攒红包,也是一件好事啊。



互动主页面我们去除了所有信息干扰项,把视觉的重心全部给到了许愿灯,许愿灯的氛围动效就非常重要。


我们用2D素材仿真实现3D动态设计,在降低动画素材尺寸的同时,保证灯笼的展示效果,避免页面加载速度慢或者动画掉帧卡顿的情况。


图片

图片




#02 丝滑的互动交互设计

本次活动玩法多样,为保障整体互动的易理解易参与,设计上以“许愿得红包”核心心智传达为基础,通过统一和精细的交互链路设计,串联多样化玩法场景,让整体体验流畅且富有吸引力。


1. 线性连贯动画串联,让许愿行为更聚焦

为了让用户更专注于核心互动,我们采用线性化串联的设计(能量获取/能量赠送等),让信息提示更连贯。


通过连续动画的方式,将"心愿灯展示-心愿选择-许愿进度-获得红包"这一完整链路自然串联,让用户能够快速建立对许愿场景的认知,实现更顺畅自然的许愿体验。


图片



2. 有预期的分层任务分发,降低操作阻断感

为了让用户更聚焦在赚能量点亮心愿的主链路,我们将分支任务融入到主按钮中触发


为了避免直接传统弹窗带来的突兀感,我们增加了触发动机的解释动画,让弹窗的出现更符合用户预期和利益,从而降低操作阻断感,提升分发效率。


图片



3. 权益动线化牵引,用户目标更明确

我们通过双进度框架的设计,在用户动线中强化权益描述文案和提示,配合成就感反馈机制,形成权益动线闭环。


这种设计让用户在参与过程中能够清晰看到自己的目标和进度,从而激发持续参与的动力。


图片



4. 轻量化游戏设计,趣味年俗更好玩

作为本次活动的能量获取的核心支线任务,我们设计了轻松有趣的年俗游戏玩法,让用户摆脱传统"任务式打工"的枯燥感。


通过清晰的游戏规则指引、明确的阶段目标牵引,以及游戏结算时的成就感战绩展示,让用户在趣味中获得能量,激发反复挑战的乐趣。 


图片


数据显示,最受欢迎的小游戏是「一笔连福」、「猜谜题」和「回家过年」快来看看你最喜欢的小游戏是哪个吧~





#03 精细化的互动UI设计

1. 框架简化用户理解

UI设计克制收敛:首页14个模块大致分为4档层级,层次分明、关系融洽;不喧宾夺主,烘托主体,不抢戏不冗杂,简化用户理解。


图片



2. 氛围增强用户感受

1) UI用色 - 明暗对比反衬心愿的光亮


图片



2)主体光效 - 梯度差异渲染许愿的历程

通过动效素材叠加,还原灯笼逐步被点亮的视觉递进效果;点亮进程中,用环形扩散光芒作为反馈效果,规避主体因光效叠加导致的中心曝光问题。


图片
图片


图片



3. 统一性贯穿各业务场景

1)介质表达统一


图片


2) 基础UI一致性


图片


3)支线玩法素材表现一致性


图片




#04 有趣的春晚联动玩法

乙巳年春晚是淘宝第4次春晚合作,我们设计了更多有趣的玩法,让用户边看春晚边玩,让大家欢欢喜喜过年。



1. 让1亿人登台春晚 - 云参演证

作为蛇年央视春晚独家电商互动平台,我们使用AIGC技术设计了全新的互动形式。通过AI换装让用户云代入春晚演职身份,庄重的春晚主持人、神秘的魔术师、侠气的武术演员等,让用户玩到停不下来......


设计师们的参演证定妆照也是个性十足,大家也可以在评论区晒出你的云参演证哦~


图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片


2. 愿你所愿皆可成 - 心愿兑现

全球华人累计许下9.08亿个心愿,淘宝联合多个品牌送出心愿好礼,为每一个在淘宝许下的新年心愿实现助力,为大家新年美好的期许送上祝福。


你许下的心愿,淘宝帮你实现了吗?


图片



3. 线上拜年仪式感 - 新春送礼

拜年送礼作为人人都参与的新年必备流程,我们通过春晚联动,将线下的传统年货消费方式线上化,构建了许愿IP中全场景的新春生活仪式感。通过仪式感的玩法表达,为全球华人提供价值1000万的新春好礼,为用户的线上春节互动提供更多惊喜。


图片



#05 结语:设计“唤醒情感”让春节线上化

在这场春节互动狂欢中,当用户许下心愿、分享祝福时,大家不仅在参与活动,更在创造属于自己的春节记忆。淘宝不仅是购物平台,更是亿万用户心愿的见证者与实现者。


春节期间,全球累计有2.5亿用户参加活动,写下了对新年新希望的期许,来回顾下承载你美好愿望的许愿互动吧~



感谢你看到这里,我们为你准备了 2025 心愿开运壁纸哦~

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片

图片


来源于:@淘宝设计
https://mp.weixin.qq.com/s/GWhV_VZpsgpOyoIePZYrgg

--------------------------------



优网科技,优秀企业首选的互联网供应服务商

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!

优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。


我要投稿

姓名

文章链接

提交即表示你已阅读并同意《个人信息保护声明》

专属顾问 专属顾问
扫码咨询您的优网专属顾问!
专属顾问
马上咨询
扫一扫马上咨询
扫一扫马上咨询

扫一扫马上咨询