天天看點

Google+兩次改版設計風格探析

評價一個東西的好壞,通過對比是最直接的辦法。

google+ 自 2011-6-28 釋出至今(2013-5-16)曆經兩次重新設計,三個版本。

Google+兩次改版設計風格探析

産品的設計是由産品功能出發的,功能之間的邏輯加上表現功能與邏輯的視覺元素構成了産品的設計,而貫穿始終的則是設計師自己的設計哲學。無論是拟物化還是還 是扁平化,都僅僅是視覺風格,僅從視覺風格讨論産品設計的優劣無從談起,這裡則從功能與邏輯入手探讨 google+ 的兩次 redesign。

早期的 google+ 界面與同時期的 gmail 有很多相似的地方,這不僅是為了使用者熟悉界面,更關鍵的是此時的 google+ 尚處在功能的探索與取舍的階段,無法系統的設計自己的界面。

而後 google+ 進行了功能的取舍與合并,去掉也添加了許多功能。此時的 g+ 功能組成漸漸清晰,但問題也很明顯,各個功能散落各處,邏輯混亂不堪,沒有明顯的層次關系。

Google+兩次改版設計風格探析

早期的 g+ 功能散落在各處

于是開始了第一次重新設計。

将頂欄功能導航欄放于左側,原左側的圈子分類變為二級菜單。

将 chat 與 hangout 一起放在右側。

将資訊流與其他資訊置于中間。

用左側的功能欄,頂部的搜尋欄與右側聊天将中間資訊流包圍,以不同配色分割,以突顯兩層的邏輯結構。

Google+兩次改版設計風格探析

不論其視覺效果如何,是否讨好眼睛,但重新設計後的 g+ 變得層次清晰,更加便于了解便于使用了,甚至可以說這時的 g+ 才是正式版。

如果說第一次重新設計是梳理功能間的邏輯層次,那麼一年後的第二次重新設計則是繼續簡化了邏輯。

Google+兩次改版設計風格探析

将原來左側的條目欄預設隐藏。

将右側的 chat 與 hangout 徹底合并,可隐藏。

檢視資訊流時隐藏頂部搜尋框。

資訊流不再區分消息類型,個人資訊與谷歌的提示與推薦混在一起,既隻有一種資訊。

将對資訊流做操作的各種選項永遠固定在了頂欄(屬于原來的二級菜單)。

此時的 g+ 在邏輯上簡化為僅有兩個基本功能,資訊流與聊天,左側條目欄為資訊的來源,而無論是何來源在資訊流上顯示的資訊都隻有一種。如果再隐藏了右側的聊天,則整個頁面上僅有資訊流與操控資訊流的頂欄,與資訊流無關的東西全被隐藏,營造沉浸式的資訊流體驗。

Google+兩次改版設計風格探析

與資訊無關的均被隐藏

對資訊流最大的改變可以說是不再區分資訊類型,這樣直接簡化了資訊流(原來是雙欄)與了解成本,但 google 推薦的與個人資訊一同出現,必定使人厭煩,增大資訊量以降低推薦資訊的存在感則是很好的方法,這樣類似于瀑布流與卡片相結合的顯示方式無疑是最适合 google 的。

産品最終的呈現與産品的功能脫不開關系,而将其簡潔優雅的實作則是設計的挑戰,g+ 在這方面無疑做的很好。

設計不是流于表面的視覺風格與設計細節,各功能之間清晰的邏輯與層次才是産品設計靈魂,沒有清晰思路的指引,再風格化的設計也不過是衣着光鮮的行屍走肉。

無論是微軟的 windows 8 design,還是 google 的 holo 和卡片,亦或是蘋果的拟物化和現在風傳的 ios 7 的扁平化,都是在尋找着更好的資訊呈現的方式,都是以清晰的思路為指引的上層建築(微軟似乎做的不太好),其根本目的都是為了更好實作于呈現産品的功能與設計師的意圖,而風格化本身并不是主要目的。

若是産品背後沒有清晰的邏輯與思路,一味的營造視覺奇觀,就好比一坨屎澆上三勺濃湯,撒上二兩香菜,看似色香味俱全的好菜,但終究不怎麼好吃。

當然,它也許真的可以吃。

繼續閱讀