當前位置:
首頁 > 天下 > 2016即將過去,手機上的設計美學發生了哪些變化?

2016即將過去,手機上的設計美學發生了哪些變化?

2016即將過去,手機上的設計美學發生了哪些變化? 點擊播放 GIF/1658K



-「刪嗎?」

-「再想想。」


公元 2016 年,人類分辨四季不再靠應季作物,而是只要打開手機,應用們個個都已經和去年大不一樣,這時你一定會感嘆時間飛轉。


Uber、Nike+ Run Club、VSCO,以及全民吐槽的 Instagram,這批用戶眾多的應用,都在今年大張旗鼓地改頭換面。然而和世間大部分改變一樣,老用戶永遠憤憤不平,但新事物需要時間來消化(或習慣),這也是我們帶來這篇推送的原因,建議你在 2016 翻篇前,重新看看它們背後的設計美學,讓世界多一分理解,也為下一次改變做好準備。


VSCO |符號美學

習慣時間:九個月

2016即將過去,手機上的設計美學發生了哪些變化?



先說說 VSCO,這款擁躉眾多的圖片編輯應用今年經歷了兩次改動,年初重新設計了 Logo(也作為應用圖標)以及整套視覺體系,六月的更新又將 UI 進一步推向極簡。在視覺團隊對外公布的設計筆記中,VSCO 遵從的符號美學顯露無疑。


三種象徵

「也許會被批輕率,但採用一個完全抽象的 Logo,對 VSCO 來說絕對是場壯舉。」

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?


兩層圓環組成的新 Logo,是代表用戶體驗的三個象徵之一(The Seal),靈感來自基因序列,寓指每人都擁有獨一無二的作品基因。另一個近似笑臉的圖標(The Face),則是由 VSCO 四個字母重構而成,象徵使用 VSCO 的用戶。The Globe則將圓形一分為四,「用戶社區」的概念藉此突顯。

2016即將過去,手機上的設計美學發生了哪些變化?



兩層圓環分別代表 A-Z 與 0-9,即最基本的創意元素

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



VSCO 四個字母不止一種組合方式


解構再造


基於靈感核心的三種象徵,VSCO 的整套視覺由此發散。密碼般的設計語言將 Logo 包含的元素解構,重新排列成一套獨一無二的字母體系,而它們又被廣泛應用於設計細節中。

2016即將過去,手機上的設計美學發生了哪些變化?



「我們在想,是不是能創造出一組體系,讓 VSCO 成為一套可視化的語言。」設計團隊在筆記中寫道。


視覺重構的過程,包括將拆分後的元素(它們通常是簡單的幾何形狀)結合到不同的體系當中,這些體系有人為的,也有自然的。

2016即將過去,手機上的設計美學發生了哪些變化?



「擴張、壓縮、突變、轉化」代表了四種設計方向,也是設計團隊的試驗重點

2016即將過去,手機上的設計美學發生了哪些變化?



「跌落的元素」


字體以及更多


理解重新設計的 VSCO,它在字體上花的功夫是無法繞過的。與 Letters of Sweden 創始人 G?ran S?derstr?m 合作創造的 VSCO Gothic 字體,正是整套設計的基礎。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



「VSCO 不是那種隨隨便便賣身給 Facebook 的應用,它正一步步建立自己的帝國。」


「我們希望重新設計後的 VSCO 可以用視覺語言反映人類語言,既可交互替換、使用靈活,又是自然有機地產出的。」因此 VSCO Gothic、新 Logo 的形狀、元素,都被一再拆分解構,成為臉部表情,成為各種象徵意義的符號變體。不止 VSCO,在旗下其他應用與服務中,同樣的視覺也融入其中,可見「體系化」的野心。

2016即將過去,手機上的設計美學發生了哪些變化?



不同場景下的字體變體


Uber | 滲透美學


習慣時間:九個月

2016即將過去,手機上的設計美學發生了哪些變化?



Uber 最近一次設計變動是 11 月,伴隨界面變化和信息流的內容擴展。而今年早些時候,它其實就擺脫了創業初就沿用的 「U」 字 Logo,轉而大張旗鼓地宣傳起這個「外圓內方」的全新設計。


比特與原子


