赞助商
立即赞助

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平面设计3年前 (2021)更新 流光
2.5K 0 0

空间陈列法」先构建一空间,然后将主体元素用合的形式陈列出。

这是随着手机兴起而真正流行起来的一招,因为PC时代都是宽大的横屏设计,适合展现视野开阔的大场面,像大漠、海边等等,而「空间陈列」作为小场景,在PC端就显得大气,因此使较;而手机端却好相反,瘦长竖屏就适合表现长焦特写的小场景,像微距的鸟鱼虫等等,这时「空间陈列」就的恰到好处。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

如图示,同样的产展示图,在PC端就显得单薄,版面空缺,整体饱满;而在手机端则的好,确实这种长焦特写、微距放大的陈列小场景就是手机屏的最爱,在手机时代,空间陈列图才会呈现井喷式增长。

其合成、三和摄影以现「空间陈列」,但书还是以合成为主,而合成的难点就在何将产品和空间进行自融合,不能有违和感。

若想的衣无缝,第一步就是要做「透视准确」,而透视作为构图中的重要知识点,可以说是无不在,在前面的章节也多次提及。只有掌握透视的变化规律,才能准确表现出素的空间关系,如果透视不对,那空间将会失真,下面就来详细讲讲这个理性知识点——透视。

焦点透视

日常生活中,当周围事物,会有远近、高低、长短、宽窄等不同,这是由于距离、方位等差异在视觉中呈现的不同反映,这种现象就是透视。透视学的出现可以帮非常科学的表现各种空间和立体,它广泛用于绘画、建筑、环艺、计等诸多领域,而常见的透视共3类:空气透视、散点透视和焦点透视,这3类的侧重点各有不同。

空透视又称「色透视」,由于空介质存在(雨、雪、雾、烟等),使们看到近处景物比远处轮廓更晰、色更饱满视觉现象,例如下海报「烟雨蒙蒙」,这近实远虚感是典型空透视,随着镜头远,山川也变越来越模糊。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

散透视则是国画特有透视类型,例如下《明上河图》是这类透视代表作,在这五米长画卷,很难找出画家具体观察位,好似在移动作画,到处画部分,最后拼接起来,这视不断移动画法是散透视,散透视适合表现景色波澜壮阔,在写意,体现势和意境。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

而焦透视才是本文,它是透视学核心理论,也是西绘画所遵循透视原则,最早研究透视是从这里开始,如散透视是「写意」,那焦透视则「写实」,切都以客观原为准。

例如画《后的晚餐》,所视线都汇聚一点(称灭点),营造出一种立体空间感,这些就自己身处画面中央所看到的逼真景象。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

我们设中常的透视也都指「焦点透视」,这我们需掌握的重中之重。记得高中学习素描时,老师就画静「近远小」,其实就对焦点透视形象的描述,例如草的奶牛,离我们越近就越,越远则越小,这种近远小的透视变化使场景了空间层次。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

观察视角

在介绍焦透视前,我们先说说透视个很要影响素——观察视。视即指眼(称为视)在观察事物时视线所形成度。

如下图所示,其实就人眼观看角度的变化,常见3种:当我们平视方时就「平视视角」;仰看时则「仰视视角」;低看时便「俯视视角」。

中平视时人眼和物体形成的假想连线称为「水平视线」,这是判断视角低的参考线。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

当我们将产放入空间时,就要根据陈列形式择合适视角,从方的示意图中看到,种视角给人的感受都相同:

  • 平视种方方感,给人一种非常自然的观察感受,虽然中规中矩但视觉舒服;
  • 仰视则体现产的大和气势,来烘托值感;
  • 而俯视最接近我们常看桌面小物品的视角,很也很亲切,同时还凸显产品的立感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

图的仰视俯视都属于小视角,即产品视线水平视线的夹角较小,这设中的常见视角,概就把微微抬起或低下时看到的场景,这时画面自然也舒服。反之若视角过,即抬的很高或压的很低时,这时产品的形变就很夸张,显得刻意、不舒服。

说3种视角,现在正式讲解焦点透视,一般根据物体灭点的数量同,焦点透视又分3种:平行透视(一点透视)、成角透视(两点透视)和斜角透视(点透视),它们都有各自的透视效果和适范围,但若铺开讲会很复杂,因此面就结合「空间陈列」进行介绍。

