那些上亿人都在看的Banner都是怎么设计出来的?

每到一年一度的大促季,会场、页面、互动游戏,都在紧张设计之中,这些精美的页面和互动游戏,如何与用户产生联系?必然需要一条与用户连接的纽带 —— 它就是BANNER。有些人可能认为资源位的设计相对简单,但其实不然,小小的资源位承载着重大的使命,设计上自然也是下了一番功夫,那这一次的双11我 们是怎么做的?请听我细细道来…..

每到一年一度的大促季,会场、页面、互动游戏,都在紧张设计之中,这些精美的页面和互动游戏,如何与用户产生联系?必然需要一条与用户连接的纽带 —— 它就是BANNER。有些人可能认为资源位的设计相对简单,但其实不然,小小的资源位承载着重大的使命,设计上自然也是下了一番功夫,那这一次的双11我 们是怎么做的?请听我细细道来…..

曦村:在设计前期,做大致规划,是很有必要的,在大促中虽然会有很多变化,但,做规划会帮助我们在大方向上不出错,这次,从了解业务背景及节奏 – 前期风格创意设定 – 突出品牌增强识别度 – 制定规范提升效率等几个方面去做,有了这个框架,这一次的设计过程还是相当丝滑滴!那具体是怎么做的呢?

一、了解业务背景及节奏

今年双11以“全球化”为主题,从主题来看,说明整体方向走国际路线,设计必然要高端大气上档次。不但如此,今年还要突出品牌化!品牌核心元素必须贯穿始终,让用户有明显的感知,设计与设计之间保持统一,传递相同的心智。

三个关键词说明了我们这次品牌的大致方向:

那些上亿人都在看的Banner都是怎么设计出来的?

品牌核心元素给了我们比较明确的图形参考。

那些上亿人都在看的Banner都是怎么设计出来的?

了解整体设计节奏:

那些上亿人都在看的Banner都是怎么设计出来的?

二、制定风格及创意

为何要制定风格及创意?

因为Banner是为会场引流的,须配合会场給用户传递相同的心智,前期的风格及创意的思考,为后期的设计助力不少。

根据每个时期主题的变化,我们需要准备多个创意,这样才能紧跟主题的变化,有多种方案可选。

会场设计:

那些上亿人都在看的Banner都是怎么设计出来的?

会场根据整体节奏分为三个时间段,造势期间-主要运用了贯穿品牌的线条及猫头元素,各国国旗烘托了全球化的主题 / 预热期间-主要突出了货品与猫头 / 正式期间-以金色渲染出狂欢的气氛。

根据以上主题变化做了风格方向及创意探讨,以下是脑爆方案:

那些上亿人都在看的Banner都是怎么设计出来的? 那些上亿人都在看的Banner都是怎么设计出来的?

在前期探讨时,脑爆了多种方案,然后根据每个时段的主题变化,选择合适的创意及风格。

接下来举几个例子,造势期间以全球化为主题,我们思考了全球化,有汇聚各国好货的概念,创意如下:

那些上亿人都在看的Banner都是怎么设计出来的?

商品拼接组成图形的创意,正好符合各国好货汇聚的概念,货品与品牌核心元素的完美结合,用国旗彩条作为辅助元素,突出了天猫与全球化概念的融合,并且让商品组成或者溶于猫头,也体现了这一点!

创意参考:

那些上亿人都在看的Banner都是怎么设计出来的?

随着时间临近双11,需营造紧张,紧迫,激动期盼的氛围,以狂欢为主题,创意如下:

那些上亿人都在看的Banner都是怎么设计出来的?

商品与毛笔字结合,营造出最后关头的疯狂以及紧张,增强了狂欢的氛围。以手势为创意点,一是今年大部分用户都用手机购物,手的元素具有亲和力,二为手势作为倒计时数字的表现形式较为新颖,手势也有其他含义,比如竖起大拇指为点赞等。色彩上也与会场相呼应,看起来较为统一。

创意参考:

那些上亿人都在看的Banner都是怎么设计出来的?

当然还有很多创意及风格运用,这里就不一一讲解了,从这个思路,大概也可以看出一二,这次我们是做了充分的准备,一个创意库,让我们整个设计过程井然有序,且能在紧急突发的状况时,及时更换创意,保证较好的活动效果。

三、识别度及差异性

为何要增强识别度,差异性?

原因其实很简单,双11期间,各大电商平台几乎都做活动,用户又怎么能在茫茫图海中认出我们?抄袭,模仿更让用户视觉疲劳,怎么能脱颖而出呢?