最初的 Uber Logo 由黑灰作底,中間是大寫的首字母 「U」,當時它的服務也和配色一樣直接——是一群朋友在舊金山聚集而成的私人租車服務。如今 Uber 已經遍及 68 個國家的 400 余座城市,對 Logo 的重新設計顯得合乎時機。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



新 Logo 中心的方塊代表一個比特(bit)——象徵 Uber 的科技,而底下的色彩與紋路則暗含構成萬物的原子(atom),象徵 Uber 串聯起的人和事物。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



Uber 也配合重新設計了字體,相比原本更聚縮,斜切與增補也加強了辨識度


可能性


「我們在不斷進化,從創始人到整個公司都是,這是重新設計的初衷。」


全程參與設計的 CEO Travis Kalanick,在一篇博文中大談了新設計包含的未來可能性,「最核心就是中間的方塊(the bit),未來其他產品的設計中,都會以此為基礎,辨識度立刻就出來了。」

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



左:乘客使用的 Uber / 右:司機使用的 Uber


「服務於乘客與司機的兩個 Uber 應用,區別只是底色和紋路,這會作為以後推出其他產品的設計框架。」 Uber 如今已經不止載人,他們送起了食物、貨物,以及更多潛在品類。改變的原因也在於此,好的 Logo 絕不是兩三年就需要回爐重造的,而是為未來的可能性鋪路。

2016即將過去,手機上的設計美學發生了哪些變化? 點擊播放 GIF/1539K



11 月的更新中,Uber Feeds 里不止搭車信息,還有音樂、餐廳等,預示非常明顯


差異化定製

2016即將過去,手機上的設計美學發生了哪些變化?



取代原本的黑白設計,新 Logo 暗含的心思複雜得多,紋路、配色都根據不同國家而作了定製。這背後是數月的調研,「建築、布料、風景、藝術、時尚以及人,都是靈感來源。」


愛爾蘭地區的圖案來自喬治亞時代建築和高地大片的綠植;墨西哥地區則啟發於經典的「墨西哥粉」,以及當地特色的瓷磚圖樣;在中國,老式建築的牆磚、窗紋構成了由四個圓交疊成的獨特紋理。

2016即將過去,手機上的設計美學發生了哪些變化? 點擊播放 GIF/632K



愛爾蘭

2016即將過去,手機上的設計美學發生了哪些變化? 點擊播放 GIF/677K



墨西哥

2016即將過去,手機上的設計美學發生了哪些變化? 點擊播放 GIF/450K



中國


Nike+ Run Club | 色彩美學


習慣時間:三個月

2016即將過去,手機上的設計美學發生了哪些變化?



八月底,在跑者中佔有率相當高的 Nike+ Running 突然大幅更新,不僅改名 Nike+ Run Club,界面、Logo、配色、功能一口氣全部大變。暫且不論功能上受到的詬病,僅從設計角度,背後的一番心思就很值得揣摩。


主色


相比 VSCO 和 Uber 完全推翻重來的 Logo 設計,Nike+ Run Club 的變化主要體現在配色上,原本深入人心且一直未變的紅色主調被熒光綠取代,老用戶紛紛表示不適應,App Store 評分甚至一度被「一星」充斥。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



然而 Nike 旗下的應用,又怎麼能脫離 Nike 單看呢?熒光色本就是 Nike 產品的標誌性配色,而提到產品,今年最矚目的自然是 Apple Watch Nike+,此次大更新正是在發布 Nike 合作手錶的蘋果發布會前夕,與同樣熒光色的 Apple Watch Nike+ 統一配色,似乎是為顯示效果鋪墊。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



上:Apple Watch Nike+,搭載全新配色的應用


下:舊版 Nike+ Running,平台為三星智能手錶


界面


今年前的 Nike+ Running,版本更新幅度一向細微,最大改變也只是 iOS 7 時順應了一次扁平化大潮。而如今的改變,背後是搭載平台的進化,原本只需考慮手機屏的表現,如今還需要配合運動手錶的配色、材質,改動有理可循。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



而那些僅在手機上呈現的界面,設計則向極簡靠攏,為的是配合越來越多的功能類型,購物、社群、活動,內容越豐富,極簡的框架越顯重要。


Nike+ Run Club 已經不止跑步那麼簡單


Instagram | 傳承美學


習慣時間:六個月

2016即將過去,手機上的設計美學發生了哪些變化?