1. 平行透视

立方体简单说明,就是有一面与画面平行,这时物体的厚边线若向延伸,最后都会汇聚到1个点上,因此又称「一点透视」。这是最简单最易掌握的一种透视形式,中汇聚点称为「灭点」,而灭点在的那条线则是「视平线」,即与人眼等的一条水平线。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

再来看看平行透视在生中的场景呈现,如图示,将各种景物进行前后连线并延伸,最后都是汇到一点才消失。平行透视适合表现场景纵深,给人一种正式感和平和感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

电商中的产展示一样,例如方示意图中,管哪种视角,产和立方体都是正对观众,人觉得摆放角正正好。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

总体来说平行透视只有1个灭点,变并多,视觉表现单一,没有太多的空间变,基本就是从正面来表现整个场景,因此上手简单,只要确保前后连线都汇聚一点即可,这样画面各元素会显得整齐。但有时这种正视会画面缺层次感,显得很平,此时可尝试俯视视角或者强背景的空间纵深。

下面展示平行透视在3种视角下的应用案例,注意观察不同视角下的产品呈现和透视变化,虽微妙,但每种视角确给人不一样的视感受。

平行平视

当画面为平行透视和平视视角时,时的观察位置很正。下图所示,空间和产品显得有平整,虽场的立感弱,但视舒服协,表现来也相对简单。注意平视的「视平」基位主元素的中心处,即是说人眼此时正对前方物的中心,样才有平视效果。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平行仰视

当画面为仰视时,一般视角都会太大,微微仰视即可,这样视觉才舒。如图示,实和平视起来,小角仰视的透视变并明显,没有夸张形变,但依然体现空间和产的大。此时「视平线」位于体中心靠的位置,这时人眼明显是从往上看。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平行俯视

如果觉得画面的层次感立体感不够,那就试下俯视视角,如下图所示,由于俯视时我们能同时看到体的顶面面,这样就能表体的厚度,立体感也明显增强。画面的「视平线」则于主体中靠的置,这时人眼就从往下看,但同样属于小角度俯视。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

2. 正俯视

平透视俯视有特殊情形——正俯视,即视为90°俯视,这时我们是从物体正上低头往下看,如下图所示,品平放桌时,正俯视能晰看到品全貌。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

在空陈列这是常见视,上手简单,展现晰。例如下案例,俯视下品摆放常灵活,根据构图需求可以工 ① 也可以随意 ② ,并品多以正展现为主,体观、舒服。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

以上都是品陈列案例,其实正俯视有时也会用于场景呈现,如下图所示,视位于场景正上,有类似俯瞰摄,这看似「刁钻」视能画带来独特戏剧效,令印象深刻。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

空间行透视

除了3种视角,这还要介绍一种行透视的常见形式——空间行透视,这种形式即画面的正前方有个类似方盒的纵深空间,而人物或产品就放置在空间。

如图所示,该形也有视3变化,为了确保视觉自然舒服,仰视和俯视也都是小度上下摆动,所以品透视变化并不明显,场景呈现也没有很夸张。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

为何要将该形单独列出?为它常适合手端竖屏构图。

手机不PC,无法通过宽屏表视野阔的场面,手机屏合焦特写的小场景,但这样时就会显得左右拥挤不透气,这时「空间平行透视」就刚好取补短,通过「深度」刻画将狭窄空间的纵深感体出,终使观者视线后维度了延伸舒展。

该形式正是利平行透视的纵深性,才最大程缓解了手机屏的拥挤感。面分视角列举案例,要注意管平视、仰视还是俯视,空间里的有元素最后都要汇聚一点,这样透视才合,纵深效果最好。

3. 空间平视

3种视角中,空间平视最见,因为这种方方正正的空间展示最适合手机的竖屏构图,看着最舒,上手简单,易于搭建。在平视,由于没有视角的低变,空间基本位于人眼的正前方,无任何偏移,摆放角非正,构图给人一种稳定感,元素没有夸张形变,组合方,真实自然。

对「空间平行透视」,「深度」刻画很关键,我们要根据版面构图选择合适的深浅。例下方案例中:① ② 的深度浅,空间相对封闭,适合展现小空间,给人温馨感和趣味;而 ③ 的深度深,空间开阔,适合展现大空间,样能让视更舒展,画面更透气。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

