用写文章的思路设计banner

工作中接触了一些banner设计的工作,借着本次整理思路的机会顺便和大家分享下,不周之处欢迎沟通指正。


工作中接触了一些banner设计的工作,借着本次整理思路的机会顺便和大家分享下,不周之处欢迎沟通指正。

用写文章的思路设计banner

从场景上来说,pc-室内-长时间-相对沉溺,移动端-随时随地-随时可能离开-碎片化。在设计banner的时候使用场景也是必须要考虑的因素之一,本文主要就移动端的场景浅谈笔者的一些个人见解。 相信每一篇文章的命题都有一定的时代意义,做banner也是一样,拥有自己的使命,下面先了解下:

一、为什么要设计banner

用写文章的思路设计banner

不以转化为目的的banenr都是耍流氓。

粗俗点概括上图就是:一看二点三买。 正常来说就是通过真实有效的信息传达来吸引用户点击购买继而不断的实现商业价值。

1、信息传达

其实就是告诉别人你是干什么的。对于电商来说就是告诉受众是卖什么的。要求信息正确、真实有效(新法规)、传达视觉的路线清晰明了。

快— 一瞥即见

强调第一眼,鲜明的视觉中心。如果一眼望去都没能明白这个图片在诉说什么,很多情况下受众就会转身离开。 想要一眼有所得,就需要有清晰的视觉层次,换个角度说你希望受众第一眼看什么,接下来看什么,然后是什么……一般来说用户在一个画面的停留也就几秒钟,所以建议内容不要太多不然很难抓到重点而错失良机。 左图引导线路:一元吃火锅-火锅图案-送流量-看起来不错,进去看下~ 右图引导线路:2013-双肩包-花-99元-这到底在说什么呢?再见吧~

用写文章的思路设计banner

左图引导线路:一元吃火锅-火锅图案-送流量-看起来不错,进去看下~

右图引导线路:2013-双肩包-花-99元-这到底在说什么呢?再见吧~

2、吸引点击

首先漂亮的图片不一定就是好banner。就像是好看的界面不一定是好产品一样(不能跑题)。 什么样的banner才能引得用户去点呢?

准—一针见血

了解用户群,迎合他们的期待,摸清楚他们的兴趣点。 越来越多的人选择在互联网上购物多半是足不出户,还可以得到更多的优惠或者服务。那就放出优惠和服务,喊出口号来。

狠-刀刀见血

戳中痛点的文案。 如果上面是喊出了口号,这里就是要口号响亮!如果打的就是低价、折扣、满减、服务,请让他们够醒目,一瞥既见!

用写文章的思路设计banner

另一种事件营销类,组织、策划利用新闻热点、人物、事件,吸引媒体或者消费者的注意和兴趣,以提升企业名誉、服务、销售的方式。(如下图)

用写文章的思路设计banner

其实在写作中,我们通过中心思想告诉读者道理和内涵那么banner就是通过视觉告诉受众卖什么和怎么卖!

3、商业价值

互联网有句老话,只要你能实现用户价值,就一定能带来商业价值! 话题大,内容多, 以后专项论述。

二、怎么样设计banner

1、中心思想

一般来说拿到一个需求建议不要立即就做,你需要分析项目的目标受众,客户的年龄,性别,收入,职业,位置和生活方式。 了解你的受众是确保你传达正确信息的关键。然后就是想怎么样才能突出想表达的主题,这就需要一个中心思想。既是我们想要表现的主题。

2、合适的风格

文章中为了表达中心思想会运用拟人、排比、对比等修饰手法,在设计中为了突出主题,也会运用一些视觉表现手法: 民族风-古典的、复古的的、文化底蕴的; 扁平风-活泼的、简单的; 写实风-场景再现,增加真实和代入感; 小清新-色彩清爽,气氛轻盈; 手绘风-个性,随意,趣味性; 舞台风-大促或者颁奖的镁光灯聚集感; 不管是写作还是设计banner目的其实都是一样,都是为了更好的烘托主题,表达出想要的气氛、抒发的情感。

3、合理的构图

设定好风格之后,开始考虑画面的结构,这个多数会根据使用场景的宽比决定,越来越多的电商首页轮播位是比较扁的,所以在布局这类图片时不建议太复杂,文案尽量醒目。 下面是最常用的三种结构:左右,左中右、居中。

用写文章的思路设计banner
4、字体的性格

字体性格的把握就像我们文章中人物性格的塑造。鲜明的性格反应笔者不同的立场观点。 我们可以通过提问的方式找到答案:什么样的字体适合这个主题?字体变形是为了表达什么?变形后好识别吗?受众看到这种字体会想到什么?字体大小是否合适?…… 由于使用场景和阅读习惯,要求一级文案明显,卖点加强。

