<var id="7vxvx"><strike id="7vxvx"><thead id="7vxvx"></thead></strike></var><var id="7vxvx"><video id="7vxvx"><thead id="7vxvx"></thead></video></var>
<ins id="7vxvx"></ins>
<var id="7vxvx"></var>
<var id="7vxvx"><video id="7vxvx"></video></var><var id="7vxvx"><video id="7vxvx"></video></var>
<var id="7vxvx"><video id="7vxvx"></video></var><var id="7vxvx"></var>
<menuitem id="7vxvx"></menuitem>
ShopEx首頁支持中心工作時間(9:00-18:00)
 

淺談網站建設的扁平化設計

發表時間:2014-05-05

  互聯網近年來刮起了一場風,一場關于網頁style的風,它不偏不倚的把人們的喜好吹向了——扁!平!化!

  說起扁平化設計其實大家并不陌生,早在2012年上海商派網絡科技有限公司官方網站的改版采用的即是這種設計風格,經過過了進2年的使用,從用戶反饋的數據來看這次改版也顯得非常成功。自前段時間蘋果IOS7的推出后,這種設計風格也更被大家所熟知了。

  那么我今天要做的,就是想大家更為詳細的介紹什么是扁平化設計風格,首先,在這里我們切不分析過去幾年的擬物設計風格和現在的扁平化設計的優劣,更不不需要去評價孰好孰壞,在一切形式都是為內容服務的今天,我只能說哪中風格更適合你的產品,那哪種風格就是好風格,就想你問我水和酒什么好喝一樣,我同樣沒辦法回答,只能看此時的你最需要什么。

  為什么會流行起扁平化設計呢,有的人說是蘋果的簡約風格引領起的時尚潮流,偏巧前兩年某網站建設案例:蘋果手機專賣的B2C購物網站概念數碼網也用了這種風格,也有的人說是一群高級設計師為尋求突破而做出來的設計潮流,也有人說是從平面設計中演化而來的...

  其實我認為,以高光、折角,倒影為代表的web2.0設計風格在流行了2,3年后已成疲軟之勢,而現在的扁平化設計風格隨之將成為未來設計風格發展的趨勢,這也是設計界發展的必然規律。

  把握好當下的流行趨勢是作為一名設計師的必修課,那么下面我將以一些案例為大家詳細介紹何為扁平化設計風格。

  1.去掉特效——做減法

  同樣是圖標設計,去掉了陰影、高光、漸變和所謂的質感造成的透視感效果,將以前的質感顯得更有質感。取而代之的是通過用抽象、簡化、符號化的設計元素來表現。展現給你的是極簡、大體字和十足的現代感,其設計的核心是交互體驗重在產品的極簡和功能,摒棄過多的界面感。這就是做減法  

  2.巧用色彩

   扁平化設計中,通常偏好明亮而且絢麗的多種顏色搭配使用,它一反以往的三色原則,讓六七種顏色同時展現在同一個主題下。一般比較受歡迎的顏色有——藍色、紫色、綠色、復古橙色。如下圖展示:

  3.注意細節

  并不是說只有web2.0高光漸變投影才講究細節,細節對扁平化來說同樣很重要。你可以自行比較一下下面的設計圖。

      

    扁平化設計僅僅是一種設計中的元素流行趨勢,它僅僅是一個網站建設的一部分,但正如前文所說,一切形式依舊永遠是為內容服務的,作為設計師并不能一味的追趕潮流,適合產品的設計才是最好的設計。

  扁平化設計不是萬能,它應該適合產品定位才是最好的,設計師莫要一味的追求流行如何為高齡用戶群進行用戶體驗設計做好扁平化設計的技巧并不是一味的去掉擬物設計的元素,而是需要設計師多加以觀察,去練習,學會提煉重點!

  扁平化設計并不是簡單的涂個顏色,其實也是有很多細節需要把握的,色塊也可以表現出很有質感,很有動感的效果來。而去掉了高光,投影的修飾,反而對對設計師的色彩把握感要求得更高,就像級別的廚師競賽中沒人會去做燒烤,不放辣椒的菜如何才能把原料的鮮味體現出來才是做菜的最高技巧。

 互聯網設計,是互聯網文化的表現之一,它更加趨向于互聯網style——一種時尚、簡潔、絢爛多彩。在這趟設計潮流的變革中,我們作為見證者,也作為參與者,就讓扁平化的設計風暴來得更猛烈些吧。我準備下次把我的網站——http:www.chawx.cn設計也變成扁平化。

最后,文章大部分思路來自ihave.com的團隊,謝謝他們。

 

熱門文章>>

產品知道
標準版,試水電商,低投入高回報。
企業版,野心勃勃不如付諸實踐,重在搶占先機。
旗艦版,杜絕“大企業病”業務管理步步到位。
網店系統咨詢
JIZZ全部免费看全片,99PAO在线视频国产,无码男男作爱G片在线观看,国产超碰人人模人人爽人人喊
<var id="7vxvx"><strike id="7vxvx"><thead id="7vxvx"></thead></strike></var><var id="7vxvx"><video id="7vxvx"><thead id="7vxvx"></thead></video></var>
<ins id="7vxvx"></ins>
<var id="7vxvx"></var>
<var id="7vxvx"><video id="7vxvx"></video></var><var id="7vxvx"><video id="7vxvx"></video></var>
<var id="7vxvx"><video id="7vxvx"></video></var><var id="7vxvx"></var>
<menuitem id="7vxvx"></menuitem>