Instagram 可能是今年遭受吐槽最多的應用,為此設計主管 Ian Spalter(就是蘋果發布會上演示自拍的黑人小哥)發布了一長篇博客,為看客梳理看似誇張的新 Logo 緣何誕生。


靈感依舊


「品牌 Logo 和產品一起建立與人的聯繫,我們當然不會只為追求革新而去改變。」

2016即將過去,手機上的設計美學發生了哪些變化?



最為人熟知的一版圖標,也經歷了多次修改


Instagram 的名字源於柯達的一款便攜傻瓜相機,最初的 Instagram 圖標也是仿照寶麗來相機設計,直至大眾最熟悉的棕色相機 Logo,始終在設計上保持真切感。「我們當時探索的是如何把它變得更現代。」於是多餘的裝飾被移除,整體也逐漸明亮而扁平。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



新版 Logo 的起草過程


然而「扁平化」實則讓圖標少了相機應有的質感。「因此我們開始研究用戶到底最喜歡它的哪一點。」設計團隊發現原版 Logo 中的鏡頭和彩虹是接受度最高的視覺元素,因此這兩者成了保留和重構的基礎。


兩種延續


Ian 與團隊意識到,他們不能再抓著「相機」不放,而是「需要一個用途更廣、擴展性更強的圖標」——當需要變化的時候,寫實的相機顯然太笨重了。無數版設計過後,最終的成果依然能使人聯想到相機,又為進一步的元素變化提供了前提。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



如果說「鏡頭」是嫁接新舊兩版 Logo 的核心之一,那另一份不容忽視的延續就存在於色彩梯度當中了。「當我們開始想辦法延續彩虹元素,色彩的簡化是繞不過的一步,最終我們決定保留較暖的配色來中和圖形的簡易。

2016即將過去,手機上的設計美學發生了哪些變化?


2016即將過去,手機上的設計美學發生了哪些變化?



取色自原版 Logo 中的彩虹,再經色彩簡化,才得出最終的顏色組合


不止 Instagram

2016即將過去,手機上的設計美學發生了哪些變化?



這張對比圖應該將 Instagram 的另一番心思表露無遺了。旗下應用 Layout、Boomerang 和 Hyperlapse 自此有了與 Instagram 更統一的圖標,帶有相同的線條粗細和色彩梯度。如果說當時的用戶還無法直觀理解,那新設計推出至今,gif 應用Boomerang 的用戶已經超過 4 億的數字足以說明問題,可見設計布局之必要。


編輯: DaJuan


請您繼續閱讀更多來自 ELLEMEN睿士 的精彩文章:

單手跨11度 放空整個世界
說說你的年度辭彙,請你邊吃邊看音樂劇!
別鬧了,侃爺對川普才是「真愛」
呵呵新聞:希拉里的「好夢一日游」

TAG:ELLEMEN睿士 |

您可能感興趣

2017做到這些,你就離生活美學家不遠了
這一場籌備了2500年的美學盛會
175cm曾胖到180斤被群嘲,最後她卻用自己的胖子美學漂亮還擊!
美學|2017最新家裝流行趨勢來啦!
90後央美學生,1秒帶你進入外太空
155cm & 130斤,應該這樣穿呢! | 美學
175cm的她胖到180斤被群嘲,這個大碼模特卻用自己的胖子美學漂亮還擊!
17集超18億播放,單是服裝就高達4000套,匠心打磨造就「孤芳美學」
低調內斂的現代生活美學環球設計1384期
入秋,30套新搭配,夠你用一個月 | 美學
回歸自然的當代美學,有靈魂的現代簡約設計【環球設計1305期】
設計師必去的家居美術館:150萬m2 全球生活美學綜合體【環球設計1498期】
魅藍Note6上手體驗:1099元/驍龍625 | 科技美學首發
100套秋天搭配,照著穿就夠美! | 美學
科技美學測試魅族pro7的p25,跑分70259,p25遭遇瘋狂嘲諷
2018雷克薩斯LC 500,將設計美學的理想照進位造工程的現實
Ins圈粉370萬!胖到180斤被群嘲,這個大碼模特卻用自己的胖子美學漂亮還擊!
當代美學與功能的完美融合,2017米蘭國際傢具展品牌搶先看環球設計1340期
4K工資怎麼漲到20K,十大設計美學原則幫你填滿那16K