5、背景素材的呼应搭建

不要为了装饰而装饰,所有的装饰都要有意义! 素材是为了衬托主题,增加联系,丰富血肉。 文章中有动静结合的手法,设计中也有虚实相间的处理。 大家肯定会经常看到很多banner上有飘落的树叶、飞鸟、花瓣之类的有的没的小元素来增加画面的生气,作文中叫做动静结合。 细心的朋友还会发现有些景物的模糊处理。焦点是清晰的,周边是模糊的。这样就有了远近、虚实关系,作文中叫详细和粗略描写。 ……

6、最后的调整

从整体到局部,再由局部到整体。 常用的二个方法:

  1. 眼睛离开画面一会,再次回到画面的时候有没有一眼获取重要信息。
  2. 黑白模式下对比黑白灰关系。

三、设计的一般原则

  1. 以内容为主,装饰为辅,拱托的气氛与中心思想一致;
  2. 视觉风格统一;
  3. 视觉层次分明;
  4. 构图合理;

四、从web到app的移植

上面提到很多,这里再强调下,希望对新入手做移动端的童鞋有所帮助。 巴掌大的手机,占据冰上一角的banner,想想看确实容不下web端上的众多素材、特效、样式,必须做减法。少就是多,一样适用在这里。

层次清晰:前景文案+背景素材,色相分开。

用写文章的思路设计banner

文案2次提取:pc端由于空间较大,文案相对会多些,移植到app文案需要2次提取。

用写文章的思路设计banner

用写文章的思路设计banner

从pc的竖版式-app横版式-提取关键文案、突出卖点、优化图片 拒绝拥挤:很多童鞋做完了pc端会要求再做一份放到app,如果直接缩小尺寸放上去就会发现文案其实就是一团模糊的浆糊。

用写文章的思路设计banner

整体性:banner的整体性、色块化会加强app首页的模块感。另外一般的app顶端有状态栏和搜索区域,设计时要考虑减少这部分素材对视觉的干扰。位于搜索区域的背景色要与白色的字保持较大的反差。

用写文章的思路设计banner

五、一张图看懂本文

如果说文章的三要素是:人物+故事情节+时代背景 那么banne三要素就是:文字+色彩+场景素材 思路顺序总结:

用写文章的思路设计banner

以写文章的视角分析设计banner个人认为一是二者确有很多相同之处。文章通过文字,表达思想,设计通过视觉图像表达思想;再者那都是满满的回忆,不至于新手童鞋们读起来太过于陌生和畏惧。

 

作者:湖湖  途牛UED

本文由 @湖湖 原创发布于人人都是产品经理。未经许可,禁止转载。

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

(0)
CatherineCatherine
上一篇 2017-05-24 02:27
下一篇 2017-05-24 04:26