案例:

那些上亿人都在看的Banner都是怎么设计出来的?

在大促这个时间紧迫又设计资源缺乏的时期,很容易让人感到疲软,设计大同小异,没有太多的特色与区别,所以,打破这种局面,是接下来的重点。

在茫茫图海里,能够让人眼前一亮是我们追求的效果,与其他平台设计形成差异,也是我们的使命。其实在设计之前,我们就希望这次的设计能够区别于以 往,有特色,有记忆点。那怎样才能让用户认准我们的双11?你猜得没错,那就是我们品牌的核心元素-猫头!!为了让用户能够强烈感受到品牌,我们就要重复 重复再重复的强调!就像脑白金的广告,一日三次,定能给人留下深刻印象,重复的感觉着实也是魔性的!对,是魔性的步伐!

解析魔性关键词:

那些上亿人都在看的Banner都是怎么设计出来的?

从这些关键词中,也可以寻找出一些设计元素及方向了!再结合品牌核心元素猫头,一张与众不同的banner就此诞生了。

案例:

那些上亿人都在看的Banner都是怎么设计出来的?

这次双11大促的设计,有几个点,是与以往不同的,空间感,刻画猫型元素,轻质感。

那些上亿人都在看的Banner都是怎么设计出来的?

字体上我们运用了投影,营造空间感,使其看起来有层次,猫型的元素也显而易见,在商品的处理上,没有运用厚重的投影,而是运用了商品本身的质感,未加太多的特效,质感轻薄,看起来清新脱俗!

重复的连续纹样,让人产生晕眩的效果,抓人眼球,同时也使品牌元素更加突出,并且在色彩上也使用了较为鲜亮的颜色,增强了视觉效果。新的尝试当之无愧成为了点击之王,模版中的战斗机。从数据上看,此套BANNER成为当日焦1中点击最高的,确实提升了活动效果!

那些上亿人都在看的Banner都是怎么设计出来的?

从空间感,图形元素,及背景这几方面,做了形式上的创新,并且识别性极高,让人难以模仿,又能很快抓住用户眼球,是一次很不错的尝试!

四、规范

在大促期间,资源位数量多如牛毛,如此大工作量,光凭几个人的力量是完不成,借助外部力量是必然的,那如何让沟通更高效,成本更低,这是我们需要思考的。

还有类目运营需要推广活动会场,日日都有焦点,设计素材的审核工作量也不小!面对这些问题,我们确实思考了一番,日常的规范是必然要做的,标注清 楚,减少沟通成本,其次是,产出的模版,如何让外部设计师易于延展?经过思考,我们在字体上没有去做不必要的变形,这并非偷懒,而是正真考虑到模版的实用 性及延展。

当然,字体是非常重要的,不做任何设计,也不合适,所以我们使用了轻质感,增加一些空间感,这样既便于延展及修改,又有设计感,一举两得。

那些上亿人都在看的Banner都是怎么设计出来的?

五、总结

本次负责资源位的经历,让我对品牌有了更深的了解,如何体系化的设计及如何在品牌的基础上创新。从节奏的把控,适应主题的变化,设计创意探讨风格制 定,如何配合双11其他相关设计,保持设计的统一性。以及规范制定的重要性等,什么才是优质模版,如何提升工作效率及提升活动效果,都积累了不少经验。希 望能給大家一些启发。

最后一起来回顾一下双11期间的banner:

那些上亿人都在看的Banner都是怎么设计出来的? 那些上亿人都在看的Banner都是怎么设计出来的? 那些上亿人都在看的Banner都是怎么设计出来的? 那些上亿人都在看的Banner都是怎么设计出来的?

原文来自:优设

作者:MIX无线设计

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/30978/

(0)
CatherineCatherine
上一篇 2017-05-30 21:34
下一篇 2017-05-30 23:37