4. 空间仰视

在仰视,我们是抬头向上看,这时空间显得大,给人强烈的气势感。如图示,视平线贴地面,像是我们蹲着向上看,这种仰望视角,建筑和人物都很大,再上强烈的纵深感,虽然空间左右依然狭窄,但上和前后维却变的非开阔,画面通透。

空间仰视能渲染氛围,提升场的戏剧效果,突出视冲击力,但要注意仰视视角不能太大,否则夸的仰视效果反而给人一种压抑感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

5. 空间俯视

在俯视,视平线处于空间中心的上方,类似我们在处往看,如图示,这时空间显得立体,远的各类元素得到清晰展现,层次分明。

俯视适合展现空间的局观,也让各物有着富的积感。除非有特殊的构图需求,不和仰视一样,俯视视角不能大,否则俯视就变成俯瞰,产生遥远的距离感,空间也压缩的厉害,进而导致形变和失。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

成角透视

还是拿立方体举例,就是物体与画面形成一定夹角,这时物体的有边线分别向各自方向进行延伸,最后会在视平线上形成一左一右2个灭点,因此又称「两点透视」。这类透视最接我们日的观察角,即是说大分时候,我们看到的物体都属于成角透视。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

虽然成角透视只平行透视多了1个灭点,但2个灭点的位置却很灵,这样空间的透视变更丰富。

例下方是我们经常看到的象,虽是典型的成角透视,但 ① 是2个灭点在画面外,时建筑给人的感结构平稳,立感强,重写;而 ② 则是1个灭点在画面内,另1个在画面外,时空间右的透视形变大,产生纵深感,整个场更有力和冲击。

其实还有第3种情形是2个灭点都在画面内,但由于空间会产生夸张形变和失真,因此总体少见,不再举例说。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

再成角透视下的产品展示效果,如下图所示,不同于面展示为主的行透视,成角透视则以展示物体的面为主,这立体更,构图也更稳定。注在成角透视中,画面所有的竖向边线都是行,不会产生灭点。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

相比行透视,成角透视在表现上更复杂一些,一都以2灭点在画面外的情形为主,这透视最舒服。注要想画面只产生2个灭点,那当中的所有素都需排列整齐,这也是成角透视的常用做法,此画面会显得整齐统一。下面列举3种视角下的商案例,其中以仰视和俯视最为常见。

1. 成角平视

视下的成角透视相对少见,因为使用成角透视就是为了凸显物体的立体,但视由于视角正,恰恰就会显得立体较弱,这2种效果会有矛盾,响景的协调性。例如下方的2个案例中,产品着就有些整,和方形盒以及立方体稍显冲突,但整体视觉真实和,没有形变。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

2. 成角仰视

仰视下的成角透视就显得刚刚,下图所示,所有元素均用2个立面展示,加上透视形变,时空间的立感强,产品和立方也有明显的积感,视平稳、饱满,而且还能现产品形象的高大,凸显价值感。

注2个案例中,视线上都只有2个灭点,这是因为产品和立方体的排列都整齐,反之若无序排列,就会产生多个灭点,这画面会显凌乱,视觉不舒服,所以在表现成角透视,尽量确保所有素都能整齐排列。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

3. 成角俯视

在成角透视中,俯视视角最常见。因为该视角下的物以展现3个面,能进一步强化元素的立感和方位感,图所示,物的空间关系明显,次分明,构图也平稳。

一成角俯视适景陈列(若是大景则垂直方向会发生严重形变,这就是后面要讲的「斜角透视」),刚好这是机屏的擅长,空间配上角度俯视会给人一种亲切,类似长焦镜头的写画面,好的拉近了观者的心理距离,因此属于机端的常用构图。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

空间成角透视

成角透视的优势在画面立、稳定和写,优势刚适合空间的立呈现,下图所示,成角透视即用室内塑造 ① 也用外形搭建 ② ,类似我们站在空间面看整,此时空间立、饱满,结构有力。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

但由成角透视是在画面两端形成灭点,所以该透视下的空间更适合横构图,但手机屏却是竖构图,对横向拥挤的竖长屏,成角透视就有施展不开,左右狭窄,无法像横版样开阔的展现空间,也没有平行透视样看着规整,因此使用少。

斜角透视