相关推荐

  • 我手机里的应用设计体验

    最近养成了一个习惯,看到手机应用的一些设计点,自己觉得好或者不好的时候就会截图下来,翻了一下手机已经存了一堆图片了,就干脆发出来吧。 应用更新通知弹窗 应用更新弹窗是几乎每个应用都会有的一个模块,但是…

    2016-06-27
  • 灯塔激光定位技术——多人大空间交互体验的最优选择

    ——映维网——国际影响力VR信息数据平台声明:本文系第三方稿件,非映维网官方稿件,望读者知悉。本文内容涉及任何法律问题均与映维网无关。禁止以“来源映维网(YiVian)”名义转载本文。空间定位是VR 市场中一个非常关键的技术,当今排名前列的VR硬件设备厂商(HTC/Vive和Oculus)分别采用了不同的空间定位方案Oculus 的 Constellation 系统红外摄像头定位HTC/Vive、大朋VR的 灯塔激光定位系统尽管这两种定...

    2018-01-30
  • 对话界面的现在与未来

    计算机与人类并不使用同一种语言。所以为了之间的交互成为可能,我们依赖于图形化的用户界面(GUIs)。但是GUIs同样有着天然的屏障:人们必须去学习如何使用他们。他们不得不去学习一个汉堡icon隐藏着一个菜单,这是一个button触发一个操作。但是随着技术的发展,语言识别和处理效率的提高改善,我们当前的交互方式正在变得更直观,简单而又高效-通过对话界面

    2016-07-20
  • UED研究如何应用到产品设计中

      腾讯有互联网产品经理的黄埔军校之称。前段时间看腾讯CDC出版的《在你身边,为你设计》,颇有启发。特别摘录书中的《商业价值与用户价值的平衡》中讲UED的部分,看看腾讯是如何让产品责任人和企业高层接受UE…

    2015-07-23
  • UCD,以用户为中心的设计

    前言:一直有在梳理自己的知识结构,也靠这些所谓经验做了几年行业培训,今年是从业的第十一年,我觉得差不多是时候把这些最初来自同行、互联网和书籍的知识再还给行业,我会把所有所得分章节逐渐整理发出,希望能对行业尽一份绵薄之力,同时也作为一种仪式,好让自己重新出发。任何项目都从一个idea开始,你走在路上,蹲在马桶上;吃着饭,看着电视,灵光一闪,觉得大致可以做一个什么东西来实现世界的爱与和平,这就是一个愿景的诞生;来源无法归纳,却是后面折腾的开始。
    然后就是“分析研究”,分析市场,分析技术,分析用户,一边分析一边验证愿景;顺利通过这个环节,得到的就是设计需求。需求的来源多元,组成亦是多元。需求得到,就要进行梳理,以确定下来;这就是“需求过滤”或者“需求定义”。
    接下来就是把需求转化成对应的功能和数据,这是产品的骨骼血肉,功能数据要满足需求。比如需求是解渴,对应的功能就能是可乐或者矿泉水,但不能是热干面。从这个环节起,产品从抽象变具体。
    功能数据有了,长什么样?我们要把它们设计出来。设计分成“概念设计”和“细节设计”两个阶段,设计又分为“交互设计”和“视觉设计”两条线,所以就有了“概念交互和视觉设计”及“细节交互和视觉设计”。
    设计过程中需要进行“测试验证”,验证的结果用来迭代设计,所以大家看到有个双箭头。设计好了,提交研发。在这个阶段,我们做“研发支持”,也就是传达设计需求给研发,并且做研发过程中针对突发情况进行及时的设计修改;比如某个提示的补漏之类的。
    最后是“设计验收”。一般来讲,刚研发出来的版本多少有些变形有些不符合设计需求,所以我们要验收。列出结果清单,打回去重新调整。调整到什么程度才可以,要看具体到项目周期和策略。举个例子:我们筛选好约好被试(测试用户),分配给他们分析产品和分析任务,比如对比京东和淘宝的支付流程,让他们回去好好体验一个礼拜,让用户熟悉产品以心里产生评价。然后回到我们实验室,再走一遍,这一遍是被观察。然后就是访谈,询问他们的各种维度的评价,比如对于收货地址选择方式的偏好,最后我们统计归纳。这就是让用户来帮我们分析。“其实你什么都没有做错,错在你太老了。我们最早看到Snapchat,外国13-18岁小孩在用,我们高管用了觉得好傻好无聊,看不到价值,只投了一点,后来涨得很快。这个公司我们副总去过,就是海边一个玻璃房,很小的公司,感觉一个石头就把他们击破了。当时只有2000万美金,我们没进去,现在远远超过我们想象,百亿美金。

    2017-05-31
  • 2018年04月07招聘岗位

    诚聘:通辽澳鼎医疗器械公司诚聘:工作人员要求:40岁到50岁之间的女性,能长期工作的,有爱心,有孝心,家庭没有负担的,高中以上文化程度,语言表达能力好待遇:中午有工作午餐,每个周日休息,节假日休息,基本工资1800元,满勤奖200元,年底奖金不少于12000元。联系人:闫经理。联系电话,15247572846,15374967717不能长期工作的勿扰!招聘服务员工资底薪2500加提成收银员2700元加提成招聘电话:8663888,157...

    2018-04-08
  • 聊一聊常见的登录交互方式

    现在市场上面的APP种类繁多,而登录注册的方式也有很多,下文就简单来分析一下各种登录的交互方式,谈谈自己对这些方式的见解。

    2017-05-26
  • 在交互设计中,极简设计的四种策略

    本文将介绍交互设计中的极简设计4策略,帮助产品经理或产品设计人员在进行产品设计时,可以打造一款真正为“用户”设计的产品。

    2017-05-01
  • 情绪板的制作方法:写给设计师的全方位使用指南

    在设计上图片比其他要素更容易让人理解,所以我们可以利用情绪板(英: Mood Board),来使设计工作更加流畅,缩短制作的时间、改善工作流程。

    2017-05-11
  • 在007里的用户体验是“爽”还是“不爽”

    有一天在微信上和007社群的班级一位同学聊天,一通天南海北的乱扯后,话题就回到007这个社群上了,因为这段时间我参与007社群的一些活动,对这个话题特别敏感,然而他却流露出对这个社群的很多不满意,我们之间的一段对话让我思考了很久很久。对了,这两天你看了你们小组的信息了吗?小组信息?刚看,不过我最近在考虑要不要直接退出007,感觉没意思,也啥时间整这些了。那你当初为啥参加007啊?没啥,就是觉得应该养成一个写作的习惯以及可以认识一些稍微志...

    2018-04-11