优惠活动 - 10周年庆本月新客福利
优惠活动 - 10周年庆本月新客福利
优惠活动 - 10周年庆本月新客福利

公司网站制作数字肌理的应用

日期 : 2019-03-08 13:55:07

曾几何时, 计算机中的数字世界是一个独立于现实之外的虚拟世界, 由于网速带宽和界面设计师水平等条件的限制, 数字界面设计在发展过程中长期存在设计机械化、枯燥乏味, 缺乏真实情感联想、艺术美感以及吸引力匮乏等问题。而今, 在人们的生活中, 数字世界已经和真实世界互相交融, 密不可分, 设计师开始尝试在虚拟世界表达现实主义和人文精神, 其中具有代表意义的现象是肌理设计和应用成为近年来界面设计领域的趋势和潮流。
肌理, 也称为质感, 是物质表面的组织结构, 即物质表面呈现出的色彩、光泽、纹理、方向、深浅、粗糙度、透明度等多种外在特性的综合表现。现实生活中的肌理千变万化, 不必然依赖于材质而存在, 因此设计师可以通过模拟和虚构肌理从而触发人们的感受, 使得肌理设计拥有数字化发展的广阔前景。
根据给人的知觉感受, 肌理可以分为触觉肌理和视觉肌理。顾名思义, 触觉肌理是通过皮肤触摸而感受到的光滑、粗糙等感觉;视觉肌理是无须皮肤接触, 直接通过眼睛即可识别的肌理。数字肌理的表现虽然以视觉肌理为主, 但设计师可以充分运用视觉肌理来表现相应的触觉心理体验, 这种不同感官之间的互通现象也被称为联觉或通感。
数字形态的肌理本质上都是计算机程序产生的数字符号, 但它的表现形式大致可以分为两类:一类是模拟肌理, 即模拟现实世界中已经存在的肌理;另一类是虚构肌理, 即利用数字技术创造只在非现实世界中存在的肌理。
一、数字肌理的生成
如何创造网页设计中使用的数字肌理?技巧和方法不拘一格, 总体来说主要有摄影、扫描、程序模拟、图案、笔刷等。这些技巧和方法既可以分别独立使用, 也可以综合使用从而创造精致多变的整体肌理效果。
1、摄影
摄影在创造肌理中主要有两方面的用途, 一是获取现实世界中已经存在的材质和纹理的原始素材, 如木材、金属、石头、砖墙等;二是通过摄影捕捉现实生活中的感受和氛围, 并将之应用到设计之中。摄影是一种视觉细节极为丰富, 气氛情感传达最便捷, 给人真实感极强的肌理表现手法。
2、扫描
扫描主要用于获取不同质地的纸张表面的纹理, 以及捕捉不同的笔触和颜料与纸张相互作用而产生的微观视觉效果。在使用不同类型的纸、笔、颜料, 以及颜料的用量、运笔速度存在差异的情况下, 肌理的形态也有明显不同。扫描能准确地复制出这些手绘和手写的痕迹, 因此非常适合用于表现艺术和生命的气息。
3、程序模拟
程序模拟理论上可以创造出任何的纹理, 无论现实中存在与否, 但是由于成本和技术含量过高, 效果可能不尽如人意, 因此很多时候网页设计师不得不选择更加简便的方法, 比如摄影、扫描等。程序模拟方法主要在三维软件中使用, 结合摄影和扫描生成的素材贴图, 再加上光影和凹凸效果, 就可以模拟出逼真的表面材质纹理。Adobe Photoshop和Illustrator的滤镜应用可以给素材快速地添加Cloud云纹、Noise噪音等具有一定的随机性的肌理。
4、图案
制作图案是在网页设计中经常使用的一种方法。图案是通过单体的规律性的重复, 形成无缝衔接的效果, 经常用于页面中的边框和背景。图案的原始素材可以来自现实纹理的模拟, 如布纹纸纹;也可以是来自图形软件绘制的矢量图案, 如几何、波点以及花纹图案;还可以是程序随机生成的图案。这完全取决于设计师想要通过图案传达什么信息。
5、笔刷
笔刷是一种在绘图软件中手绘添加肌理的方式, 笔刷的生成方式既可以通过对扫描的纹理进行矢量化叠加处理, 也可以将软件中直接绘制生成的图形转换成笔刷。在网页的插画和图标、Logo和标题的设计中, 都可以看到笔刷的频繁使用。笔刷效果通常是设计师通过在外接手写板上手绘的方式添加的, 因此具有一定的灵活度和随意感。
二、网页设计中数字肌理的应用
数字肌理之所以成为近年来网页设计领域的潮流, 是因为设计师体会到了数字肌理在网页中的重要作用。通过设计与内容相符的独特肌理, 并和图形、文字、色彩等元素搭配, 能够实现快速吸引观众目光、引导互动流程、高效传达信息等设计目的, 还能创造出具有高度识别性和便于人们记忆的网站风格, 给观众带来丰富细腻的情感体验, 不失为一种全面提升网页用户体验的有效方法。数字肌理在网页中的应用方式可分为以下几种:
1、设置视觉焦点, 引导视线流程
视觉焦点, 又称为兴趣中心或视觉中心, 是页面上最吸引人们注意的地方, 也是视线集中交汇之处。肌理内部细节比较丰富, 在与干净平滑的纯色背景形成对比时, 非常容易成为视觉焦点。利用相关性原则, 可以引导用户的视线流畅地移动到色彩与肌理部分一致的说明文字上。设计师将数字肌理应用在重点信息和行动召唤按钮上, 能起到增加点击量和提高转化率的作用。
2、传达真实信息, 构建情感联结
由于模拟肌理具有很强的写实性, 观众在浏览的第一时间就能产生对现实事物的联想, 这使得内容的可信度和真实感随之增强, 非常适合应用在讲述真人真事的网站上。图1所示的网站综合应用了多种肌理创作手法, 将手写字体、水彩画、高清晰度的摄影图片以及模仿报纸印刷效果的字体结合成一个整体, 形成了极强的感染力, 观众在阅读文章的过程中, 很快就将自己代入故事的情境之中, 情感随着主人公而起伏波动。
3、表达文化内涵和艺术气息
手绘和手写的行为与绘画艺术和书法艺术直接相关, 因此使得手绘和手写的视觉质感天然具有一种文化和艺术内涵, 对于想要传达深刻文化底蕴和内涵的网站来说非常适合。手绘的笔触颜料渐变的肌理与人文主义风格的字体组合在一起, 赋予了页面强烈的视觉冲击力, 让人联想到历史给文物留下的沧桑痕迹。
4、增加装饰性细节, 吸引用户停驻
在整体几何形为主的现代主义设计风格中, 设计师也可以通过在局部添加数字肌理, 增加一些装饰性的细节, 避免用户感到单调无趣而过早离开。如网页用色数量少, 呈现极简风格, 设计师在插画图标元素部分用噪点笔刷添加一些局部细节, 利用笔刷叠加的层数多少构成阴影深浅的假象, 这种应用方式给单色图标营造了一种层次感和立体感。
5、创造独特风格, 便于识别和记忆
设计师都想设计出具有自己独特风格的页面, 使之在同类型网站中更容易被用户识别和记忆。网站的设计风格是品牌形象体系和表现手法在结构上的统一, 一种数字肌理在网页同类设计元素中进行稳定一致的使用, 是形成网站统一风格的重要因素之一。
三、使用数字肌理应注意的地方
1、牢记对比, 过犹不及
在网页设计中合理地应用数字肌理能起到画龙点睛的作用, 相反, 如果数字肌理过量使用, 不仅会降低用户获取信息的效率, 还会给人留下页面脏乱差的负面印象。肌理的应用是为传达信息而服务的, 只有在对比中, 信息才能体现出主次之分, 切忌添加过多无用的肌理。
2、综合运用, 打造整体
数字肌理在设计中不是一个独立的个体, 设计师需要思考如何将肌理和字体、图形、照片、色彩、插画以及互动交互等其他网页元素结合在一起, 使数字肌理为网站的整体风格服务。设计师需要在数字肌理和页面其他元素之间掌握一个平衡点。
相关文章