广州总部电话:020-85564311
广州总部电话:020-85564311

广州网站建设-小程序商城开发-广州小程序开发-企业微信开发公司-网站建设高端品牌-优网科技

19年
互联网应用服务商
请输入搜索关键词
知识库 知识库

优网知识库

探索行业前沿,共享知识宝库

电商设计-光影在设计中的应用
发布日期:2025-01-21 09:47:23 浏览次数: 808 来源:小渔印象

构图、色彩和光影属于设计中非常重要的3个体系,如果说“构图”和“色彩”是视觉设计的基础,那光影便是“锦上添花”,当各种视觉元素组合完成后,只有“光影统一”,才能让所有元素真实的融在一起,最终形成真实立体、有层次的画面,而“光影统一”便是核心的原则。


影响物体明暗的4个光源因素:

1.1 照射方向

1.2 光源强度/距离

1.3 光源软硬

1.4 光源颜色

1.1  照射方向

光源的照射方向,主要会影响物体的“明暗配比”,随着方向不同,物体明暗也在发生微妙的变化,同时还会影响画面的情感表达,所以照射方向是首先就要确定的因素,一般方向有7种。

而在实际运用时,常用方向是4种:前侧光、侧光、侧逆光、逆光,这4种分成2组来讲。(其他方向由于使用较少,就不展开了)

前侧光/侧光

当光源的照射方向和视线方向成30°-60°夹角时称为前侧光;而当夹角成90°时则为侧光。如图所示,前侧光一般明多暗少;侧光则是明暗对半。

下面再看产品在前侧光及侧光下的光影呈现,主要区别在于明暗比例的变化,但变化很微妙,区分没有那么明显。

前侧光及侧光是电商设计中最常用的布光方式,这样不管人物还是产品,明暗比例都比较适中,既能保证物体的亮度,也能很好的凸显物体形态和质感,所以大量Banner的主体展示都会采用这种布光方式,下面看案例。

侧逆光/逆光

当光源的照射方向和视线方向成120°-150°夹角时称为侧逆光;而当夹角成180°时则为逆光。如图所示,侧逆光和前侧光刚好相反,物体是明少暗多;而逆光时的物体则几乎全是暗面。总体来说,不管侧逆光还是逆光,物体都以暗调为主。

再看看产品在侧逆光及逆光下的光影该如何处理,虽然产品看着有些灰暗,但场景却颇有氛围和调性。

这也是一组常见的布光方式,和前测光/侧光主要凸显物体的立体感不同,侧逆光及逆光主要是营造独特的场景氛围。


其中要特别注意物体背光面的暗调程度,根据需求提亮或压暗,但多数时候都不会调的太暗,还是会保留物体该有的一切细节,避免色调过深而丢失了暗部层次,如下图所示,元素的背光面依然都清晰可见。

逆光其实很有趣,当光照强烈、光质偏硬时,物体边缘就会出现一圈非常明显的高光,高光颜色和光源颜色一致,这就是“轮廓光”。光照强度越大、光质越硬,轮廓光就越明显。

轮廓光一直都是摄影师的最爱之一,如图所示,它能勾出人物轮廓,进而分离人物和背景,让影调富有变化,提升画面层次和细节。

在电商设计中也同样常见,例如下图中,仔细观察人物和产品的边缘,有些地方会有一层非常高亮的“轮廓光”,这处光影细节使画面更具形式感和设计感。

还有一种情形也颇有艺术感,如果物体完全背光,这时背景偏亮而物体正面又无光时,就会形成“剪影”效果。在摄影中这是一种很有趣的拍摄方式,如图所示,图中的人物剪影会给观众留下丰富的想象空间。

在电商设计中,剪影同样以表现人物或产品轮廓为主,突出整体造型,“剪影构图”会更强调画面的形式感传达。

1.2  光源强度/距离

光源强度和距离会影响物体明暗的反差大小,强度越弱或距离越远则物体明暗反差越小;而强度越强或距离越近则明暗反差越大。


原因很好理解,先说光源强度,当光源增强时,周围环境和物体的受光面会更亮,因此亮面和暗面的反差也会更大。还有距离同样如此,所有人造光源的光照都有衰减性,而光源强度随着距离拉近而升高,因而距离越近的光源,照射强度同样增强。

需要注意,还有一类光源是自然光,自然光比较特殊,如果在室外环境下,任何时候的光照(晴天、阴天等)都不会有衰减现象,因为作为光源的太阳太强,距离太远,衰减可忽略不计。


但若在室内,阴天从窗外射入的自然光则会有衰减性,因为这时的光线以散射光为主,而这类光照要弱的多,再加上窗外射到室内的辐射范围有限,所以衰减性便会显现出来,如下图所示。

光源强度和距离对产品的明暗影响也同样如此:左图设定的光源强度弱、距离远,因而产品的明暗反差小;而右图设定的光源强度强、距离近,因而明暗反差更大。

如果选择明暗弱反差,为避免画面灰暗,我们需要提升画面的曝光值,使整体明亮。

在实际运用时,明暗弱反差降低了明暗对比,人物或产品都没有很深的阴影,整体呈现清晰、柔和,同时也弱化了结构和立体感,如图所示。

而明暗强反差则让人物或产品的明暗对比强烈,阴影明显,质感凸显,更强调整体结构和立体感,如图所示。

1.3  光源软硬

喜欢摄影的朋友对这个词应该再熟悉不过,是指光的性质(简称“光质”)变化,分成硬光和软光。


一般直射光属于硬光,而散射光和漫射光则属软光。光源软硬会影响物体的明暗过渡,硬光的光照直接,会让物体的明暗过渡更为生硬,有明显的阴影轮廓,突出表面结构和质感;而软光的光照柔和,能让物体的明暗过渡更为自然,无明显的阴影轮廓,突出表面层次和细节。


另外在同等的光照强度下,由于软光的光线呈分散状,所以相比硬光,明暗反差也相对较小,如下图所示。

下面再展示产品在硬光和软光下的光影刻画,明显左图的影调更为硬朗。

在设计时,硬光常用来表现人物的强劲、硬朗和力量,常用于男性、运动、健身等类目,另外也能凸显产品的结构和造型,提升质感和立体感。

软光则侧重表现人物的柔美、清新和娇嫩,常用于少女、儿童等类目;而用于产品则会让其表面的层次细腻而丰富,更接近生活里的真实呈现。

1.4  光源颜色

最后是光的颜色(简称“光色”),光色变化会影响物体的表面颜色,由于人们对色彩的敏感度很高,所以众多因素中,光色带来的影响最为直观。


一般来说,不管物体的固有色如何变化,表面呈现的都是光线颜色,只是明暗程度会有不同。如图所示,当红光照在球体上,亮面会呈现红色;而绿光照射则会是绿色。

若产品被有色光照射时,受光面同样会出现对应的光色,这时画面会更生动,同时也提升了用户的视觉印象。

在日常设计中,使用有色光算是“戏剧化用光”的一种手法,如图所示,当画面出现光色变化和鲜明对比时,画面会更有冲击和氛围,也让场景带有强烈的情绪感。

以上便是影响物体明暗的4个光源因素:照射方向、光源强度/距离、光源软硬以及光源颜色。

 

想和你聊的,不止是设计

微信号:xyyinxiang

优网科技,优秀企业首选的互联网供应服务商

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!

优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。


我要投稿

姓名

文章链接

提交即表示你已阅读并同意《个人信息保护声明》

专属顾问 专属顾问
扫码咨询您的优网专属顾问!
专属顾问
马上咨询
扫一扫马上咨询
扫一扫马上咨询

扫一扫马上咨询