物与画面存在一定夹角,并且在2点透视的基础上,加高度变化,样垂直方向的连向上或者向下汇聚,最终画面形成3个灭点,又称「三点透视」。相比成角透视,斜角透视其就是让没有集的竖有集,样垂直方向就有强烈的汇聚感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

斜角透视的形变夸,常用大型物的仰视或高处俯瞰,类似角拍摄。

如下图所示,该透视能表现出建筑或空间的宏大,并且越宏大透视就越烈。这画面的夸张构图会显得观者渺,给人一种压迫,也让景有着极冲击力,同带来了更加刺激的视觉受。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

其实只要观者在景中显得,这的画面就会产生斜角透视,例如当仰望高楼,相对高楼而言,渺的就会斜角透视。

如品展示采用透视时,会有强烈不真实感,为相品来说,我们并不渺小,所以日常是不会看到这样场景,这场景更像是「昆虫视」,如图所示,透视下,虽然画不真实,会有特戏剧效。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

另透视没有平视视,为平视物体竖边线依然平,不会在垂生第3个灭,此仍属于成透视。有在大度仰视或俯视大型物体时,才会看到透视。

这种形变强烈的夸张透视虽然活中相对少见,但电商中用的还真不少。还记得我们第2章讲创意方法时提过的「独特视角」吗?其中一方向就使用斜角透视。

这种透视可体现物体的巨大(仰视)或者场景的宏大(俯视),正是这样一种真实自然的视觉感受,反倒给人一种强烈的气势和冲击,画面极具张的构图往往脱颖而,并在第一时间抓人眼球,吸引注意,成角透视特别适合大促题的场景搭建和氛围营,面分视角举例。

斜角仰视

视物体显得大,而斜角仰视则物体显得「巨大」。如图示,2个案例中的产都十分「巨大」,通过这样一种「刁钻」视角和夸张手法渲染了产气势,使产显得分量十足,同时升了视觉冲击,整个场景都变的大气。中 ① 由于版面有限,有个灭点没有标示来。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

斜角俯视

当我们站一很高的方俯瞰周围,或者用无人机高空航拍,这时看到的景象就斜角俯视。如图所示,尽竖构图并不合展辽阔的场面,但斜角俯视的帮下,2案例依然体了场景的宏,视觉冲击强,这种居高临下感使人视野阔。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平透视

透视有特殊情形——平透视,是空或品与画平时,此时不管透视多强烈,画也有2个灭。

如图所示,当立方体的一面对视点时,侧面便从2主立面减了1,这时除了垂直方向的1灭点外,原本视平线的2也就了1,虽然只剩2灭点,但本质仍属于透视强烈的斜角透视。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

既然与画面平行,那平行透视何区别?

面看张空间对图,看到2者的形变差异还是相当大:左图为平行透视,像是我们在看一个小方盒,亲切、自然、真实;而右图则是平行斜角透视,更像是我们在仰望一个巨大空间的入口,充满戏剧性,并有压迫感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

实对于手机端,「平行斜角透视」才是斜角透视中的形式,因为它的摆放角很正,这种正面观察很适合手机端的竖屏构图,而且前后的纵深刻画缓解版面的左右拥挤,另外画面纵向的汇聚感还迅速吸引注意,给人一种巨大冲击和强烈氛围感,中仰视俯视更见。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平行斜角仰视

近几这类透视越越多见,因它既合竖构图,也能提升画面的形式感表力,非常利于促主题的氛围打造。

如图示,整个画面就像是我们在宏大场景的正中央仰望时看到的景象,各元素摆放很正,虽有压迫感,但空间和产都显得非大,张十足,户牢牢聚焦,同时产生了强烈冲击,更易在户脑海中形成记忆。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

平行斜角俯视

这类透视下我们会感觉自己拥高高的「帝视角」,元素摆同样很,视野辽阔,场景宏。但过的俯视视角会对场景行一压缩,再加俯瞰产的遥远距离感,这样就显得元素些「小气」,无法体仰视下的高,因此画面的刺激感那么强烈,总体相对少见。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

3. 小结

