超实用!3个方法教你设计顶尖电商Banner - 优设网 - UISDC

超实用!3个方法教你设计顶尖电商Banner

2015/06/14 46929评论区

e-commerce-banner-design-method-1

编者按:Banner的重要性无需赘言,今天这篇文章从走心的文案、不同的构图方法和如何字体选择3个方面,聊聊如何迅速提升Banner的质量 >>>

当用户访问电商网站的时候,第一屏的信息展示是非常重要的,很大程度上影响了用户是否决定停留,然而光靠文字大面积的堆积,很难直观而迅速的告诉用户来到这里会得到什么有用的信息,因此网页Banner设计在这里起到了至关重要的展示作用,特别是对于首页Banner,有效的信息传达可以快速提高页面转化率。那么竹子来教你如何设计一个好的电商Banner。

作者:风尾竹,公众账号:liaosheji2010。

本文为作者授权优设发布,未经作者本人授权请勿转载,谢谢 :)

一、走心的文案

好的标题能够吸引你的注意,而糟糕的标题,让人看都不想看,扫一眼便略过去了。所以做好Banner第一件事情,就是需要设计走心的文案。所谓走心,就是触动你的心灵,或者说让你感兴趣,激发你的点击欲望。

1ys20150614

我们时常会看见这样的广告:文案内容直接罗列了公司经营产品或业务,抑或是像说明书一样详尽介绍产品或服务的主要功能。从广告主的角度来看这是合理的,用户需要知道我们产品有这些特点,这样我的的产品和服务才能被记住。但事实往往是:这些平淡无趣的广告,除了广告主自己以外,很难有用户真的愿意关注它。

那我们来分析下写文案人的心理:B点明确想让用户买我的记录仪。那么A点是用户想买记录仪不知道哪家好,我的记录仪有这么多功能,那么用户一定需要这个记录仪。

2ys20150614

但用户真正的A点可能并不是“想买记录仪,不知道哪家记录仪比较好”,而是我为什么需要行车记录仪?所以对于这样的用户A点,可能更合适的文案思路是告诉用户:

3ys20150614

当然用户绝对不会因为你写了几句话,就买下产品,还会考虑价格品质等等因素。不过我们这个Banner的使命就是吸引用户点击,提高页面转化率。用户感兴趣点了,你就成功了。

一篇帮你快速学会写文案的经典好文:《年度最佳教程!7招教你写出互联网顶尖文案!》

二、均衡的构图

构图其实说白了就是经营画面,进行布局,如何在你构图的引导下吸引用户点击,产生欲望,了解内容,如果都能达到,那说明你的构图成功了。

4ys20150614

第一眼睛看到这个banner这个图完全抓不到重点啊,满眼的小文字,另外加上两个傲娇的大叔。完全不知道想表达什么。等等,下面四个小方块是什么鬼?构图感觉实在糟糕。那么下面来说下banner的构图,构图规则分以下几种:

1、左右式构图

最常见的构图方式,分别把主题元素和主标题左右摆放。

5ys20150614

2、居中辐射式构图

标题文字居中,分别把主题元素环绕在文字周围,用在着重强调标题的环境。

6ys20150614

3、三角形构图

倒三角构图,标题突出,构图自然稳定,空间感强。

7ys20150614

4、斜线构图

产品所占比重相对平衡,构图动感活泼稳定,运动感空间感强。此类构图适合科技、汽车、潮流题材,不过好像电商一般不卖汽车?

8ys20150614

三、合适的字体

9ys20150614

看到这个banner竹子总感觉好像那里不对,女性的特点是细致优雅,为什么字体如此粗壮了?和女性化妆品的气氛完成不符啊。每个字体好像人一样,都有自己的性格与气质。选择使用一款字体的时候,除了考虑它的易读性,更多考虑的是这款字体能否准确地传达出对产品独有的气质。下面竹子告诉你应该如何选择字体。

男性气质:方正粗谭黑、站酷高端黑、造字工房版黑、蒙纳超刚黑

黑体给人感觉粗壮紧凑,颇有力量感,可塑性很强。适用于各种大促类的电商广告。

10ys20150614

文艺气质:方正大小标宋、方正静蕾体、方正清刻本悦宋、康熙字典体

宋体的衍生有很多,又长有扁,有胖有瘦。旅游类电商网站经常会用到此类字体。运用宋体进行排版处理,既显得清新又文艺。

12ys20150614

11ys20150614

女性气质:方正兰亭超细黑、汉仪秀英体

字如其人,女性的特点是细致优雅、苗条细长;常被用作化妆品、女性杂志、艺术等女性主题领域。

文化气质:王羲之书法字体、颜真卿颜体

书法字体具有很强的设计感与艺术表现力,运用好的话往往是点睛之笔。各式各样的书法字体有着自己独特的细腻的特点,把握好这一点,既能增加文化内涵,也能衬托出产品的气质。

13ys20150614

超全的字体性格分析:《字体教程还能这么玩!聊聊文字的性取向》

四、未完待续

fwzqr

【字体设计经验三部曲】

Step 1:先从基础的字体结构学起!
《字体科普文!手把手带你认识最基础的字体结构》

Step 2:再了解字体设计的方法大全!
《推荐:17种设计字体的创意方法》

Step 3:实战经验帮你全面掌握!
《经验分享:超详细的字体设计方法+案例分析》

作者:凤尾竹
原文地址:weixin

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

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量96万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

sdcweixin

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/e-commerce-banner-design-method

发表评论 加载中....

评论加载中....

uisdc

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

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

您还没有登录

优设启用更安全省心的 微信扫码登录

微信扫码

300万设计师聚集地!优设网是极具人气的设计师平台
2012年成立至今,一直专注于设计师的学习成长交流

把好文章收藏到微信

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