电商丨双11期间,阿里巴巴UED的设计师都在做什么? - 优设-UISDC

电商丨双11期间,阿里巴巴UED的设计师都在做什么?

2016/11/11 20317评论区

alibaba-designer-in-double-11-1

编者按:双11 忍不住剁手的冲动?因为你所有的购物喜好,心理,行为和最终的选择,都被一个神秘组织认真研究过。今天我们拉开幕布,看看这个叫阿里巴巴UED的顶尖设计团队。

在11月11日这个日子的前后一段时间,当你发现如下症状之一:

当你被机场、地铁、公交站牌和网页里频繁出现的双11提醒,感觉重要的时刻就要来临;当你心跳加速,不管什么都先放到购物车里再说;当你最终等待在11号这天的凌晨用风一样的速度支付成功,并长吁一口气;当你认为一切都那么的简单、自然、纯粹,不过是一场轻松的购物。只能说你Too young,Too simple。你的一举一动已经被一个神秘的组织所引导,它让你下单时够快、够准、够狠,并且你毫不知情。·

购物真的有那么简单么?要知道,一次成功的网购背后,或许有20个负责引导你的按钮,有N个关键性的页面,有无数个视觉“诱惑”让你在0.2秒内做决定,以及用人工智能分析大数据推荐出来的“你会喜欢”的选项,它们都隐匿在你看不见的地方,决定着这次成功的购物。也就是说,你所有的购物喜好,心理,行为和最终的选择,都被认真研究过。

谁“规划”着这一切?谁是这个神秘的组织?今天我们拉开幕布,看看这个叫阿里巴巴UED的组织。

选择背后丨他们负责美化你所看到的一切

“用户体验设计是最贴近用户的,它是消费者跟产品之间的最后一道工序。没有它,产品就无法见人。你会发现任何一家创业公司,哪怕只有几个人,都不能没有技术和设计。”

uisdc-alibaba-201611112

UED,全称User Experience Design,即用户体验设计。目前在阿里巴巴集团,UED成员仅占庞大集团总员工的三十分之一,却掌管着互联网产品最重要的环节之一。这个群体由交互设计师、视觉设计师、用户研究组成。通常来讲,他们的任务就是:将复杂的产品逻辑、数据化,转化为用户可感知和操作的产品,与人产生互动。

如果阿里巴巴的产品比作一个女生,UED的工作就掌握着她的“门脸”。多了出门前化妆这道程序,会让你对迎面而来的这个人顿生好感。同时又利用大数据洞察着消费者的心理,要穿哪件衣服,做什么选择,或许比你更了解自己。简单说来,既美化你目之所及的页面和视觉,又研究着你背后的消费习惯和心理动机。

这么讲好像还是有些遥远和空洞。那让我们看看几个案例,UED都究竟做了些什么。

案例1  如何打造全宇宙最大的狂欢

sp-20161111

播放地址:https://v.qq.com/x/page/u0337k6ki41.html?ptag=qqbrowser

相信你很早以前,就已经被上面这条1分钟的广告刷屏了。你会发现每一年,双11的宣传和推广都会升级更新得更强大,那些由不同的品牌填充的猫头,简直无处不在。

这个全宇宙的Party,UED究竟负责什么呢?

Step 1. 确定主题,制定品牌的视觉规范

确定今年主题叫什么,设计标志和VI,并不是一拍脑门的事。从8月份开始,专门负责双11的项目组的几十个UED设计师便开始了紧锣密鼓的筹划工作。一个由发散的光柱汇聚而成的猫头最终确定为2016年的logo,在“迸发精彩”这样的关键词下面,呈现出整体向上的律动和方向,成为今年的大趋势。

uisdc-alibaba-201611114

△ 2016年天猫双11的品牌LOGO。

uisdc-alibaba-201611115

uisdc-alibaba-201611116

想到狂欢和节日,都和怎样的氛围联系起来?而视觉,又该怎么去表达这种难以言说的氛围?UED的成员们通过头脑风暴和用户调研,将今年的主题 All in One 做了完美的诠释:每一个人都有精彩的点,每一个人都是精彩的点,我们在双11聚合在一起,迸发出更加精彩的世界。你所有的热爱都在这里体现,你所有的选择都可以在这里找到。UED透过设计,带领消费者发现精彩与无限感动。

Step 2. 规划和指导整个App端、Web端的所有创意和平面美术风格

敲定了All in one的主题之后的事情也越明晰、越具体。视觉的规范也跟着建立起来:全品牌、全平台、全球融合为一点,设计更“放肆”,突出年轻、大胆和多元化。设计师们研究了大半部色彩艺术史,最终决定用撞色和微欧普的风格来承载这次的主要视觉。

