天猫双一一总结

天猫双一一总结 第一篇

针对以上的定向的项目理解和定义；横向的竞品分析和用户调研，对 PD 提供的的数据和文档进行交互设计方案的输出。整个交互方案从产出到定稿，共调整了 九 个版本，其中设计过程的价值对我来说甚超最终结果，因为过程中的查漏补缺，让我真真实实感受到自己的成长和进步，废话不说，先从第一版的交互稿 说起：

在第一个版本里，提出最突出的亮点功能板块有两个：

（一）“时光机”的概念，第一板块中的“转动神秘罗盘，查看我的过去现在和未来”

把经过的地方、喜欢过的品牌、买过的商品、个人标签称号封装在一个“时光机”的故事里，提炼成“走过”、“爱过”、“买过”、“有过”四个节点：

后来由于采集数据的成本太大，未来商品预测的算法逻辑过于复杂，项目的时间有限，设计输出的时间太赶，此板块延展性的功能被砍掉，只保留了当前双 一一 实时的数据和信息。

（一）第二个亮点功能就是：“查看我与身边土豪距离有多远”

此功能板块从三个维度去诠释：

从这三个纬度诠释信息的原因是，很多人可能消费金额不多，可是购买件数很多，因此还是非常乐意去分享引流。

后来，还是因为土豪/人均消费数据的敏感性，也处于对用户隐私数据的保护，我们只保留个人消费的数据，和土豪的排名。

在交互稿–的版本里面，主要做出的调整和亮点主要有以下几点：

（一）产品的整体封装

优化前的导航大标题是非常正式的“双 一一 交易额”文案，优化后是“我和双 一一 的那些江湖事儿～”，一部分是考虑到阿里的江湖文化，把整个双 一一 活动比喻成一场江湖大事；另一部分是用户在双一一 会场购买的行为也像是在此江湖中发生的奇闻逸事。

确定好主题后，进而对页面功能划分为三个模块：“江湖剁主”、“剁手神功榜”、“剁主浪迹”，把整体的功能数据封装成一个故事，故事中不同的环节即是产品的核心功能，此操作既提升产品数据可读性，又降低无趣，增加分享概率。

（二）增加自定义分享板块

最初的设定是分享整个页面，包括个人头衔/标签，购买数量，附近热门商品等，但后续评审中考虑到用户分享的欲望和分享次数都会被限制，有些数据不便曝光在朋友圈，最终确定支持用户自定义分享，让分享弹力、次数和机会也更多，最主要的是用户的隐私数据得到了较好的处理。

（三）增加土豪距离我的实际物理距离通知

调整前是用户和上一名剁手党进行对比，例如通知用户：“您距离上一名用户剁手值相差 三零零 块“，考虑到此信息对用户刺激点太低，同时又要保护土豪用户的数据隐私，另一方面也为了线上线下可以进行互动趣味，我们最终确定添加土豪距离用户的物理距离。

想象你在商场购物，手机突然通知你：余杭最大的土豪距离你 二零零M，前方高能预警，你是否会立刻警惕兴奋起来，从此擦肩的人都长了一张土豪的脸？还因为手淘大部分用户是女性用户，经调研验证，此功能点更能让她们嗨起来，因此我们保留并做了深化处理。

除去上面的功能调整，其他的优化点里面，我还强化了“我”和“土豪” PK 的场景和氛围，让节日和剁手大赛的味道更浓更直观，在这种“厮杀”的氛围中，用户的购买欲也更容易得到释放。

经过了版本的调整，终于交互定稿了，在最终确定的交互稿中，可进行完整页面的分享，也可进行自定义板块的分享，单个页面主要包括三个部分：

在交互定稿中，其实相比之前的版本，也做了很多细节的调整和优化，这里我主要分享 四 个点给大家：

在这一点上，在做对外设计的时候还是需要非常关注特殊人群的介入，媒体人群在整体的分享受众中所占比例的确不大，但是他们所发挥的舆论和传播价值是对产品影响非常大的。

天猫双一一总结 第二篇

一、在角度上面，背景高楼的倾斜和下面色块的倾斜，带来非常强的纵深感。在平面上构造空间纵深感。

二、其次也起到了非常强烈聚焦效果，让你的视觉直击中心。没错就是商品和标题。

三、强烈的倾斜角度也给人带来了速度感，在心理上面让用户感受到节日的氛围和紧张感受。（一紧张就想抓点什么）

三:颜色

配色上面主打紫色调和渐变色、另外如左图所示，渐变色均为临近的颜色渐变，所以也不会那么突兀。

一、天猫国际主色调为紫色

二、紫色是由温暖的红色和冷静的蓝色化合而成，是极佳的刺激色。

所以刺激不就是促销最需要的么。

