商业网页设计论文.docx

第 1 页 商业网页设计论文 特征码 tibobVpXvqlIpHodMJXN 摘要:商业网页设计中具体的字体、图形、图象、标志等等，常 常表现为点线面、色彩、动静、主次等视觉因素，这些因素的 不同使用都会影响读者的视觉习惯和心理变化。本文将分析商 业网页设计视觉因素的心理规律，揭示网页设计如何通过视觉 因素更有效、更合理的表现与传达信息。 关键词: 网页设计 视觉心理因素 构成要素 视觉流程 商业网站是企业向用户和网民提供产品和服务的一种方式, 是企业开展电子商务的基础设施和信息平台，其网页页面由具 体的文字（标题、广告语、单位名称、Email 地址等） 、企业标 志、商标、产品图形、和信息菜单等内容组成，这些内容又常 常表现为点线面、色彩、动静、主次等视觉因素，这些因素的 不同使用都会影响读者的视觉习惯和心理变化。 本文将试析商业网页设计视觉因素的心理规律，揭示商业 网页设计如何通过视觉心理因素更有效、更合理的表现与传达 第 2 页 信息。展现企业形象、介绍产品和服务、体现企业发展战略。 一、商业网页设计中点、线、面视觉心理因素的运用 点、线、面是商业网页设计基本的视觉元素，是表现视觉 形象的基本设计语言。从视觉角度看网页设计主要是如何经营 好三者的关系，因为不管是任何视觉形象或者版式构成，归结 到底，都可以归纳为点、线和面。 1.网页设计造型要素中的点 商业网页设计中的点是构成网页的最基本单位，是指页面 中具备点的视觉特点、体积较小的物象。相对于整体背景而言 一个单独的点是相比较而言的；是有大小、形状和体积的。点 的大小、形态、位置不同，所产生的视觉效果、心理作用也不 同。一个网页往往需要有数量不等，形状各异的点来构成，可 以是具体产品、商品标志等，也可以是感觉上的点。例如，天 空中的飞鸟、沙滩上的脚印、花瓣上的蜜蜂等，在其周围背景 衬托下，都给人以“点”的视觉心理感受。 点在设计中即可以起一种稳定造型的作用，亦可起到活泼 生动、吸引视觉中心的作用，使用得当，甚至可以画龙点睛； 点的形状、方向、大小、位置、聚集与发散，还能够给人带来 不同的心理感受。 (1)单点的应用：点在人们的视觉中具有很强的吸引作用， 如：点（商品）设计在网页的上方或左右位置，则给人不稳定 感和相对的动感。 第 3 页 (2)多点的应用：两点（二商品）之间会产生心理连线的感 觉，多点时则会出现不同排列，顺序的虚拟的面或形体。 2.网页设计造型要素中的线 点的延伸形成线。线在页面中的作用在于表示方向、位置、 长短、宽度、形状、质量和情绪。线是分割页面的主要元素之 一，是决定页面现象的基本要素。商业网页设计视觉因素中的 线主要指文字的行线，商品图形、图象的轮廊线，各种装饰线。 线的形态主要有直线和曲线两大类： (1)直线给人一种紧张、锐利、简洁、刚直感，从心理或生 理感觉来看具有男性特点。直线又有：细直线，给人纤细、敏 锐的心理感觉；粗直线，给人豪爽、拙朴、厚重的感觉；垂直 线，给人一种挺拔、庄严感；水平直线则给人方向感和强烈的 动感。 (2)曲线表现出一种动态，活泼，轻快的意味，显示了女性 美的特征，商业网页设计中运用文字行、图象轮廊线或装饰线 的造型，创造一种女性化的审美感。自由曲线是最好的情感抒 发手段。打破了水平线组成的庄严和单调，给商业网页增加了 丰富、流畅、活泼的气氛。水平线和自由曲线的组合运用，形 成新颖的形式和不同情感的对比。 3.网页设计造型要素中的面 线的推移形成面。面是无数点和线的组合。面具有一定的 面积和质量，占据空间的位置更多，因而相比点和线来说视觉 第 4 页 冲击力更大更强烈。面在网页设计中通常指各种图形、色块的 形状设计，不同形状的面具有自己鲜明的个性和情感特征，能 给人不同的心理感受，如方形的面具有沉着，稳重，厚实，坚 强的男性特征；三角形、梯形面常给人一种稳定、端正之感； 但如果将它们倒过来设计，则给人一种轻、不稳定的感觉。圆 形充实、圆满、活泼的感觉，比较适合表现儿童产品或者女性 用品。菱形或不规则形体则给人一种活泼、轻快之感。 在商业网页的视觉构成中，点、线、面既是最基本的造型 元素，又是最重要的表现手段。在确定商业网页主体形象的位 置、动态时，点线面将是需要最先考虑的因素。必须熟练掌握 设计语言。要善于根据商业特性采用不同的组合去体现不同的 情感诉求，达到推销、销售商品和服务的作用。只有合理的安 排好点线面的互相关系，才能设计出具有最佳视觉效果的页面， 充分的表达出商业网页最终的诉求！ 二、商业网页设计中色 彩视觉心理因素的运用 商业网页设计中色彩是确立网站风格的灵魂。色彩能产生 强烈的视觉效果，使页面更加生动。色彩设计的好坏直接影响 阅读者的观赏兴趣与心理变化。因此，地位十分重要。商业网 页的色彩设计应从以下几个方面把握和利用其心理特征： 首先，整个页面要确定一个主色调，其有利于体现网站主 题。每一种色彩都具有它自身的性格，如：彩度高，明度高的 色彩常给人一种华丽感，相反彩度低，低明度的色彩则给人一 第 5 页 种朴实感。暖色系、高明度的色彩能给人一种面积大的前进感。 冷色系、低明度的色彩则能给人一种面积小的后退感。每个人 群对色彩的喜好也有所不同，如男性较喜欢冷色，女性则偏好 暖色或高明度、高彩度的色彩，儿童喜好纯色，讨厌浊色，老 人则偏好浊色，中年人或文化层次较高的人偏好冷灰色等。因 此在设计中要考虑主要读者群的背景和构成以及如何与商品的 属性相呼应。 其次，在主色调下的色调搭配。若页面空间整体、色彩和 谐统一，则给人一种幽雅、宁静感；若以对比手法处理，图形 文字色彩明快突出于背景色，则页面空间氛围会显得活跃而有 生气。但是，要注意不能有强烈的色彩对比，因为过于丰富的 背景色彩会影响前景商品图片和文字的取色，使文字溶于背景 中，不易辨识。所以背景一般应以单纯为宜。 最后，作为设计师在考虑网页设计时，还应考虑到时代流 行性色和企业标准色的问题。所谓流行色，是指在一定范围内 和时间内，非常盛行并易为人们接受的某些式样或颜色。而标 准色的运用在网上扩大了品牌效应，也是对公司整体形象的统 一应用，从而构成了企业识别系统（CIS）的重要部分。 三、商业网页设计中动、静的视觉心理因素的运用 商业网页设计构成要素可分为两种状态：静态与动态。静 态要素设计具体指静止的商品图形、文字、按纽等；动态要素， 具体指动态按纽、按纽连接、网页动画和视频等，它们是丰富、 第 6 页 生动网页、张显个性、突出主题重要手段。 动静以及不同的动静组合都可以反映不同的心理与性格， 如，动大体上给人活泼、生动的印象，但极慢的动常给人忧虑 感；迅速或突然的动常给人焦虑、惊慌感。另外，静也常给人 宁静、沉闷两种感觉。 商业网页设计中要注意处理好动静的关系，要整体和谐统 一，给人生动而不躁动或厌恶感。同时还要遵循动态性原则与 交互性原则。 1.动态性原则，即要有四维空间或五维空间的运作观念。 一件网页商品、图片不仅是二维的平面或三维的视觉，也要有 时间与空间的变换，情感与思维认识的演变等多维因素。 2.交互性原则，即界面设计强调交互过程。一方面是物的 信息传达，另一方面是人的接受与反馈，对任何物的信息都能 动地认识与把握。 四、商业网页设计中视觉流程心理因素的运用 商业网页设计是通过视觉元素引起人注目而实现商品信息 内容的传达，为了使网页获得最大的视觉传达功能，使网页真 正成为可读强性而且新颖的媒体，必须适应人们视觉流程的心 理和生理的特点。 视觉流程的形成是由人类的视觉特性所决定的。心理学家 葛斯达认为：人们阅读时，版面的上部比下部的注目价值高， 左侧比右侧的注目价值高。因此，版面的左上侧位置最为引人 第 7 页 注目，因此，在网页设计中一些突出的商品信息，如主标题、 每天更新的内容等通常都放在这个位置。以便于一开始就吸引 受众的视线，诱导其由上到下，由左到右地移动。此位置也被 称作视觉的最佳视域。也就是最优选的地方。当然视觉流程是 一种感觉而非确切的数学公式，只要符合人们认识过程的心理 顺序和思维发展的逻辑顺序，就可以更为灵活地运用。设计者 可以利用视线移动规律，诱导读者的视线作左右流动、上下流 动以及斜线的不稳定流动，通过编排设计，人为地产生最佳视 域，突出主要商品，以达到一定的视觉效果，传递商品信息。 商业网页作为一种新的企业开展电子商务的基础设施和信 息平台，它的发展虽然没有多长时间，却兼容了传统平面设计 的特征，又具备其所没有的优势，成为今后商品信息交流的一 个非常有影响的途径。其设计是一种综合性的设计，它所涉及 的范围非常的广泛，包括消费者心理学、视觉设计美学、人机 工程、哲学等诸多方面，而本文中只从视觉心理因素的角度进 行了一些阐述与分析，仅作抛砖引玉之用。 参考文献: 1李彬彬:设计效果心理评价M.北京:中国轻工出版社, 20XX.1 2赵殿泽:构成艺术M.沈阳:辽宁美术出版社，1994 3赵国志:色彩构成M.沈阳:辽宁美术出版社，1994 4张国良:传播学原理M.上海:复旦大学出版社，2000.1 第 8 页