以上便是焦透视3类型,我们再来回顾下各自使用情形,如下图所示,这是张3透视转换示意图,都是仰视视,旁边小则是观察者大小示意:

  • 当立方体的一面正对观察者,就是「行透视」,这除了物体厚度的边线会聚1点,其余边线均无交集;
  • 而立体旋转个度,任何都不正观察者时,是「成透视」,这时边线会各自汇聚成2,竖边线则交;
  • 此时若将立方体变的巨,到需仰望,就「斜角透视」,这时2点基础,本无交集的竖向线将汇1新点。

希望过这张示意图能帮大家更好理解什么时候该用哪透视,小场景搭般以「平透视」和「成透视」为主,而恢弘大场景则以「透视」为主。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

然现实里透视远不会这么单,根据物体不摆放位以及不观测距离,很多时候画也会存在多透视,例如平透视和成透视经常组合出现。

电商设计也一样,例如下方案例中,整空间平行透视,里面的盒子则角透视,这时视平线会3灭点,其实若产品的摆再凌乱些,还会出多灭点,但这种无序组合会让空间塑造变的复杂,看也不规整,因此并不推荐。

但要注意管画面的透视多复杂,当中的视平线却只有1条,并且无论水平方向有多个灭点,最后都会落在视平线上。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

除了上3种透视外,实还有4点透视(超广角透视)、5点透视(鱼眼透视)等等,但都过于复杂,的很,这里就做展开。对于电商里的「空间陈列」,3种透视已够,它是我们塑空间的基础,如果一开始的透视错了,即配色、光影做的再彩那无。

总有人说透视难掌握,其只要我们在生活中观察、留意身边物的透视变化和规律,及时总结,种理还原就不难做到。当设计终归还是理与感的双重表达,所以透视虽要遵循,但切忌生搬硬套,视协即。

讲完了焦点透视,知道了空间塑造的基本则,下面就来说说都有哪些陈列景。

陈列场景

相对PC来说,机端受屏幕所限,陈列景其实没那复杂,核心是要先构建一个空间,然后让产品以适的视角及透视在空间呈现出来,而这个空间景则要和主题氛围、产品气质都高度匹配。

般来说,手端常用陈列场景有4类:盒子陈列、台陈列、自然陈列以及舞台陈列,选择哪类则要看哪个场景品烘托效最好。

1. 产品组合

在介绍个场景前,我先说说关于品组合2原则,为很多时候在空摆放品数量较多,这时它们组合形变尤其要,稍不注意会显画杂乱章,不够协调,而凌乱摆放也会降低品品质感,缺少吸引力。关于组合原则,核心有2:大小合理以及三构图。

大小合理

如将多个品摆起,则要确保它们相大小符合现实真实异,现实尺寸大品要相大些,而尺寸小品要相小,这样才会真实并经起敲。

些设师组合产品时,也不小的真实差异,版面后就很随意的或缩小,后出的组合不就小一样,不就比例失真,这些都会给用户一种强烈的不协调感不真实感。

面再看一组对图,明显大小一样的左图会有适感,缺层次;而大小合的右图则更有美感更舒。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

实大小合的最终目的是希望整体结构错落有致,就像右图一样,这种有有低的组合才体现韵律感和结构美。如果可择,那我们就择一些尺寸差异较大的产,尽量避免现大小差多的情况。

当果必须陈列大小一样的产品,也以通透视或者辅助元素来改善,例空间里的近大远小、立方加高能改变高度一样的情形。

三角构图

当我们选不同大小的产品,就要注意它们的组合形式,千万不能乱堆一气,不同的摆放形成不同结构,而每种结构又给人不同感受。我们在「图形分割」中讲「正三角」具有很强的稳定,因此当产品采用正三角构图时,让人得版面平稳、视舒服。

如图所示,所谓三角构图,其实就是将尺寸大的产品放中间,而尺寸的产品放边,这不但构图稳定,而且画面也有节奏和变化。可以说「三角构图」就是空间陈列最常用的构图方式,而本节展示的所有案例中,大部也都是三角构图。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

确了产品的组则,知道了如何陈列才舒服,下面就正式讲讲空间陈列的4类景。

2. 场景

盒子陈列

「盒子陈列」就是在盒子里面放产品,而盒子以礼盒为主,使用场和主题相对单一,基用送礼之意的题页。创意虽普通,但却不易出错,是种相对安的表现方式。当若能在盒里加小心思,画面也很出彩,像我之前看一个新年Banner,就是礼盒里装着一个大家庭在年夜饭的温馨场,样的新组合便让人眼前一亮。

