扁平化风格在网页界面设计中的应用

杨晔

摘要：扁平风格设计在现代计算机设计领域中被广泛的应用，随着融合了扁平化设计的Windows8系统发布之后，在大多数网站设计中，逐渐开始应用到扁平化设计这一设计风格。本文根据现代网页设计中的主要发展趋势，将扁平化设计风格在其中的应用以及效果进行详细的分析。

关键词：扁平化；网页界面；设计；应用

扁平化设计风格在现代网页设计中属于新型的风格设计类型，主要是将原本网页中较为拟物化的界面转变为“平”的界面，这种界面在形式上更加简单，能够帮助用户将思路变得更为明晰，使用户在进行使用的过程中，能够高效快速的进行办公类活动。

一、扁平化风格的基本概念

（一）基本概念

扁平化设计的基本概念是：追求一种扁平化内容，将原本流行多年的透视、纹理、高光等一切有关于拟真视觉效果的内容转变，应用颜色帮助用户实现交互内容，排除原本的阴影、羽化、渐变等效果，使界面整体变得干净利落，突出信息的本身内容。

（二）设计原则

（1）一致性。为了改善用户的体验，帮助服务的更加易用性，采用一致性的设计形式，让用户在使用的过程中，能够建立起相同的心智模型，保证用户的快速理解。

（2）对比。色彩等方面的配比能够帮助用户将界面中的按键和感官中的按键进行区分，将不同的色彩进行渲染，保证用户在使用的过程中，能够直接明了的了解内容。

（3）布局。在布局上帮助用户的感官产生平衡的感觉，采用简单的布局设计，让用户能够直接进行相关内容的查询，引导用户跟随设计所指定的路线进行搜寻，使其最大限度的简洁化。

（4）减少摩擦力。创造用户的通畅体验就需要降低用户实现目标所用的时间和环节，所以，在设计的过程中，不论哪种类型都进行简洁化的设计。

（5）用户需求。用户需求会根据不同的类型选择，多元化用户的选择风格自然是多元化的，时尚领域中的用户可能对扁平化风格的简洁较为喜爱，而在普通大众的眼中，这种风格设计与原本的传统风格有着较大的差异，用户可能并不会全部适应。

二、扁平化风格在网页设计中的运用

网页设计在现代計算机领域中是较为重要的一项设计内容，其不仅能够在视觉上帮助语言的传导，更能够根据排版的不同和布局的不同来转变用户的视觉视角，使用户在使用的过程中，能够产生视觉特效的感觉。为了能够更享受视觉特效，排版布局的合理性成为了主要设计的内容。

（1）布局排版。扁平化设计在进行排版的过程中，需要将首页的标识和导航首先进行编排，一般会将首页的标示选在主要的视觉区，导航等内容也尽可能的实现简化的设计，图片在设计的过程中，一般会在大面积的排版内，将一些用户觉得有趣的内容进行放置，保证在用户进入主面时，能够直接看到感兴趣的内容，帮助用户进行更为快捷的活动。

（2）内容组织。扁平化风格在设计的过程中，并不是将设计的内容也变得简单，而是将设计的内容主要的核心突显出来，在新的设计风格影响下，网页的设计还需要将内容作为主体，不论外观多么吸引用户的视觉，但在内容的设计上，还需要进行更深层次的考虑，保证网页的内容能够有效的将用户的注意力吸引过来。

（3）网页栏目。网页栏目主要是将网页中的一些主要的内容进行归纳，将网页中的一些核心的内容首先突出的显示出来，保证在用户进入网站之后，能够直接将自身需要找寻的内容看到，方便用户的直观体验。

（4）交互性动画。交互性动画在主要指的是，在鼠标停住在图片或者视频上时，能够直接将视频或者图片中所包含的信息显示出来，另外，还有一种是点、线之间的交互设计，通过鼠标的拖动将点、线构成多样化的图形内容，在逻辑的层面上，极大的减少了繁琐的层次，使用户在使用时，能够更加简洁快速。

（5）首页设计。一般在用户进行浏览网页的过程中，首先进入的是网页的首页界面，在这一过程中，设计者需要保证首页界面能够第一时间将用户的视觉停驻，让用户在浏览的同时，找寻到自身所关注的内容。

（6）标识设计。标识设计主要在网页中的特定位置，一般情况下将其放置在网页的左上方，为了更加方便用户的寻找，这也是大多数的网页的设计方式。

（7）导航设计。在进行导航设计的过程中，首先考虑的使用户的使用方便性，为了防止用户在使用过程中，产生迷路的情况，在设置导航功能的时候，要将导航的位置选在明显的地方，同时，还要将导航中的一些渐变的效果去除，将简单的色彩作为主要的使用背景，并将导航的说明附加其上，这样就能够帮助用户最快的识别导航的标识。

（8）文本设计。为了让使用者在使用的过程中，能够将有用的信息快速的提炼，在设计这些内容时，需要将实用性放在首位，通过扁平化设计的风格，将网页主要内容中的文字区域进行特殊的区分，这样才能有效的帮助用户分辨选择的内容，从而提升了使用的效率。

（9）图片设计。这一部分的设计也能够主要突出网页中的重要内容，选用图片能够直接影响到网页的浏览效果，越是全新的设计风格类型，越能够吸引用户的眼球，在扁平化风格的影响下，能够让设计的内容变得简单有效，通过极少的装饰内容来进行设计，不仅能够将图片设计的内容突显出来，更能够节省用户的找寻时间，快速的帮助用户提升办公活动速度。

三、扁平化风格在网页设计中的效果分析

（一）效果分析

扁平化风格设计的使用，能够让用户在信息层面上将应用的过程简化，一定程度上帮助系统更为流畅的运行，传统的设备运行的过程中，会因为有些资源不能使用同一软件进行设定而出现下载多软件的情况，极大的降低了设备运行的速度。而扁平化风格设计在使用的过程中，能够有效的将设计的内容简单化，信息资源在进行多层次的表现时，没有多余的内容，直接由前一层转移到下一层的信息中不用多余的操作就能将信息快速的浏览完毕。

（二）优化设计

交互设计的方式要保证按键和图片的表现更加简单，和整体的搭配要协调，同时还要将各个页面之间的跳转变得指向性更加鲜明一些。在进行文字设计的过程中，选用文字的类型要更加突显文字的线条感，使其在展现出来时，能够更加饱满。而在色彩的搭配中，需要将网页设计的主要内容体现出来，色彩要选用一些鲜明的进行填充，同时，还要保证辅助色的搭配，保证在选择的过程中，能够和主体内容形成一种富有层次感的效果。

四、结论

扁平化设计风格主要是将原本的多元化的表现形式进行简化，方便用户体现的同时，也能考验设计人员的表现能力，怎样在简洁的设计中找出突显设计内容的方式，成了现代设计人员主要思考的问题。

参考文献：

[1]秦岁明，何梦楠.扁平化风格在网页界面设计中的应用[J].包装工程，2015（3）.

[2]龚波.网页界面设计的视觉要素探究[J].信息记录材料，2018（3）.