uisdc-alibaba-201611117

△ 品牌色彩规范:确定了撞色、高饱和、色不过三、邻近渐变等原则。

uisdc-alibaba-201611118

△ 高饱和度色彩的对撞,点阵纹理和搭配效果,营造出狂欢、节庆的气氛。

所谓的“微欧普”,是从出现于20世纪的欧普艺术作品演化而来。通常借助线条、形状和颜色的周期组合或特殊排列,制造出一种视觉错觉。设计师们发现,利用几何线条的交错并置,配合明亮的颜色,能带给用户兴奋和愉悦的视觉刺激。然而不能是过于强烈和生硬的刺激,还需要融合的愉悦的感官。UED团队最终借鉴欧普艺术和3D、透视等装饰效果,达成了这样的效果。

uisdc-alibaba-201611119

uisdc-alibaba-2016111110

uisdc-2016111-2 uisdc2016111-1 uisdc-20161111

△ 参考效果和视觉

Step 3. 线上互动设计与推广

无论是在手机端的互动游戏开发,还是微博、微信的营销推广,UED都是背后的谋划者和风格把握者。光是看到那些分阶段、源源不断露出的造势素材,就忍不住为背后的海量工作吸了一口气。下面就让我们来看看这浩如烟海的宣传准备中,那不到百分之一的成果

ali-20161111 ali-20161111-2

 

uisdc-alibaba-2016111120

打破之前去年用大量真人图片PS的视觉后期处理的效果,而采用现在比较流行的欧美简约铅笔淡彩的插画风格,线条更加单纯,色彩也更少。尽量用最少的视觉语言表达出最丰富的信息。艺术感更强,弱化传统促销广告那种故有表现形式。让受众打开广告的一霎那先被画面吸引住,再把信息预埋在里面。这样的画面可以说就算下载下来也值得收藏做桌面。

uisdc-alibaba-2016111115

游戏与互动设计也层出不穷,力求让你黏在手机上停不下来。左边打造了一个3D的狂欢城,手指滚动就可以看到更为立体的商城环境。右边“寻找狂欢猫”则是一款流行的AR玩法的游戏,组织了4大城市进行事件营销,掀起一波捉猫狂潮。

uisdc-alibaba-2016111116

国门之外实力越来越强的剁手者也不放过,比如特意做了一系列走向海外的四个小人动图。

以及又贱又萌的天猫GIF表情。

aliuisdc-gif-20161111

aliuisdc-gif-20161111-2

 

-aliuisdc-gif-20161111-6

Step 3 . 线下园区装置,一起互动吧

如何让神秘的、萌萌的猫头宣告新一轮的欧普Party即将开始?除了落地广告和满屏幕的攻势,UED的设计师们还在线下阿里巴巴园区中捣鼓出一些萌翻天的装置,做足了与人互动的部分,打造嘉年华的感觉。

uisdc-alibaba-2016111119

uisdc-alibaba-2016111118

新的科技VR、AR也同时使用起来。设计师们还设计了一件互动T恤,可以让胸前的图案活过来。打开天猫手机APP,将摄像头对准小伙伴的胸口(的图案),就可以在屏幕上看到图案跳动了起来。感觉玩得已经停不下来!

uisdc-alibaba-2016111121

总之,以上种种,不过是整个项目的一角,如果想要讲完,可能还需要三篇文章。

案例2  打造一个造物节

uisdc-alibaba-2016111122

双11之外,还有许多可以例举的项目,以证明阿里巴巴UED设计师们的神功。比如上半年的淘宝造物节,同样是非常精彩的例子。

造物节一个以年轻人创造力为风向标,引领、分享当代青年创造思维的狂欢活动。一开始确定logo和视觉的时候,UED们就开始启动提问模式:造物,创造,会让人想到什么?以下是部分设计师们放纵脑洞的结果:

uisdc-alibaba-2016111123

△ 由造物一词大开脑洞想到的其它关联。

uisdc-alibaba-2016111124

由此而延伸出的灵感是,把TAO拆分,不再指淘宝,而是代言着科技、艺术与创造几部分的创造力,并最终组成了塔尖状的、有固定性和仪式感的三角logo图形。

uisdc-alibaba-2016111125

不想只是传统的让用户买买买,而是想用会讲故事的,仪式感强的新内容吸引创造力爆棚的年轻人们,怎么用设计去完成这样的使命呢?

UED达人们又开始找出这样的方法:会讲故事=构造一个造物世界。例如,建造了十个有故事的造物空间,并且将风格统一,绘制有立体感效果的空间和物件,填充这些不同的故事。

