H5扁平化网站设计风格解析

2017-10-13 10:19:43

扁平化设计之所以成功,因为它仍然是非常独特的,而且它不必使用过分夸张的花招吸引网站访问者。在外观和元素排布上,它是组织良好层次清楚的,所以这个网站对用户来说是非常易于交互的。扁平化设计,对于过度设计来说是一种进步,甚至可以说是一次革命。过度设计来源于这样一种心态:一些设计师为了吸引网站的访客并且保持访客的兴趣。结果就是,他们会将各种花哨的(尽管不一定是有用的)东西放到网站上去,如华丽的动画和插图。

青岛网站设计经过几十年的发展,由简单的文字显示走到现在丰富的图文和动画显示,而正是这种满屏的图片和花俏的修饰,让网页的实用的本质越来越少。而就在这种花俏的修饰达到一定程度后,扁平化设计就出现了,扁平化的特点就是摒弃了这些花哨和过度的修饰,让页面返璞归真。
 
简而言之,扁平化设计可以总结为一个众所周知的原则K.I.S.S,即“keep it simple,stupid。”

有些被称作扁平化设计的对用户来说很友好,那是因为他们是以用户为中心的,使用这种设计方法时用户是第一位的和最重要的。

曾经,skeuomorphic设计正是这么做的,他们把现实生活的熟悉的画面搬到界面上,采用仿真的阴影形成更多的噱头,以及假乱真的纹理,甚至于使用真正物体。

摒弃图层效果

扁平化设计的名称来源于它使用2维度的设计方法和平面化的设计元素,这意味这它不会过度设计。同时也意味着不会有倒角,投影,渐变或者其他更多的效果应用到一个图层上去。看看那些使用扁平化设计的网页框或者元素:它们只有清晰的边缘而没有什么投影。

看看triplagent,它全面诠释了这些特点。

扁平化设计基础

简约和简单可以用来描述扁平化设计的特性,这意味着它很自然地促进可用性。它具有鲜明的色彩,清晰的边缘,开放空间,干净,当然,二维或平面化的插图。它是指任何过度设计以外的东西。

windows 8,微软最新发布的操作系统,是扁平化设计的基本例子。

微 软应该说是大力使用这种风格最早的公司之一。显然,这可以被看作是最近已经遭到非议的苹果过度使用拟物化设计的一个回应。你会注意到,从上面 windows 8的例子中,扁平化设计强调了基本的,像图标一样的图形设计,而不是把真实世界的物体变小一点或者使用仿真的图形。这意味着扁平化设计使得真实的世界和科 技世界之间产生更大的鸿沟。

扁平化设计是一次变革

总而言之,扁平化设计应该是对一些设计者在过去几年里过度装饰的反抗。这应该是一个很好的进步,因为很多网站都是过度的装饰着动画和插图。

而这些对用户体验来说是毫无用处的。扁平化设计给网站的设计带来的简洁之美,虽然它仍然在寻找更好的视觉表现以及怎样才能给用户带来更好的体验的的方法。

最后,你觉得扁平化设计是怎样的?现在到了扁平化设计的时代了么,还是只是暂时对拟物化的过度设计的一个回应?你是否喜爱扁平化设计超过了拟物化设计?

色彩是让人难忘的要素

花一点时间去看看一些扁平化设计的网页,你会马上发现,他们使用的色彩比那些非扁平化设计的网页更加明亮和充满活力。在如此的聚焦于简洁之后,

扁平化设计给予网页色彩这样的基本设计元素以更加散发光彩的机会。

什么是扁平化网站设计

扁平化设计可以溯源到调色板的使用。除了更加充满活力,他们通常使用更多的颜色。例如,传统的色板通常使用2-3种颜色,扁平化设计可以使用多达8种颜色。

在基本色和辅助色已经是很流行的常见色的情况下,多色相即使没有什么多余的 元素就已经是充满活力的。至于现在,有些颜色似乎比其他的颜色更受欢迎:复古的颜色(蓝色,绿色,紫色,橙色)

这些颜色在扁平化设计的网站上已经都非常常见。在Wistia的网站上,你可以清楚的看见所有这些方面,色彩是无缝衔接在一起的。

什么是扁平化网站设计

排版是重点

毫不奇怪的是,由于没有多余元素的存在和干扰,排版的重要性被显得更加突出。在扁平化设计中,排版以前从未被作为一个设计元素显得这么重要过,也许因为用户的眼睛较少为这方面分心。

文字的风格和扁平化设计的外在表现需要是和谐共存的,一个花哨的字体会和其他简单的设计元素形成鲜明的对比。同样需要强调的是字体的简洁大方。一个成功的扁平化设计的靠谱的选择是sans serif这种字体。可以将一个高度创造性的字体作为一种艺术元素与极简主义保持和谐,这样做也许不会让用户觉得很夸张。但是,请不要做的过火。

平面设计中的字体必须教会用户学会如何获得最大的设计收益。因此,在网页上的元素和按钮应该显得易用和易于交互。

拟物化设计:正好相反

如果你仍然不清楚扁平化设计是什么,那么就看看和它相反的设计手法:拟物化设计;这是个很好的办法将两者区分开来。基本来说,拟物化设计的特点是通过把真实世界的触觉和物理感受和网站设计结合起来。

例如:Find my friends的设计,它是苹果公司设计的一个应用,它可以让用户发现其他用户和跟踪他们的IOS设备,看看它在主界面上那仿皮革制品的纹理的界面,是拟物化设计的绝佳例子。

什么是扁平化网站设计

如果在青岛网站设计中要做到扁平化设计,就需要基于这样的设计原则:设计应该是简洁的,让页面内容返璞归真。