從Instagram設計大迭代，看UGC產品的設計哲學

這篇文章來自"ZUO"的UI設計師@le keke ，同濟D&I研二學生，現在德國奧芬巴赫設計學院交換。對國內外的設計有很多思考，歡迎大家關注他的簡書主頁le_keke - 簡書。

相信大家前兩天都被Instagram猝不及防的換標一事刷屏了，一時之間有幾種聲音。

佔主流的是"丑哭，拒絕更新"，還有一撥是在看了Icon的設計師Ian的一篇長博客和兩個視頻之後表示理解和接受，但更多人的態度還是"道理我都懂但我還是接受不能"的冷漠臉。

其實這次Instagram的"變臉"包括兩部分，品牌形象和界面UI。而後者被很多人都忽視了。

在我看來，這次大迭代，向人們傳遞的不僅僅是簡單的彩虹漸變、素雅內頁以及一段設計過程視頻，而是一種設計哲學和它所蘊含的設計價值觀。

不過在聊Instagram之前，我想先聊聊吃。

我們在評價一個菜品的時候，往往會從色香味多個角度去評價。什麼才能稱得上是好的菜品？那一定得聞起來香，吃起來棒，看起來（拍出來）誘人。

而色相要做的好，除了食材調色、火候控制、選擇配菜之外，很重要的一點，就是出菜前的擺盤。

有創造力的廚師，往往能將同樣的成品，擺出極具觀賞性甚至有寓意的盤式。我們看到，一般米其林餐廳用的大都以白色為底色的餐盤，只是在形狀上有所區別。

這是為什麼呢？

因為白色的盤子能最大限度的留個廚師創作的空間、讓食客最大程度的把注意力放在盤中餐本身。如果擺盤也是一種繪畫藝術的話，那麼我想那些米其林主廚們也是希望在一張白紙上來呈現自己的作品。

我們再來比較下面兩種裝果盤的方式。

你會發現，白底裝盤的果盤（上左圖）比起藍色花紋裝盤的果盤（上右圖），更能把你的目光聚焦在水果本身。適當的留白讓水果成為視覺中心，而裝飾的底色則使水果色相有些許黯然失色。

具有裝飾圖樣的餐盤單看具有藝術美感、讓人賞心悅目。但與其說它們是承托菜品的餐盤，不如說其本身就是一件視覺飽和的藝術品。所以當真的放入菜品時就喧賓奪主了，讓真正應該是中心的菜品相形見絀。

而回到Instagram這件事來，所以如果說用戶拍攝的照片、視頻，訴說的故事是繽紛的菜肴，那作為平台和軟體就應該儘可能地退居末位到毫無風格（甚至拋棄品牌主題藍色），猶如簡潔到無以復加的白色餐盤，用最謙卑的狀態承載最多樣的內容。

這就是所謂的「半滿」設計哲學。

一杯滿水，如果容不得更多的東西再加進來，結局就給定了，包容性收到必然性的限制。反之，適當地留出空間，能在不同場景下、不同對象角色下碰撞出不一樣的故事。

同樣，我們也可以從日本生活哲學中的「物的八分目」來理解。

物的八分目就是設計師在做設計時，考慮到做所有東西都要把握一個度。產品不能做太滿，只是做到一個量，剩下那個量是靠用戶，靠使用的人去填補的。

線圈筆記本的八分目，適當減少了線圈的數量。

不一樣的人，在不一樣的場景下，這二分目是完全不一樣的。八分目加上二分目，得到十分目，最後產生的故事才是最完整的。

在我看來，對於一個主要依賴用戶生成內容（UGC）的產品或平台，內容才是核心，才是視覺中心，產品（物）和用戶（用戶創造的內容）之間不是競爭關係，此消彼長，而是包容的有機關係，甚至不是二八分的數學等式，更是一種化學作用，一份的合適設計，不但能吸收九份的內容，更能放大這九份到更多。

我們可以在Instagram的官方博客中看到類似的設計初衷：

"The simpler design puts more focus on your photos and videos without changing how you navigate the app."

同樣在新上線的產品中，我們也可以從不少細節里，看到這一設計哲學的外在表現。

首先，頁面控制項幾乎都拋棄了過往的主題藍色，而換成了色彩體系中最中性、低調的黑灰白三色系。這一舉動其實很大膽，因為Instagram藍更多已經成為品牌，給用戶留下了很深的印象了，就如同Airbnb的紅，Twitter的天藍一樣。

人們總說黑灰白百搭，其實本質上的原因是它們在所有的顏色（有色相）面前都扮演著襯托、承載的白色餐盤作用，點亮的是那些主題色；

來自產品截屏界面。

色彩繽紛的圖片和簡潔素雅的底色界面，又何嘗不是白盤托水果的另一種詮釋呢？

其次，由於主題藍色的消失，過往推送的橙色標籤，也換成了最保守的紅色。

推送樣式變化，來自產品截屏界面。

一方面是藍色的消失，拆散了藍橙這對天然撞色的組合，再使用橙色就會些許雞肋，甚至成為白底餐盤中的奪眼花紋；

另一方面既要做到最退居末位，又要不失基本功能，基於紅色作為警示和提醒在手機界面中已是用戶識別和學習成本最低樣式的規則，最後選用了紅色。

再有就是具有鏈接的標籤字樣顏色也發生了變化。

這一點可能察覺的人不多。我們來看一下，新版本中顏色要比舊版本的更深，更接近藏青，甚至不注意會和黑色的正文或用戶名混為一體。

標籤字樣色彩計劃的改變，來自產品界面截圖。

當然這樣做也是基於Instagram長期積累的用戶操作習慣，用戶已經習慣看到@或＃就知道是鏈接了，所以才敢於進一步將內容以外所有的元素儘可能地降低它們的視覺地位。

用戶創造內容（UGC）的平台或工具，所有的設計都應該圍繞關注內容、更方便、低成本發布內容、傳播內容、管理內容的方式來設計，而不是在設計上過於搶戲。

同樣不光是形式上需要做到這點，在交互邏輯也是如此：用最低學習成本的交互設計（也就是不設計，比如用iOS原生交互和界面樣式的whatsapp和微信）做到退居末位，給用戶使用減少最多的障礙，換言之也就是留下最多的空間，就是那物的八分目。

曾經一個人拿了一杯橙汁，問人家，這是什麼。別人回答：「橙汁。」

這個人又拿了一杯油，問人家，這是什麼。回答：「油。」

於是他又拿了杯可樂，問是什麼。回答：「可樂。」

最後這個人把杯子倒空，再問是什麼。得到的回答是：「杯子。」

而杯子在之前三次都同樣存在，卻不曾被提起。

想必這就是Instagram希望做的事。

網站：http://zuodesign.cn

公眾號：ZUO設計（ID：zuodesign2015）