uisdc-alibaba-2016111126

uisdc-alibaba-2016111128

△ 绘图的设计师分享的绘制过程与逻辑。

uisdc-alibaba-2016111127

uisdc-alibaba-2016111129

△ 最终他们画出了这样风格的物件。并基由这些空间和元素,造出了一座2.5D之城。

而以上种种,不过是平面和视觉范畴里的一部分工作,更大的工作量其实是:如何让用户玩起来?UED们把这个项目定位于“以娱乐为己任,把造物精神都穿插到了游戏环节中”。确定了关键点之后,另一部分的设计师们开始了关在小黑屋里玩游戏的体验工作(听起来好像很美好,实际上一边玩一边总结规律、挖掘特质,很容易烧脑的)。

连续加班并在各种游戏中过关斩将之后,终于确定了一个听起来非常复杂的结论:我们要做一个“动作类游戏+养成/经营游戏+排行榜组成的互动”。

uisdc-alibaba-2016111130

紧接着,开始确定了游戏的界面视觉,不同环节中的颜色配置,以及标题、字号等大事小节。开始规划软装的时候,除了一层一层的整合信息,还需要考虑到用户的在几屏之后会放弃,也就是用户研究的工作,对应的工作难度也越来越高。

uisdc-alibaba-2016111131

我们翻到了设计师们理清结构的脉络图,尽管看不太懂,但是从感觉和声势上来说一定非常厉害。反正最终就建成了这样一座城的效果。

uisdc-alibaba-2016111132

uisdc-alibaba-2016111133

uisdc-alibaba-2016111134

更厉害的是,这座造物节还会对应线下的导航系统,指引用户抵达真正的商店中。而线下的沟通和设置又将是另一个一千零一夜的故事……由于太过复杂,我们在这里不再一一描述了。

与我们想象中不同,大部分的时间,UED的设计师们所做的工作不仅仅是狭义的“设计”,而是从产品定位、规划、用户习惯研究、用户体验,直到落地,这整个过程中需要强大的抗压能力和科学的工作方法,如同打怪兽一般,去解决遇到的所有问题。

案例3丨试着用色彩去购物

uisdc-alibaba-2016111136

如果说上面的例子都是庞然大物般的存在,那么这个有关色彩的项目就是UED里的小清新。在这个案例中,将更多展示UED设计们的工作方式和思维过程。

色彩购,最初是由3个设计师去发起的项目。他们提出疑问:除了常规的如货架般地购物,有基于地图的购物方式,还有基于节气的购物方式,所以能不能有一种关于色彩的购物方式?一个想法总是最简单的引子,接下来,他们开始去论证关于色彩购物存在的必要性。

而这个漫长而详尽的调查过程不亚于写一篇毕业论文。调查初期,三个人分别从三个角度去观测自己感兴趣的色彩。于是就有了以下这些关于日本的服饰色彩研究,理科生眼中斑斓的细胞色彩研究,以及艺术爱好者关于油画中的色彩,和艺术装置中的光谱色彩研究。

uisdc-alibaba-2016111137

△ 日本和服的色彩与搭配

uisdc-alibaba-2016111140

△ 理科生眼中的色彩故事。

uisdc-alibaba-2016111141

△ 油画中的色彩与艺术装置的光谱。

就像读研一样,课题开始之前,他们甚至先给自己列了一份书单:要看一堆关于地域性的色彩文化、色彩搭配案例、色彩心理学种类的书籍。

uisdc-alibaba-2016111142

给自己的生活定制了短期的目标:比如,去看同期生的研究课题,看自己的想法是否足够“先进”,能否落地;以及,尝试着培养一项简单的习惯来磨砺自己,坚持每天听古典音乐也在其中。(这不是设计师,完全是总统候选人的前期准备……);与越来越多的人分享和交流,使得关于色彩的想法更加成熟。

他们也从商业系统、电影、文化等各种领域中找到支撑点。

uisdc-alibaba-2016111143

△ 基于颜色分类的商品销售模式。
uisdc-alibaba-2016111144

△ 电影中的场景和配色,会达到一种令人印象深刻、独特的视觉效果。

他们还设想,如果是365天中,每天分享一种颜色,是否能够成立?于是他们挖掘出了生活中诸如苔之绿、露草色等无数种颜色。

uisdc-alibaba-2016111145

并用自己的相机和镜头,记录周遭的一切颜色。事无巨细地发现、归类生活中的色彩,制作对应的色卡色号。

uisdc-alibaba-2016111146

uisdc-alibaba-2016111147

手上功夫也到位,用棚拍+手作的方法,打造首页的专题图:

