扁平化美术创作风格对网页设计的创新推动

甘心瑶 黄孟芳 张文娟

一、网页设计风格及其发展趋势

（一）网页设计风格

网页设计的风格多样，近年来常见的风格有扁平化风格、3D风格、科技风格、复古风格、玻璃或金属质感、色彩渐变等（见图 1）。在实践过程中，设计师通常需要根据网站的主题、功能、使用人群等因素来设定相适宜的网页风格。

我们可以从图中看出，不同风格的网页各有其特点及优势，这些风格特点也有共性可循，大多数的网页风格都是以扁平化美术创作风格为基础，结合了扁平化的特性，网页总体都看起来十分“平”。即使是3D风格的网页，也运用了扁平化風格的二维插画、背景、字体等，完全的3D网页设计风格现在较少见，基本上都是在扁平风格基础上局部立体化。

（二）网页设计风格的发展趋势

随着网页技术（Html5/CSS3、JavaScript等）的发展，我们难以用一种风格去定义当前设计趋势。此外，每一年甚至每隔一段时间，用户会有不同的需求与喜好，社会风气、流行元素时刻影响网页风格。因此，我们可以提取近年来网页流行风格的共同点，总结网页风格大致的发展趋势。

1.响应式设计

响应式设计网页的概念是在2010年5月由著名网页设计师马科特（EthanMarcotte）提出的，随后迅速在前端和设计领域普及，如今已成为网页设计的一种主流。正如专家所说，响应式的网站设计创造了一种前所未有的选择，这种建立在网格布局和CSS3基础上的移动网页 设计，能够使网页随着不同终端屏幕的变化而 变化。这种设计方式更加统一和全面，是一种 打破原有网页设计模式和局限的设计方法。

2.微交互设计

网页的功能与细节设计将决定用户是否愿意继续使用。然而，出色的细节设计离不开良好的微交互设计，微交互设计能让用户感受到非常明显的参与感和互动性，并且还可以通过微小且自然的变化创造舒适感，提升视觉品质。

3.半扁平化设计

现在许多设计师都重新创造了扁平化的设计概念，出现了一种新的网页设计潮流——半扁平化设计。从字面意思即可理解，半扁平化设计并不是完全扁平，而是在扁平化的基础上 增加一些阴影、渐变、高光或局部立体效果，不改变扁平化风格的本质，优化设计元素的层 次结构，提升创意性、趣味性及情感表达，呈现出一种优雅而高级的氛围，增强用户的视觉体验。

二、扁平化美术创作风格特征及优势

（一）扁平化美术创作风格特征

扁平化网页设计风格去除了复杂、冗余的视觉元素，提倡“少即是多”的美学理念，强调抽象、极简主义。它以简洁的排版、舒适的色彩、合理的文字搭配为用户带来了良好的视觉效果和审美体验。相较于其他设计风格来说，它能够有效缩短用户获取信息的时间，提高用户的浏览体验，更好地满足高效工作的要求。

（二）扁平化美术创作风格优势

1.网页布局灵活

随着手机和平板的广泛使用，移动端设备屏幕尺寸的多样化给网页设计造成了很大的困扰，一般的网页设计较难实现跨平台的界面适配，而扁平化设计能够很好地适应这些变化的需求，因为它的框架结构简洁，在布局上更加自由、灵活。扁平化网页结构清晰，层级划分明确，首页与内页的联系紧密，将信息传递给用户的时间大幅缩短。此外，由于图标、背景等简化，更多地使用矢量图形进行设计，减少了内存和空间占用，提高了计算机运行速度和 网站的加载速度，使用户在移动终端浏览网页更加便捷、顺畅，体验感更好。

2.获取信息高效

与拟物化设计风格相比，扁平化风格在设计元素上减少了实物化材质、纹理、阴影、高光等装饰效果的打磨，将页面内容本身展现出来。扁平化设计能够避免过多的视觉效果干扰用户视线，在有限的屏幕上更加明确地呈现网页信息，减少了用户浏览复杂的、次要的信息所花费的时间，提升用户获取主要信息的效率，并增加了信息量的接收。

三、扁平化美术创作风格推动网页设计创新的原因

（一）扁平化美术创作风格网页易缺乏独特性

每个企业、品牌或个人的网站都希望网页界面能突显他们独特的风格和品质。扁平化设计的缺点之一是坚持简洁化的视觉风格，从而导致设计形式容易单一、趋同，页面看起来十分相似。扁平化设计若能做好， 可以给人简约、清新、高效的感觉，若处理不到位，不但容易显得乏味无趣，甚至还会出现设计雷同。这要求设计师不断地提升自己的专业知识储备、审美能力、设计能力等，减少非人性化的设计，推动网页设计创新发展。

（二）扁平化美术创作风格对网页设计的要求变高

扁平化美术创作风格并不是简单地去除复 杂的装饰效果，一味地追求网页简化。它虽然 在形式上看似简单了，实则对设计师的抽象构 思能力、图形与色彩细节处理能力都提出了极 高的要求。设计人员要具备极强的视觉传达设 计能力，在有限的网页空间内突出主要内容，使浏览者能够第一时间了解网页的种类和作用，缩短信息查阅的时间，提高用户对于网页的使 用体验。

1.图形

在设计时，首先要保证图形在高度抽象、符号化后仍能被准确识别，用简化的线条尽可能准确地表现对象。做减法往往比加法更难。

2.色彩