相关推荐

  • iOS和Android规范解析——确认弹框、全屏弹框和模态视图

    今天介绍三个控件,前两个是Material Design(简称MD,下同)规范中的确认弹框(Confirmation Dialog)和全屏弹框(Full-screen Dialog),后一个是iOS规范中的模态视图(Modal View)。下面先说MD中的两个。

    2017-05-01
  • 动态响应-应用程序的身体语言设计

    引言:如果把APP比作一位美女,那么icon是她的证件照,界面是她的形体,而动效则是她的肢体语言。

    2014-12-30
  • 阿里干货!如何使用通用研究思维做用户研究?

    在开始讲述之前,先提两个业内用研人士经常会被问到的问题,①为什么要做用研?②用研能为业务做些什么呢?为了回答这两个问题,我将自己从事分析行业多年的战略规划法、业务分析法、用户研究方法等贯通起来,形成了以下的一些方式方法,即通用思维在用户研究中的应用。方法无边界,融会贯通将使方法更加行之有效,希望以下内容能给大家一些启发和思考。

    2017-05-29
  • 饿了么 UED 又搞事情啦!

    近日,据保洁阿姨匿名举报,在上海饿了么总部的榴莲酥会议室内,有人在工作时间聚众搞事情……据说场面隆重,气氛活跃,不堪入目。本台记者 @孟小雨 迅速赶往了现场。-----据调查,这次始作俑者是作为宇宙霹雳无敌超级吃货公司饿了么中最有逼格+设计感的团队—— UED 部门。在这个辞旧迎新、恭喜发财、还不放假的时刻,该部门秘密召开了第一届 UED 年度颁奖典礼!记者被大会的美食吸引,潜入该组织内部,随即被惊呆了。说到颁奖会,你以为是这样的?领导...

    2018-02-25
  • UED新刊 | 马岩松:梦露十年

    UED105期《MAD国际实践专辑》现已开始预售更有30本马岩松亲笔签名版,只限预售!具体购买详见文末互动福利PART 1新刊导读尽管频频有人发问,中国建筑为何迟迟未能冲出亚洲、走向世界,然而这是个太过深广的课题,涉及文化、经济、 政治、意识形态等等诸多方面,并不是三言两语甚至是一期杂志就能说清楚的。在这样的大背景下,马岩松和他的MAD 建筑事务所在国际上的实践探索,便分外独树一帜、另人瞩目。2004年,马岩松在纽约创办MAD建筑事务所...

    2018-02-07
  • AXURE免费元件库分享-web

    分享个WEB端axure元件库下面是元件库地址:https://pan.baidu.com/s/1pLXHuf5

    2018-03-05
  • Axure学习笔记 | 初识Axure

    本文结构:辰安笔记—01—说点题外话唠叨之语:这个是我在B站上看学习视频自己整理的笔记。话说我的学习笔记基本上是从视频上扒下来,然后加入一些自己的思考。我在规划做分享Axure的时候也想过,网上资源那么多,我做这个有必要吗?有用吗?思考一番,做这件事情虽然艰苦,费力不讨好,但是有收益。我现在就是把自己当作一个产品来打造。通过这些事情有以下收益:1.对自己来说,知识更加系统,当然也可能会让我更加僵化,这个我会注意;2.对招聘者来说,TA可...

    2018-04-29
  • 互联网理财平台交互设计再设计

    一、项目背景互联网理财平台,支付渠道升级,由原来的新浪托管换成富友、宝付支付。这就意味着平台需要对账户资产页面及交易流程进行重新设计。用户在购买理财产品时,只能通过平台的账户余额进行购买。如果账户余…

    2017-08-01
  • UED专访 | 张永和、王昀:寻找未来城市共生的答案

    📌编辑、剪辑| P.S📌采访| YHz2017年10月16日,全球天文学界联合发布一项新的重大发现,在1.3亿光年外,双中子星合并产生的引力波带着他的伴侣首次造访地球,这次长途跋涉的旅行为人类探索宇宙打开了新的大门。从爱因斯坦预言引力波到如今的发现,百年间,人类在探索未知空间的同时,也不断改造着我们的生存家园。着眼当下,我们对未来城市有何新的畅想?下文中有张永和、王昀专访视频不要错过!!!未来城市探讨在UED之前的采访中,厦门大学建筑与...

    2018-02-08
  • 为什么职场上的印度人总比中国人混得好?

    目前为止我还未有机会到过印度。身边去过的人有大致两边倒的两种观点,一种是这是一个思想自由的国度,人们开心知足、与世无争。一种是这是一个脏乱差效率低下的地方,一条公路几十年也修不整齐。我无从判断,因为每一种观点都主观。有一位曾经生活在帝都的印度女记者倒是写过一本比较中印差异的书叫《烟与镜》,值得一读。因为工作和学习的关系,我与很多印度人一起共事或者正在共事,有的只能算是点头之交,有的成为了挚友。1先说一件趣事,多年前,我没有与印度人近距离...

    2018-03-16