uisdc-alibaba-2016111148

不断实验、实验。邀请欣赏的设计师们,一起在无数种颜色中一起再实验。

uisdc-alibaba-2016111149

把一种简单的色彩,解读出丰富的信息成为常态。以上只是展示了前期和准备的过程,仅仅是这个项目的分析和总结,他们就写了将近100多页的文件。然而这些还不够,累计到最后,否定之中再肯定,拉绳收尾,将系统化的思维,串联出整个产品的运营和开发。

最后,他们打造出一种年轻的、貌美的颜色购物方式。主打女性群体,还可以收集用户的色彩偏好,定制属于自己的色彩页面。

uisdc-alibaba-2016111150

uisdc-alibaba-2016111151

uisdc-alibaba-2016111152

一个色彩购的设计师这样写在最后:达成以上任务,绝不只是领一份设计工资这样简单。它需要专业的觉悟和驱动力,需要坚持,需要逻辑和系统化的思维才可能实现。

除了设计,他们野心很大,企图打造一个生态圈。

“阿里UED做这些事并不是为了眼前,或者一家企业暂时的利益。我们是平台和服务商,所以天性中就是利他的。大家都好我们才可能好。角色让我们更看重整个生态圈的繁荣,我们有更大的野心和抱负。”

—— 阿里巴巴集团UED委员会委员长青云

一所设计师的黄埔军校

除了设计和研究用户这样的本职工作,阿里UED还做了很多“不该做的事”。在阿里巴巴园区里建了一所UED大学,野心将它打造为中国设计师的“黄埔军校”。主要面向阿里集团内部的设计师,让各个部门平时见不着面的设计们相互“勾搭”,时时都有头脑风暴的机会。另一方面也方便让行业内最顶尖的大咖们担任导师,更方便地进行培训。“大家学到新的知识,再服务于这个平台,形成良性循环后产业雪球自然越滚越大”。

uisdc-alibaba-2016111153

△ 阿里巴巴集团UED大学

Yes,UCAN!

好像每个干大事的团队的前身都是从一些“非法”小型聚会开始,比如苹果的车库。阿里巴巴UED团队的共享精神则可以回到2006年,内部自发组织了一个小型团体“碳酸饮料会”,(或许叫“单身汉设计师茶话会”更贴切)。有的设计师下班后不想回家,索性三五成群地一起关在“小房间”里(备注:开着灯),就着几罐碳酸饮料,互相讨论设计,碰撞灵感。

仅限于集团内部的分享会格局太小,获得的经验和资讯也难免局限。实际上,阿里巴巴的平台中吸纳了成千上万的商家、设计服务公司和开放平台的创业者,他们共同构成整个阿里巴巴的设计生态圈。索性,阿里UED做起了沟通内外的UCAN 大会。每年春天“UCAN”用户体验设计论坛如期报到,每一次都是巨型的设计生态的对话。

uisdc-alibaba-2016111154

△ 2015年UCAN大会

uisdc-alibaba-2016111156

uisdc-alibaba-2016111155

△ 2016年UCAN大会将“设计赋能商业”作为主题。

延续分享精神的出版物

uisdc-alibaba-2016111157

作为分享精神的延续,接下来,阿里UED还打算出一本关于“趋势”的出版物。他们是互联网最有经验的“老司机”,他们想跟合作者、生态圈,以及对手们谈谈之前的经验和案例。为什么?因为设计无秘密。让整个设计行业变得更有创造力,最好的方法之一就是沟通和共享。同样,他们打算用很大篇幅去谈论“趋势”。因为对未来和用户的预测,一直是UED的核心工作之一。

“我是一个有梦想的设计师,我的梦想就是让中国设计师更有钱。”阿里巴巴集团UED委员会委员长青云说,“为什么中国的设计没有日本强,不如美国好?为什么中国很少出现牛逼的设计大师?在国内互联网强势发展的大环境下,我觉得阿里巴巴的平台和资源可以成就更长远的理想,帮助中国设计变成世界设计,让好的设计,创造好的商业价值。”

这群设计师们,究竟长什么样?

阿里巴巴UED下面的设计师大概有1200多位。这样一个由设计师组成的团队和一般的团队有什么不同?高颜值?高品位?完美主义强迫症?千人千面,要用一句话概括基本很难。在他们的微信公众号里这样写道:“这里有国际音乐家、有舞者、游戏玩家、摄影师以及各个领域的爱好者。”所以,这是一个非常跨界的组织。

为了搞清楚他们每天的工作是怎样的,我们特意找了几十位设计师聊了聊。最后,摘录了一些在这里。

在阿里,工作的一天是怎样的?