在没有肌理、浮雕等效果的情况下，要准确把握色彩心理特性、熟练运用色彩层次，通过平面色块营造美观的界面、合理引导视觉流程的同时，还要准确传递给用户有用的操作信息。3.文字在保证文本可读、易读的前提下，追求创新的字体和合理的文字排版。网页任何部分的文字都需要与整体风格保持和谐统一，字体需要从大小、粗细、色彩等多方面选择。文字的排版要注意间距、位置、方向，遵循视线的移动规律，为用户带来舒适的视觉体验。

四、扁平化美术创作风格推动网页设计创新发展

扁平化美术创作风格对网页设计的要求变高，体现在设计的创意、功能、结构、引导性等方面，除此之外，扁平化风格网页的学习成本相对较高，在设计时还需要考虑到不同用户人群的使用情况，如小孩、老人、特殊人群等的接受程度。随着时代的发展，网页设计越来越注重以用户体验为核心，因此，扁平化美术创作风格作为当今最流行的网页风格之一，为满足用户多样化的需求，促使着网页设计不断地优化、创新发展。以下为主要的设计思路与方法。

（一）设计元素

扁平化风格由于装饰元素较少，容易给人冷淡、乏味之感。扁平化美术创作风格的网站设计在去除复杂装饰的同时，可以合理增添修饰效果，满足用户日益增长的视觉审美需求。有效的修饰元素能够增加页面丰富度，在简约的同时却不失细节，也为未来的扁平化风格带来更多的可能性。

1.光影效果

适当地增添光影效果可以使整個页面更加 立体，层次丰富，具有吸引力。

2.颜色叠加

为使网页视觉效果更佳，可运用色彩元素的叠加。颜色叠加的形式多种多样，在设计时需要考虑色彩的饱和度、透明度和对比度。不同的色彩在碰撞之下往往会产生巧妙的视觉效果，使网页的色彩更加丰富、灵动活泼。

3.夸张元素

网页中的字体、色彩、图片、按钮等任何一种元素都能够运用夸张的设计手法。同样是 扁平化风格， 但可以通过适当调整大小、位置，使网页变得更有特色。

（二）微交互

良好的交互体验是界面设计的根本，微交互在网页设计中有明显的增长趋势，更加多样的微交互开始出现在网页设计当中。微交互是 一种非常有效的引导和信息反馈方式，它是信息来临时的通知弹窗，是刷新页面完成时的提醒，是点击之后加载的小动效。

酷酷俱乐部是一个荷兰的纸牌售卖网站（见图2），该网站拥有丰富的微互动、悬停效果。用户通过鼠标点击主页面卡牌的外盒，会有一张张的卡牌弹出；当鼠标悬停在卡牌盒上，有卡牌待向外滑出的微动效，同时卡牌的具体信息会渐渐地显现。微交互让页面的内容变得更加有趣，在突出产品和网页特色的同时，吸引用户停留，最终实现其商业价值。

微交互和微动效通常以小图标、小按钮等小模块形式展示，加入于网页中既美观又有趣，互动性较强。未来的微交互会更加细致，注入更多的趣味性。微动效和微交互在用户界面（UI）和用户体验（UX）设计中， 是不可或缺的部分，所以从严格意义上来说，他们不仅仅是网页设计的趋势，还是基本要求。

（三）情感表达

网站的功能性和逻辑性固然重要，但是视觉效果引起的审美感受、界面交互过程中所产生的情感需求也是网页设计不可忽略的重要方面。与潜在用户产生真正连接的唯一途径，还是情感化的设计。

优秀的网页大多数都会抓住用户的某种情感诉求，这种诉求可以是愉悦的正面情绪，甚至是焦虑等负面情绪，快速与用户建立情感联系和信任感。例如哔哩哔哩网站的交互设计（见图3），当用户输入密码时，下方的人偶会相应地捂住双眼；密码输入错误时，不仅文本框会变红提醒用户，人偶也会给出相应的反馈。总之，整体设计给人以俏皮、安全之感，可以说是非常暖心的设计了。

在情感化网页设计的过程中，需要注意文 本、图片、色彩等元素应当在情绪表达上保持 一致，方可带来共鸣。通过高度统一的情感输出，激发用户更进一步操作的欲望，让兴趣和吸引力成为撬动用户的关键。这也正是绝大多数优 秀的设计作品所呈现出来的一种成熟设计技巧。

五、结语

在信息技术和网络快速发展的时代，扁平 化以一种清新简约的设计风格出现在大众的视 野中，成为当下网页设计的主流风格。也正是 由于扁平化风格逐渐普遍化，导致现有网页出现风格相似等问题，且由于扁平化风格的特性，网页通常在视觉上缺少感性的情感体验。随着 设计的发展，用户群体被划分得越来越细，以往的扁平化风格难以满足用户的个性化需求，扁平化风格提高了对网页设计的要求，体现在 设计元素、微交互、情感表达等各个方面，不 断推动着网页设计的创新发展。未来的扁平化 网页风格会加入更多新的设计元素，形式上不 会再像早期那样不考虑装饰，将变得不那么的 “平”。扁平化风格的网页设计提升空间还很大，需要设计师用创新的思维进行设计，不断地加 强技术性与艺术性的结合，促进网页设计的发 展，从而使扁平化风格能够更好地应用于网页 设计之中。

[作者简介]甘心瑶，女，汉族，江西新余人，西北大学研究生在读，研究方向为美术。黄孟芳，女，汉族，陕西人，西北大学影视与戏剧博士生导师，教授，研究方向为企业形象CIS设计、品牌设计与广告学、文化创意产业、新媒体艺术与短视频创作等。张文娟，女，汉族，江西赣州人，西北大学研究生在读，研究方向为美术。