网页设计中质感的表现

  质感的表现:
  物体材质及表面所形成的视觉特征,如:材质坚硬或表面肌理的粗糙或细腻光洁度的高或低、透明感的强或弱、质地的松或紧乃至,材质的轻或重等等。质感与各种材质对光的吸收和反射性质有关,它是人们以往的触觉经验与视觉经验结合时透过视觉感官所反映的一种心理影响。在广告设计中,我们经常通过质感的刻画来让观众感受到你所要表现的主体及内涵、其有一定视觉经验的人,并不是单靠触觉来感知物体的重量、软硬、粗细、厚薄、干湿...等等。而是直接靠视觉去感受,因为你面前的不是实物,而是电脑屏幕:)。
  质感的展现除了表现物体的固有色以外,最有效的办法是表现物体的光感,把物体的光与透光的情况表现出来。归纳起来,我们大致将各种物体分为四大类:
  一,反光而不透光的物体。
  如金属、抛光花岗岩、大理石、陶瓷、不透明塑料、镜面、油漆涂饰的物体表面,这类物体一般质地紧密,都有较为光洁的表面、明暗过度比较柔和,但对比强烈。拿金属来说一下:多数金属物体,在加工以后具有强反光的质感特点,而且质地坚硬,表面洁度高,因此表面的明暗和光影反差极大,往往产生强烈的高光和阴影,同时,由于反光力强,对光源色和环境色极为敏感,在表现强反光的金属质感时,如不锈钢、镀铬等物体,应注意使用明暗对比的手法表现其光影闪烁的特点,同时应注意对明暗层次加以概括和归纳避免过花而产生零乱不整体的感觉。表现金属质感还应注意在处理其边缘时要清晰干净利落才能表现金属结实,坚硬的感觉,同时应根据物体表面的形体特点采用不同的明暗方向,表现不同的体面之间的起伏和转折关系。
  二,反光且透明的物体。
  如透明的玻璃、水、冰块、透明或半透明塑料等。透明的物体大都表面经磨砂工艺处理。反光性透明性较弱,高光强烈。比如:在水形成冰的过程中、其内部结构发生了变化,在受光线的照射时产生漫反射(别说你不知道漫反射哦),会在其表面上形成不规则形状的明暗区域产生光怪陆离的反射效果。水在静止时,清澈透明表面平整如镜,如果在波动或流动的情况下,将会产生波光粼粼像冰决那样反射效果。这些物体由于具有透明性、其色彩往往透射出它所遮挡的部份或背景的色彩,根据其透明度而定其反透出的背景或物体的颜色,如果透明物体本身有颜色的话,在表现其质感时则需要考虑到本身固有色和背景色之间的关系。
  三,不反光也不透明的物体。
  原石(未经加工过的石材称做原石)、木材、橡胶、密编纺织物等,在表现这类物体的质感上,注意力应集中在物体纹路,与质地的感觉上通过光线的运用刻画出物体的本质的魅力,石头有着坚硬的质地粗略的纹理,但根据石头种类的不同,其质地的软硬和纹理的细密也是不同的,我们可根据它的这些性质,运用在不同风格的设计中,表现不同的意境。原石的魅力在于它的天然、它的粗扩、在于它那满带沧桑的表皮下面蕴藏着的那种对历史的追溯、和伟大的成就感,经加工的木材表面平整光滑最明显的视觉特征是具有美观和自然的纹理,未经涂饰的木材基本上没有明显的反光,而表面经过涂饰的木材其表面具有一定的反光和高光,但其程度远比金属和透明物体弱,但柔和。(www.3lian.com)
  四,不反光而透光的物体
  如纱网,纱巾等一些网状编织物这些物体在设计中常用来遮挡光线对某中物体的直接照射,使光线柔和或在被射物表面映射其网状纹影,常用来烘托一些温馨,浪漫的气氛,要求我们在设计中要多分析其质感的视觉特征,结合设计要求提炼出一种简单有效的质感表现的方法或过程。
  

时间: 2024-10-18 11:51:37

网页设计中质感的表现的相关文章

大图片背景网页设计中文字设计重要性

文章描述:浅析文字在国际范网页中的重要性. 网页设计中最重要的元素是什么?你不知道?思考一下:你是如何将信息传递给用户的?你是如何展示产品的?现在你明白了吧,答案很简单,用文字将信息传递给用户,用图像展示产品.两者结合之后,表达能力呈几何级上升. 图像胜过文字 大多数人认为图像比文字易于理解,这已经不是什么秘密了.通过观看的形式,图像更容易表达情绪,也更容易让用户铭记.用户很可能因为页面中一幅动人的图像而记住你的网站. 在网上,你可能看过很多信息图.信息图的绘制规则很简单--人们更喜欢读图.很多

网页设计中的启示性,你看懂了吗?

  启示性(affordance)指的是某物体或者对象具有某种操作或功能上的暗示性.举例来说,一张高于你膝盖高度的椅子,它可以暗示你坐.牙刷的手柄略长于人类的手掌,它暗示可以用来握紧. 所有我们周围的客体都具有启示性:有些是外显的(如门手柄上写着的"推"字信息),有些是内隐的(如椅子可以用来打破玻璃或者用来当做武器).这个概念最初由心理学家詹姆斯·吉布森提出,随后被唐纳德·诺曼在<设计心理学>一书中引进到人机交互领域. 交互设计师经常运用启示性.他们必须这么做.物理客体基于

