签到

07月18日
尚未签到

共有回帖数 0 个

    晚街听风

    等级：
    这是我专门为电商Banner图设计所写的一篇关于色彩的文章，文章包括6个部分，包括Banner的组成要素、Banner的作用、有哪些会影响到信息传达的因素、色彩起到的作用以及如何使用色彩等，案例丰富，深入浅出，强烈建议阅读。
    写在前面
    我们常常会说到做设计需要知道三大构成(色彩构成/平面构成/立体构成)，设计又可以分很多个类别，比如网页设计/UI设计/电商设计/室内设计/工业设计等等，那对于电商设计有没有专门的三大构成呢?至今好像没有看到，所以我想尝试着梳理一下我脑袋里的知识点，专门讲解一下三大构成在电商设计中的运用，而今天我先从色彩在电商设计中的运用开始说起。
    内容比较多，所以我先给大家列一个大纲：
    一、先了解普遍意义上的色彩是指什么?
    二、再回顾一下Banner的组成要素有哪些?
    三、Banner的作用是什么?
    四、在Banner设计中影响到信息传达的有哪些因素呢?
    五、色彩在Banner设计中所起到的作用
    六、如何在Banner设计中使用色彩
    列完大纲后，接下来我们进入正题，一个一个知识点去剖析：
    一、先了解普遍意义上的色彩是指什么？
    (我讲这些理论的时候大家别睡着了，答应我，因为后面会越来越精彩～～)
    简单点来说，色彩即颜色，颜色可以分成有彩色和五彩色两大类，看有彩色主要看色相/纯度/明度三个方面的属性，无彩色也就是白色/黑色/各种深浅不同的灰色，也可以说无彩色是饱和度为零色彩。
    色相，即可以明确表示颜色色别的名称，比如红橙黄绿蓝靛紫：












    三、Banner的作用作用是什么？
    宣传/展示/广而告之/准确传达信息
    四、那么在Banner设计中影响到信息传达的有哪些因素呢？
    1/整体画面的气质是否对路
    2/信息之间的层级关系是否准确
    3/是否考量了Banner所投放的环境
    接下来，我们针对上面3个因素一个一个来讲解：
    1／整体的画面气质是否对路
    这里指的画面气质就是指给人传递出一种什么样的感觉，比如说用户看了你这个Banner之后会感觉它很热闹/很素雅/很高冷/很年轻有活力/很潮/很压抑/很恐怖/很高贵等等这些感觉，那么下面我举几个例子：
    Banner举例：很热闹的画面气质(关键词：低价促销/周年庆/节假日促销等搞活动的性质)

























    注意事项：这种Banner气质的画面千万不要把画面堆得太满，一定要记得留白和搭配优雅纤细些的文字(有衬线或者无衬线字体均可)，或者比较有文化底蕴的毛笔字，千万不要用五大三粗的文字或者把画面塞得满满的，为什么要注意这个?你们想象一下丰腴肥臀的一些满身穿金戴银的暴发户风格就知道了，自行想象一下画面，我就不配图了(迷之微笑～)
    2/信息的层级关系
    我们知道一个Banner包含有好几个部分，文案/模特或商品/背景/点缀物，而最终他们组合成为一个Banner，其层级是存在主次之分的，可以分为下面几种情况：
    (一)以产品或模特为主角(主要突出产品或模特)
    (二)以活动标题为主角
    (三)以利益点为主角
    而背景和点缀物永远不可能是主角，他们只能是配角，同时在这里颜色不是一个独立的分析要素存在，它应该是伴随着平面的知识点来说，所以这里我也会顺带一点平面方面的知识点，举几个例子：
    (一)以产品或模特为主角(主要突出产品或模特 )，我们有三个方向可以去发挥：
    (1)让商品(模特)的颜色与背景颜色绝对地区分开来，让它成为天空(画面)中最闪亮的一颗星～也就是我们说的色彩对比，色彩对比又包含三种：明度对比/饱和度对比/色相对比，假设下图中的圆就是商品或模特，举个例子：










    总结来说，但我们讲色彩的时候，其实也是在讲平面构成，当我们在讲色彩三要素(明度/纯度/色相)的其中一项的时候，其实也意味着在同时考虑其他要素，因为色彩不会单独存在，色彩要素也不会单独存在(我重复这么多遍，也是操碎了心呢～～)。
    3/是否考量了Banner所投放的环境
    当我们讲到环境的时候，往往会讲到外部环境和内部环境，也就是站在全局去考虑问题和站在自我的角度去考虑问题，如果你是要在某平台投放 Banner，那么这个平台对你来说就是大环境，具体到你投放的那一小块Banner位置就是小环境。
    (1)从平台设计师的角度出发，她肯定是希望你所有的Banner放在这个平台页面里，整体是融合的，不突兀的 ，比如下面的万件好礼免费送和专属活动这块的小Banner，用不同色相表示不同会场或主题，但是每一个色彩的明度饱和度是相似的，设计形式也一样都有自己的规范，这就给人整体统一协调的感觉：




    比如，上面这些商品图，我用距离观察法，第一眼就看到了左下角的这个巧克力了，为什么呢?因为周围的图片基本是白底或者比较明亮的颜色，而只有他使用了深色背景，明暗对比之后，一下子就出来了(你也可以举一反三去运用，get到了吗?)其实无论是商家/企业还是个人，都是需要考虑这种Banner投放的外部环境和内部环境的，除非你是在平台工作的设计师，很多时候我们更多的是需要站在个人利益的角度去考虑问题，我们需要让自己的图片更易被人发现。所以我们会看到，某8design的各种培训广告(我故意模糊了它们，因为不想打广告～)，永远都是花花绿绿，争相斗艳，但殊不知，当别人都花花绿绿的时候，你不用太花枝招展反而更易突出：


    所以我们会想到，设计师在发布自己的设计作品到设计论坛或网站的时候，不妨先去看下周围环境都是怎么样的，再去做自己的展示Banner图，这样有利于使自己的作品得到更多的展现机会，比如下面这个是我昨天在站酷首页截的图，大家是不是跟我一样第一眼就会看到的是那个玫红色的Banner图片?而其他的都只会匆匆带过，因为在这个环境里，玫红色是最突出的一种颜色(事实证明，除去dribble这个词比较知名以外，玫红色封面Banner图的阅读数确实也远超其他的作品，你们get到了嘛?)：
    总结回顾一下上面讲的几点：一、先了解普遍意义上的色彩是指什么?二、再回顾一下Banner的组成要素有哪些?三、Banner的作用作用是什么?四、在Banner设计中影响到信息传达的有哪些因素呢?五、色彩在Banner设计中所起到的作用六、如何在Banner设计中使用色彩以上我就写到这里了，我们需要知道色彩是一种情绪的表达，也许要学会举一反三(比如上面我只举了红色的例子，其他颜色可以以此类推无论)，另外无论是有彩色还是无彩色它们都不会独立存在，他必定是依附于其它表现形式而存在，比如与平面构成、立体构成结合运用，下期我们再继续谈电商Banner图设计之平面构成的奥秘(时间待定，哈哈～)(注：文中所有Banner 均来自花瓣，如果有Banner作者本人看到此文，请与我取得联系噢，感谢)能看完全文的小伙伴都是棒棒哒!～

    楼主 2016-07-27 10:25 回复

共有回帖数 0 个
  • 回 帖
  • 表情 图片 视频
  • 发表

登录直线网账号

Copyright © 2010~2015 直线网 版权所有,All Rights Reserved.沪ICP备10039589号 意见反馈 | 关于直线 | 版权声明 | 会员须知