另外若能提升礼盒刻画的致度,那画面也会有不错的计。而盒外形也不只有方形,常用的还有圆形和异形。观察视角则以角度俯视居多,因为这个视角最近日常礼盒的真实情形,盒内产品在俯视下能的一清二楚,展现也立体。

盒子陈列难在于盒内要摆放很多品时,如何能让品真实、自然呈现,这需要我们既注意摆放合理性,也能准确表现透视,要刻画出品明暗变化,有把握好品空感、立体感以及影感,画才会舒服协调。

方形盒常用的盒子类型,毕竟也活中常用的礼盒外形,结构感强且易表。如下图所示,礼盒都角透视,且左右灭点都画面之外,这样结构稳,立体感也强。注意盒里的产品呈,特别俯视视角下,产品越多越注意它们否协调统一,透视、光影细节一都不能少,把控不到就会显得凌乱,画面别扭。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

圆形盒比较少见,因立方体比起,圆柱体的透视那么强烈,结构感偏弱,但圆润的外形能使画面变的柔,给人一种亲力温馨感,如图所示,由于圆形盒明显块面,所以不透视还光影,刻画起都相对简单。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

异形盒指外形不规则形状的盒子,总体也很少见,但易出彩。形状用的好便能打破「盒子陈列」的常规感,使画面变的新颖创意。

例如方案例中,管是心形、猫头轮廓还是圣诞树,都成为画面焦点并引人注意。另外盒子呈现均了「正俯视」视角,实除了小角俯视外,这种视角很见,因为该视角的产陈列清晰整,盒子外形直观显示,最大程的展现了外形的特别之处。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

台面陈列

空间陈列的4类场景中,「台面陈列」用的多,用范围也广,可以电商中的部分主题产品都能使用,算一种真白搭的表方式。

「台面陈列」就是在空间里搭建一个「台面」,然后在上面放置相产。由于该手法还是放大特写的小场景为,元素形变太大,因此画面平行透视和成角透视,视角则很灵,跟着构图走,3种(平视、俯视、仰视)都有。「台面陈列」上手简单,场景多变,中的键元素——台面需要根据题、场景进行灵变,见有2类:桌面和几何体。

桌面很理,就是桌子顶部的陈列面,所有产品放置其上。由桌子是家里常见家具之一,因此桌面陈列往往能传递一种「家」的温暖和温馨。

可能有人觉得「面」形式有些一,其实远没那简,不要固化思维,要能灵活变化的式和装饰,例如方还是圆?木还是大理?光面还是铺布?这些都是可变量,再加上视角和周围环的变化,总之形式可以丰。

如图所示,桌陈列尤其适合各类美组合呈现,这时个场景贴近生活,颇有带入感。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

是将各几何形体作为陈列品台,几何体相抽象,表现场景更多元,此比具象「桌」更加常用。

如图所示,几何体一般都组合出,特别合多产品陈列,简约方,能烘托出产品的品质感。同时通过高高低低的小排列也能表出画面的结构以及层次感,总之一种 「手简单、易出效果」的表方式。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

常用几何体「立方体」「圆柱体」,它们合陈列,高度调节方便,使用灵活。

如图示,整体表现并复杂,就是将各种产放在几何体上。但作为画面的核心元素,这时几何体的形态、列、视角和透视就变的非重要,我们要根据创意需求和产气质择最合适的展现方式,而这些展现本身就有错的形式感。

几何陈列既能营造空间关系和简约气质,也能让用户聚焦产品身,因为它的外形简单,不抢产品,不像一复元素或场,虽视富但最却让产品淹没其中,样就末倒置。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

自然陈列

「自然陈列」需要先创建一个合适的自然环境,然后再将产合适方式融入中。相对他场景,自然环境显然复杂一些,呈现手法「合成」和「插画」为。因为产都是实物拍摄,为了格统一,自然环境会偏向写实格,这样2者结合才协调。

从下方案例能看到,「自陈列」常用季节感受或者产地溯源等主题,画面通「自场」营造出天健的绿氛围。而场中的元素繁,呈现复,就需要我们具备优的整合能力。