网页设计中的轮廓框

  网页设计中使用轮廓框元素的案例不多.但实际上,这些纤细的.整洁的轮廓框效果极佳.为了保证效率的最大化,轮廓框一般采用纯色线条,这样便能产生前景与背景的明显对照.黑和白,是最传统的配色,以其对比强烈,效果突出而著称.因此很多轮廓框采用了白色线条.除了颜色,线条的粗细也是一大考量,纤细的线条让人感觉精致细腻,粗厚的线条显得异常醒目. 下面,本文收集了一些网页设计中轮廓框应用的案例. Olivier Staub 此网页设计一反传统,对菜单采取了简化设计,蔚为壮观的全屏图像滚动.厚重的轮廓狂和粗字体

网页设计中最常见的30款英文字体

  关于英文字体,对我们网页设计师朋友们来说一定并不陌生,即使我们很少做英文语系的网站,但在浏览国外网站的时候,大家一定都会有或多或少的认识.其实不单单是在网页中,很多移动操作系统和浏览器中都广泛使用了今天我们即将介绍的这些字体. 想必大家也都能猜出来像 Arial.Helvetica 这种大名鼎鼎的字体肯定在里面了,那么还有什么呢?一起来详细了解一下吧! 首先,补充个小知识: 1.网页设计中的英文字体,一般有以下五类: serif(衬线) sans-serif(无衬线) monospace(等

网页制作高手进阶:网页设计中的文字运用

设计|网页|网页设计  如今,互联网越来越走近我们的生活,网上冲浪也渐渐成为我们生活不可缺少的一部分.网络世界五彩缤纷,涌现出大量优秀精美的网页.大量网络信息的呈现,无非就是通过文本.图像.Flash动画等,其中, 文本是网页中最为重要的设计元素.对于网页设计初学者而言,了解和掌握网页设计中的文字排版设计就显得尤为重要,下面笔者想谈谈一己之见.     文字的格式化     1.字号.字体.行距字号大小可以用不同的方式来计算,例如磅(Point)或像素(Pixel).因为以像素技术为基础单位打印

CSS网页设计中使用背景图片须注意路径问题

css|背景图片|设计|网页|网页设计|问题 网页设计技巧文章,CSS网页设计中使用背景图片须注意路径问题. 在传统的表格布局中,背景图片是直接应用于表格的,一般情况下CSS的background-image属性使用非常少,或者说根本就不使用.应用CSS网页布局,实现内容与表现.行为相分离,作为页面框架.装饰等图片我们就直接剥离到CSS文件中,通过CSS进行定义. 我们通常用link的方法直接引用一个CSS文件到HTML(或其它活动文档)文件中.我们会发现有时候我们的图片无法显示了.此时,请查看

谈谈网页设计中的卡式设计

  前言 "我要卡式的",这是上一期客户在和我聊需求的时候说的第一个需求点.毫无疑问,卡式不论是适应PC还是手机都表现优秀.从在线商城到社交媒体网站,卡式设计成为网页设计中的一股强大风潮且风头正劲.其中最重要的原因想必就是它的灵活性. 卡片,可以是任何形状.颜色和形式.但是总的来说,他们都包含了图片.图标和一些基本的文字信息,例如标题.用户名和位置信息. "然而,其风靡起来的核心还在于其简单性.你很少见到复杂的卡片设计,它之所以出现的目的就是为了引导用户去点击它"

让我们谈谈网页设计中的卡式设计

  前言 "我要卡式的",这是上一期客户在和我聊需求的时候说的第一个需求点.毫无疑问,卡式不论是适应PC还是手机都表现优秀.从在线商城到社交媒体网站,卡式设计成为网页设计中的一股强大风潮且风头正劲.其中最重要的原因想必就是它的灵活性. 卡片,可以是任何形状.颜色和形式.但是总的来说,他们都包含了图片.图标和一些基本的文字信息,例如标题.用户名和位置信息. "然而,其风靡起来的核心还在于其简单性.你很少见到复杂的卡片设计,它之所以出现的目的就是为了引导用户去点击它"

图层叠加混合模式在网页设计中的应用

很多读者常会询问我类似于上图中的按钮的光效是怎么做出来的?其实非常简单,新建图层,笔刷或椭圆画出白色,高斯模糊,再将图层混合模式更改为图层叠加就可以了.但是这篇文章里我们不讨论具体的技术,而来看看如同上面的按钮通过白色的叠加创建出按钮的高光,我们来了解一下图层叠加模式在网页设计中的应用,再通过不同的实例来深层次的了解图层叠加混合模式的基本效果,将其更自由的应用于我们的设计中. 案例一 图标设计中增加色彩的饱和度和明暗对比度 之所以会引出要讨论图层叠加混合模式的问题,是由于我个人按照网上的教程在做