在中国传统里，紫色是尊贵的颜色，如北京故宫又称为“紫禁城”，亦有所谓“紫气东来”。

其次、紫色高贵神秘的颜色。

三、辅助图形为渐变色、很醒目和时尚。相信大家在八月份的时候应该会看到过类似这样一篇文章：

渐变配色的回归正巧是在扁平化大行其道的今天，所以它不可避免地同大量扁平化的元素搭配到了一起，而其中最值得考虑的因素，就是色彩。某些用色最大胆、跨度范围最大的渐变色设计干脆直接就从扁平化配色中“借用”色彩。

但是，只是把渐变色用在背景上面。所以在辅助图形上面用上了渐变色，非常出彩。

要说明的是，颜色用写轻佻一些的，别老是正那些近视色，搞得页面标题标题不突出、商品商品不突出。

另外放二张be上面设计师的二张作品

cool

四:标题

天猫的页面标题没有立体，没有夸张的变形。够直接、清爽、大方。

居中排版最稳定、也是最容易的做法。上文、下图，也是运营活动主会场最常见的应用方式，因为给人比较正式、重要的感受。你想想一个点如果在右边、左边是不是显得不是那么重要，没有主角光环。

再看电影海报，是不是主角都在中间。就是要告诉那么多页面、那么多类目我就是主会场。

五:辅助形

天猫双一一的logo爆出来的时候、就知道他的辅助形很多就是logo围绕的那些椭圆射线、似舞台感觉、又像人民大会堂不信你看。

哈哈，开个玩笑、还是说正经的吧。

一、辅助形椭圆形非常好的动感图形，又圆润。辅助图形上面也是有一条视觉引导线。

把风格和空间感结合起来，让平静的页面图案动了起来的。同时它们之间都连接起来，不会造成视觉的散乱。

这样可以给页面带来动感和引导、动词打次动词打次。

二、猫头里面的图案和应用页面背景的圆形图案。

猫头里面不管是并列的小圆点，还是发散性圆形图形，都带来了视觉上面的节奏感。也可以说这种风格是欧普风（不了解的可以百度下）。

图案总是给人一种精致的感觉、而平面构成几何图形总会让你的页面更加很时尚、节奏感、动感。从视觉心理上，平面构成与图案也就形成了在对艺术形式的审美感知及情感体验。

列如：

这些元素的组成结构严谨，富有极强的抽象性和形式感。又具有多方面的实用特点和创造力的设计作品，与具象表现形式相比较，它更具有广泛性。

天猫双一一总结 第三篇

先来几张分会场头图

那么我们从以下几个点分析下分会场：

都具备有

一、背景椭圆图案的复用、椭圆辅助形的贯穿整个活动。

二、颜色轻佻、对比强，促销氛围感强，加上了渐变色，同时也很新颖。

三、排版右文左图，分会场的最明显的特征之一。，这样做让分会场的易用性非常高。

其次：

辅助图形部分用到了颜色的重复，视觉上面还挺有意思的嘛、同时带来了也有节奏感、动感。

顺便放几张前几天收集到的几张颜色重复的视觉图、大家随意感受下：

全程总结：

一、渐变色更出彩、轻佻、时尚；

二、几何图形让页面具有时尚气息、抽象性和形式感；

三、商品和辅助形之间需具有视觉上面的连接。

越努力，越幸运。

这里是庞门正道。

来自： 相信心诚则灵fh > 《待分类》

零条评论

发表

请遵守用户 评论公约

这是二零一九年最大的平面设计趋势之一

这是二零一九年最大的平面设计趋势之一。这里有一些可能在二零一九年占主导地位的平面设计趋势。“Wolff Olins的Chobani品牌重塑是一个很好的例...

射鸡湿之奇门遁甲——平面图形logo养成术

射鸡湿之奇门遁甲——平面图形logo养成术。

“色”一点，没关系。

然而时尚是个轮回，当二零一六年Instagram悄悄更换logo，棕色相机一夜之间变成桃红色渐变相机，复古到时尚的转变，Ins用户睁眼打开APP发现世...

教你用布尔运算制作LOGO

教你用布尔运算制作LOGO.我们来学习一下如何以正确的姿势来使用布尔运算进行LOGO设计，带给大家的是一个有母的果子，正常也不会有果子长...

交互界面-理论研究-门户网站设计

门户网站有很多种。根据网站提供的产品/服务特点展开logo设计。我们在设计网页的时候必定会考虑到分辨率的问题，科技发展到现在我们通常用的是一零二四*七六八和八零零*六零零的分辨率，现在网络上很多都是用到七七八个...

企业logo设计注意事项，你都知道吗？

企业logo设计注意事项，你都知道吗？一定是这个品牌的logo，而logo作为企业面向大众的第一印象，也是越来越被重视，如果一个企业没有logo，结果就是很难被大家记住，不妨可以看看周边，可以注意到从小...