设计师1号:赖床思考>收邮件>收邮件>会议>会议>设计师讨论>收邮件>电脑前啪啪啪。

设计师2号:在忙忙碌碌中、昏昏噩噩中、脑洞大开中度过。

设计师3号 :做设计+撕需求+PK沟通+开会开会开会+熬夜做设计+看数据分析数据+总结沉淀+挖痛点挖需求挖优化点+做设计,循环往复……

设计师4号 :20%时间发现和思考,20%时间开会和沟通,60%处理事情。

阿里设计师牛B在哪儿?

设计师1号:做得比说得多。

设计师2号:不做设计也不会饿死。

设计师3号 :比视觉更懂交互,比产品更懂设计,比一般的交互……更懂产品逻辑。

设计师4号 :天生的同理心,很强的洞察力,有自己的判断力,高水准的审美。这几点是我的个人特质但也恰好是交互设计师所需要的。

接下来一年的设计趋势,可以做一些大胆预测吗?

设计师1号:Computational design,智能化设计。

设计师2号:交互上信息展示越来越前置,更浅的层级设计,视觉上更加注重场景融入感。

设计师3号:VR、AR会让大家蠢蠢欲动,但能否长久依赖于它能创造多少实际价值。

设计师4号:设计师会越来越多,设计师的价格会下降。

设计师5号:设计趋势根本不重要。

做为阿里的UED设计师,最大的成就感是什么?

设计师1号:我觉得阿里这种体量的公司,里面的设计师最珍贵的绝对是经验。不论你能力有大小,这种产品,只有你做过。

设计师2号:能够将自己的想法实现并让成千上万人从中受益,用户看不见我,但他们能通我的设计感受到我的存在。

设计师3号 :享受解决问题的过程,期待上线的过程。

设计师4号:能从产品直接作用到用户的层面发挥作用,帮助技术和商业合理有效地落地。需要想象力和极大的创造热情,成就感来自于它的特殊性和前沿性。

什么样的设计才能让生活更美好呢?

设计师1号:“不设计”的设计。总体上来说,设计师带来的麻烦比美好还多。

设计师2号:发现问题再去解决问题,而不是创造需求的设计。

设计师3号:出自于能把生活活得很美好的人之手的设计。

设计师4号:看上去觉得好,但又不知道哪里好;用着更好用,但又不知道是哪里好用。

如果你认为存在“设计毒药”会让产品销量惨淡,它是什么?

设计师1号:设计毒药哈哈哈!!!就是站酷的素材,千万不能用。

设计师2号:彩虹式设计。颜色多、过度多、融合多、碰撞少的设计。

设计师3号:相似式设计。字号、字体、颜色、排版等各个元素不一样但又差不多。

设计师4号:听每个人的建议,老老实实按照他们说的去做,最终出来的东西都挺惨淡的

设计师5号:字多!字多!字多!什么都要往上放,什么都要突出!!

设计师6号:对于界面设计来说,语义不明最可怕,忘记哪里看到的话:一堆整齐的硬币和完全散乱的硬币都很美,一堆试图整理而没整理好的硬币是很糟糕的。

设计师7号:所谓的销量惨淡是:惨淡的品牌+惨淡的BOSS+惨淡的创意+惨淡的执行人员+惨淡的视觉,环环相扣缺一不可。

说了那么多,能不能开好一家淘宝店?

设计师1号:不能……

设计师2号:不会,开好一家店需要的不是仅仅店铺设计和运营,还有很多制胜必要因素,比如产品质量、渠道。

设计师3号:答案是NO,研究的越多,感觉越难。当然了,梦想总是要有的,万一实现了呢!

设计师4号:并不能,就像好的铸剑师不一定是超群的剑客。

设计师5号:不会。设计师能开好淘宝店铺就不是设计师了。

「双11 往期设计过程回顾」

Banner 设计丨《揭秘双十一!那些上亿人都在看的BANNER都是怎么设计出来的?》

天猫品牌丨《全民剁手“ALL IN ONE”——2016天猫双11背后的品牌故事》

电商丨《这里有一套双11的组合拳,你要不要学?》

欢迎关注阿里巴巴UED 的微信公众号:

alibabaued-qr

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量180万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/alibaba-designer-in-double-11

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

sketch 优设大课堂 转场动效 界面设计 设计师 扁平化设计 交互设计师 排版布局 职场 平面设计 设计师专访 素材下载 视觉设计 设计流程 配色 web前端开发 用户体验设计 AI教程 海报设计 设计理论 神器下载 字体下载 设计规范 设计趋势 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享
wechat

优设官方微信

50万设计师关注

微信号:youshege

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里