对于「然」塑造,视角以视和角度俯视居多,但画面由于没有多的何型物体,所以透视没那严谨,核心是注近、中、远景的层次,还有光的理添加。如果这些把控不位,就可能出现景杂乱、缺少层次、没有带入的粗糙画面,最终沦为各种素材的乱堆一气。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

以上列举的都是以花草树木为主的然环,确实绿色景在「然陈列」中用的也是最多,但除了绿色景外,有也会用其环。如下图所示,像海底 ① 、沙滩 ② 、海面 ③ 、冰山 ④ 也是适陈列的然景,别是夏季主题会经常用。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

舞台陈列

最一类「舞台陈列」常用大促主题的气氛营造,类场不挑类目,任何产品放在「舞台」上,灯光一打,彩斑斓,能营造出热闹的促销氛围。

如图所示,舞外形以圆形居多,因为圆形的透视较弱,构图灵活,而且也符大家对舞的第一印象。舞视角则灵活,3种均常见,核心是和产品视角保持一致。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

关于「舞」塑造,还有2需要注的地方:

舞台形除了最常用「圆形」,有半圆形、形和六边形等等;舞台造型也可以很丰富,并不局限于常规表演舞台,各造型都可尝试,例如上左四图是现代感十足三维舞台,我们要根据创意和风格塑造相匹配陈列舞台。

另外就灯光运用,可以这「舞台陈列」其他场景的区别,但灯光也不越多越好,太多反显得眼花缭乱,其实能渲染出绚烂气氛即可。光就影,灯光照射下,产品一准确的光影呼应,这样不会显得突兀。例如方案例中,仔细观察灯光下的产品呈,能看到产品表面都产了被灯光照射后的色彩、明暗变化,这些细节刻画让画面真实,融合自然。

3. 实战案例

本次案例会用胶原蛋白口服液作主体元素,然后用这4类场景(盒子、台面、自然、舞台)设4张不同视角、不同风格的Banner,让家看看不同场景下,如何将产品融入其中。先展示案例会用到的3种产品视角, 下方案例会根据不同的场景视角选择对应素。

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

如何做好Banner设计?先掌握这个高手都会的空间陈列法!

总结

「空间陈列法」的内容量挺大,主要成了「焦点透视」和「陈列景」2大部来介绍,其中焦点透视是立体「空间」的塑造基础;而陈列景则是产品「陈列」的体环。

常用场景有4类:盒子陈列、台陈列、自然陈列和舞台陈列,陈列都有各自适用主题和氛围:「盒子」常用于温馨送礼主题;「台」则能根据不主题灵活应变,属于百搭场景;而「自然」则适合季节或者溯主题,体现天然新感;最后「舞台」则用于氛围浓烈大促主题。不管哪场景,都要确保品和空视、透视相致,这样场景才会真实协调。另多品陈列时,要注意它们大小比例以及摆放结构,其三结构最常用。在手时代,「空陈列」是真正适合小屏竖构图表现。

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

文章主要讲述的是新手运营设计师在经验不足的情况下,如何快速上手主会场设计,以及通过流程的详细理解与归纳,巧妙避免由于...
主会场设计
近一年多接触到了插画 Banner 设计,算是自己边做边摸索,还在学习探索期,目前总结了一些做稿的思路,分享的目的是为了梳理...
banner教程
编者按:做一张Banner 需要掌握版式、字体、配色等等,那么庞大的知识体系,应该如何学习?本文从排版这个知识点入手,告诉你...
Banner设计
@做设计的面条 :天猫双11马上要来了,作为电商人的你此刻还好吗? 数英网独家首发了2018年天猫双11的一系列天猫双11海报,...
Banner设计
@做设计的面条 :新一期的《拍一张照片,就能设计成一幅海报》系列文章又来咯。每一期我都会分享 5 张我平时用手机随手拍的照...
做设计的面条
元旦过后,新的一波工作又要开始了,我在开始准备新一轮汇报材料的时候突然想到了一个问题,不知道铁子们在往年参加设计评审...
光影
重复图案在我们的大自然中可以说是很常见了,比如说蜜蜂的蜂巢、斑马的纹路再或者是蟒蛇的鳞片。多年以来,很多的设计师们也...
图案
随着电商的发展, 618、双11、母婴节、蝴蝶节,各种活动扑面而来。从事电商活动交互设计的这两年,我观察到很多活动都是「今...
产品思维