不怕没灵感了！SALE 招牌的9种排版设计方法归纳（附案例）

即使是一块小小的SALE 招牌设计其实也有很多种玩法呢，今天@TTTing1 （ 京东用户体验设计部）这篇文章总结了9种常见的设计手法，每一个都附上优秀案例，看完也许对Banner 排版设计能有所启发哦。

小婷姐的电商系列好文：

1. 《新人手册！聊聊关于电商设计的那些事儿》
2. 《前辈经验！聊聊新人设计师最容易遇到的12个问题》

记得去年年底跟几个朋友一起去香港逛街，当时逛了一个商场的好几十家店，几乎每一家店里都挂着一个写着SLAE的牌子旨在吸引用户进店购物，我发现每一家SALE招牌的设计样式都不一样，而且每一个SALE招牌的设计风格跟店铺的装修风格以及店里卖的服饰风格都很搭调，所以也是挺感慨的，虽然只是很小的一块招牌，但是对比大陆的一些商场，设计感好太多，我没有拍照下来，但是我收集了一些其他的SALE招牌并以自己的理解概括总结了一下，大家可以一起看看，也许能对大家的Banner 设计排版有一些灵感启发。

1，圆形聚焦

其中的纸张撕裂效果其实也可以看做是圆形聚焦的一种形式。

2，商品组合成形

用商品或字母等元素堆砌出一种形状。

3、画框聚焦

将背景填充各种图案或者商品，形成一个画框，假想文案部分就是画作，那么视觉焦点自然而然聚焦于中间文案部分。

4、类画框聚焦

与画框聚焦的方法类似，不同的是利用了格式塔原理，即使画框不封闭，受众也能自然而然将它脑补成一个闭环，此种方式相较画框聚焦的方式更为灵活。

5、背景材质叠加

这种方式只需要找到合适的纹理或材质当做背景就好了，制作起来还算比较方便的，同时要保证文案内容的清晰识别性。

6、手绘或插画风格

其实算是上述方法的延伸，因为任何文字、图形都可以视为组成画面的一种元素，要是能做成gif动图就更有意思了。

7、以下几个也是上面几种方法的延伸或者与模特的结合运用，当我们将模特视为一种元素、一种纹理或者一种形状，就好理解了。

8、将SALE视作主角或骨架，并赋予它一种功能形式，模特商品等均可视为配角并与之搭配使用（配角依附于它，这种形式会比较好玩新颖）。

9、将SALE或文案部分视为主体并对它进行塑型（比较潇洒现代的毛笔字越来越受到设计师的青睐），我们知道假如要突出某一个主体，通常可以采用对比和烘托陪衬的手法，而这里就运用到了对比的手法，前景造型丰富则背景就简洁，反之亦然。

说了这么多，其实每一种方式都可以尝试去混搭组合，也许又会产生不一样的效果呢~ 另外这次收集的算是稍微时尚一点但又不算那么高冷的设计案例，所以还是可以满足目前仍然是追求热闹促销为主但又要求时尚的电商设计需要的，想看更多Banner 玩法可以看我前面写的几篇关于Banner 设计的文章。

以上就先介绍到这里了，觉得不错的话就收藏起来吧，以后总可能会用到的，另外可能有的人会说：“怎么都是英文的啊，不实用啊”，对此我只能回答：“设计无国界，大家就不要总歧视英文了啦~~”。哈哈哈哈

我们下次再见！~看完觉得不错的话就点赞支持下啦，么么哒！~（以上案例均来自花瓣，如有冒犯请私下约我么么哒~）

欢迎关注小婷姐的微信公众号「TTTink-D」，一个干货与文笔俱佳的美女设计师：

微信公众号简介：专注开拓电商设计思维，不定期分享一些个人见解干货，当然也会分享一些顶级创意、摄影、人生感悟方面的好文啦。

「技多不压身的设计师才有高薪资」

1. 平面设计：《超赞！设计师完全自学指南》
2. 交互设计：《交互设计师修炼指南！教你从零开始成为优秀交互设计师》
3. UI设计：《超实用新手指南！零基础如何自学UI设计？》
4. 前端开发：《天猫高手来教你！零基础如何系统地学习前端开发？》
5. 抠图技巧：《从菜鸟到高手！PHOTOSHOP抠图全方位攻略》
6. 配色方案：《色彩搭配速成！3个实用方法帮你全面搞定配色》
7. DPI指南：《基础知识学起来！为设计师量身打造的DPI指南》
8. 交互设计自学路径图：《零基础入门！给非科班生的自学路径图之交互设计篇》

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

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