【视觉欺骗】看看上下两个图形哪个颜色更深一些？

【视觉欺骗】看看上下两个图形哪个颜色更深一些？

纯白背景嫌素，图片背景太花？分享三个超赞的PPT背景方法

分享三个超赞的PPT背景方法。但一般的纯色背景、渐变背景、纹理背景，难免仍旧会显得有些单调，那有没有更高格调的背景美化方法呢？作为...

网页设计与平面构成

网页设计与平面构成平面设计在网页设计中占有相当大的比重，而平面设计的重要理论基础则是平面构成，所以说，平面构成也是网页设计的重要理论依据和知识基础。概念形态，指人的视觉和触觉不能直接感知...

微信扫码，在手机上查看选中内容

微信扫码，在手机上查看选中内容

天猫双一一总结 第四篇

理解和定义了项目以后，我们已经清晰的知道自己接下来要做什么，如何去做，如何精准的定位发力点。梳理清楚了项目和设计目标后，为了避免“闭门造车”，也为了更加明晰的了解市场上已有的“热梗”和流行趋势元素，我首先对是市场上比较火的 H五 页面进行了体验和分析，以下几个是给我体感比较丰富的几个案例：

体验完以上的营销活动，我发现这些的优秀都具备 三 个特点：

所以，从体验竞品和竞品分析中，我分析了使用/传播我们页面活动的用户需求，针对不同层次的用户，深挖了他们内心深处的需求点，给出引导其引流的刺激点。

天猫双一一总结 第五篇

此项目从开始到结束，项目周期为 四五 个工作日。从产品提出想法，到最终开发落地，测试推广上线，时间非常紧迫，但是在有限的时间内，大家还是非常用心的完成了全部工作，尽管效果不错，但是其中也有些现在看来可以做的更好的地方。

首先针对项目的时间给出一些自己的建议：

其次，在不同的时间节点和不同的项目角色进行沟通时，需注意的点如下：

对于异常状态的设计，需注意事项有：

作为一个交互设计师，其实很多时候对于交互输出的质量验证中，是否对异常场景考虑全面，能否给出合适的解决方案，这是一个比较重要的指标，但是在做对外产品的时候因为本身用户的属性和层次不同，就会出现很多异常状态：

首先考虑全所有的异常场景，可以对场景进行归类。

例如不同用户类型的操作异常、网络异常、空白页面等，先从大的板块梳理下去，具体到每一个异常页面；自己多总结归类的同时还可以发动小伙伴，因为项目组的小伙伴是来自不同的 BU ，关注的点和设计关注的点有所差异，所以可以拉起一场会议发动小伙伴的力量，尽量在设计的时候把所有的异常场景都覆盖到，先总结，再完成，再完美。

其次，在阿里产品都在往国际化方向进军的时候，营销设计必须考虑国际化的因素。

例如外国生活圈街道和人名字基本的显示规则和需要考虑的超出宽度的场景等交互问题，具体排名的表述，这关系到外国友人直接的清晰认知，我们在设计的时候也要考虑他们的生活场景和认知习惯。

最后，在真实的场景中多体验自己的产品，揣摩用户的真实心理。

例如在本次红包的倒计时的逻辑设定中，红包出现的前 三 秒钟就开始倒计时，为了让停留在本页中的用户提前感知到接下来会有红包雨出现；但是到双一一当天，我抢东西的时候，因为红包出现的比较频繁，不停打断我抢购，而且每次出现都有倒计时 三 秒钟，其实当时的体验是这 三 秒钟有点像 三 分钟，其实这一点是对真实场景下用户的心理把握的还不够到位，希望后续大家在做此类设计师可引以为戒。

天猫双一一总结 第六篇

通过去中心的方式传播双 一一：

（一）精神驱动：

（二）利益驱动：

分享站内提升流量和用户回访率/驱动力：

（一）从众心理

（二）好奇心

谁在买，谁在推荐

（三）利益驱动

红包、优惠券等，特权码等

天猫双一一总结 第七篇

其实本人也是第一次做这种营销形式的 二C 的产品&交互设计，因为日常负责的业务更多的是集团内部 二B 产品，发现在做对外的产品时和内部产品，其实在设计的时候，有很大的不同，大概先扔个砖头，后续再持续补充：

造成如此差异的原因，主要是因为不同的产品定位、使用场景、用户需求和使用习惯，我们在做设计的时候必须清楚我们的项目目标和设计目标是什么，并时刻谨记，才能不偏离产品方向和用户需求，做出有价值的产品和设计。

分享是成功她姥姥，进步她麻麻，希望大家多多分享沟通交流，以此共勉。

本文由@ 薇子 原创发布于人人都是产品经理。

题图来自网络