岚海网络信息技术有限公司官方博客

精彩文集

精彩热评

云南三九手机网之我的设计思路 - 浅谈扁平化设计风格

  • 岚海设计师Sam
  • 2012-12-25
  • 5

自接到为云南三九手机网的改版任务后,可谓是既欣喜又纠结,欣喜的是又可以把近两年积累的新理念再次体现在一个成功的项目上,纠结的是三九手机网作为云南知名的电商网站,以往的设计风格和用户操作习惯早已为人所熟知,如何才能在不让老用户产生使用挫折感的前提下尽可能的为网站带来更多更为新颖及优质的改变成为了我所需要思考的事情。

经过了再三斟酌及岚海设计团队的集中讨论后,我最终采用了扁平化的设计风格为三九手机网进行改版设计。

说起扁平化设计其实大家并不陌生,早在2011年岚海网络公司官方网站的改版采用的即是这种设计风格,经过过了进3年的使用,从用户反馈的数据来看这次改版也显得非常成功。自前段时间苹果IOS7的推出后,这种设计风格也更被大家所熟知了。

那么我今天要做的,就是想大家更为详细的介绍什么是扁平化设计风格,首先,在这里我们切不分析过去几年的拟物设计风格和现在的扁平化设计的优劣,更不不需要去评价孰好孰坏,在一切形式都是为内容服务的今天,我只能说哪中风格更适合你的产品,那哪种风格就是好风格,就想你问我水和酒什么好喝一样,我同样没办法回答,只能看此时的你最需要什么。

为什么会流行起扁平化设计呢,有的人说是苹果的简约风格引领起的时尚潮流,偏巧前两年岚海的网站建设案例:苹果手机专卖的B2C购物网站“概念数码网”也用了这种风格,也有的人说是一群高级设计师为寻求突破而做出来的设计潮流,也有人说是从平面设计中演化而来的...

其实我认为,以高光、折角,倒影为代表的web2.0设计风格在流行了2,3年后已成疲软之势,而现在的扁平化设计风格随之将成为未来设计风格发展的趋势,这也是设计界发展的必然规律。

把握好当下的流行趋势是作为一名设计师的必修课,那么下面我将以一些案例为大家详细介绍何为扁平化设计风格。

1.去掉特效

同样是图标设计,去掉了阴影、渐变和所谓的质感后显得更有质感了。做减法这一步是最简单的。

扁平化网站设计风格范例1

 

2.巧用色彩

扁平化网站设计风格范例2

扁平化网站设计风格范例3

扁平化网站设计风格范例4

扁平化网站设计风格范例5

扁平化网站设计风格范例6

扁平化网站设计风格范例7

扁平化网站设计风格范例9

3.注意细节

并不是说只有web2.0高光渐变投影才讲究细节,细节对扁平化来说同样很重要。

扁平化网站设计风格范例11

扁平化网站设计风格范例22

扁平化网站设计风格范例33

结语

扁平化设计虽说是当前最流行的设计师形式,但正如前文所说,一切形式依旧永远是为内容服务的,作为设计师并不能一味的追赶潮流,适合产品的设计才是最好的设计。

相关阅读:

适合产品设计风格才是最好的,设计师莫要一味的追求流行

如何为高龄用户群进行用户体验设计

做好扁平化设计的技巧并不是一味的去掉拟物设计的元素,而是需要设计师多加以观察,去练习,学会提炼重点!

扁平化设计并不是简单的涂个颜色,其实也是有很多细节需要把握的,色块也可以表现出很有质感,很有动感的效果来。而去掉了高光,投影的修饰,反而对对设计师的色彩把握感要求得更高,就像级别的厨师竞赛中没人会去做烧烤,不放辣椒的菜如何才能把原料的鲜味体现出来才是做菜的最高技巧。

最后,在这趟设计潮流的变革中,我们作为见证者,也作为参与者,就让扁平化的设计风暴来得更猛烈些吧。

岚海网络官方博客 http://www.lhave.com/blog/

全部 5 条评论
Sam

大神设计哇~!

1F
坂崎良

发现有人在自恋了

2F

IOS7用了几个月了还是不怎么习惯

3F
万户侯

大神~还有能让你纠结的项目吗

4F
北风吹

浅显易懂,谢谢分享

5F