2019-7-26 資深UI設計者
如果您想訂閱本博客內容，每天自動發到您的郵箱中， 請點這里
這是一個移動端的時代，Twitter 的移動客戶端經歷了很多版本的迭代，但是桌面端的更新改版則非常的克制。一周之前，Twitter 將接近7年未曾大幅度改版的桌面端頁面，從里到外重新翻新了設計。
新浪微博的每一次小幅度調整都會帶來大量的吐槽和不適，更不用說像Twitter 這樣的世界級的社交媒體網站。用戶的不適應不理解和負面反饋是避免不了，這樣的大幅更新改版背后，有著這個平臺不得不做的理由。
最近 Twitter 新版背后的設計師接受了連線雜志的采訪，深入地聊了一下改版背后的考量。
設計技術和工具的快速發展，視覺設計本身，尤其是 UI 界面的很多具體的執行端的工作慢慢的沒有那么麻煩了，但是找到為什么這么設計的設計決策，并不是那么簡單。
在整體視覺風格上，Twitter 桌面端的設計給人的整體感知是更加現代的——并且和移動端版本的設計靠近且保持了一致。這絕對是一個以數字產品為核心的科技公司應該做到的最基本的事情。
原本置于頂部的導航欄消失了，功能性更強的左側邊欄承載了主要的導航功能。
其中，原本被隱藏的「書簽（bookmarks）」和「列表（LIsts）」是非常實用的內容管理功能，在這次改版的時候被直接顯示在側邊欄當中。
而更重要的改變在于，關于當下正在發生的熱門事件，單獨占據了右側的側邊欄「Trends for you」，大家正在熱烈討論的熱門事件以Twitter 中標志性的標簽（Hashtags）的形式呈現，相當于微博中的「熱門微博」。而這在老版的 Twitter 中，這類內容的存在感并沒有那么強烈，原本存在于第一屏的左側側邊欄中，并且只有標簽，除非你有意識地去關注和點擊，否則很容易錯過。
搜索欄同樣被挪到了右側邊欄，置于「熱門趨勢」內容的頂部。這一設計巧妙的地方在于，它暗示了內容呈現的邏輯：當你搜索內容的時候，搜索結果會直接覆蓋在右側，而不會占據中間的主要的信息流。
毫無疑問，新版的 Twitter 在布局上更加扁平了，但是信息的扁平化呈現還不止布局上，交互上也相應的變化。在老版的 Twitter 中，當你點擊具體的推文條目的時候，內容會以彈出框的形式呈現，但是新版中則會在當前層中直接擴展開顯示，不會彈出，整體的融合感和有機感會更強。
老版 Twitter 中推文彈出框
新版 Twitter 中的界面
同樣的，用戶在回復、轉推和點贊的時候，也不用在不同的彈出框模式下進行，而是更加直覺地在當前的頁面中完成，整體感更強，更加直覺。
用戶交互頻次相對較高的轉贊評和「熱門」和主要信息流都不會在彈出框和疊加層控件中完成了，主要信息流也不會被因此而覆蓋，整個 Twitter 因此顯得更加敞亮開闊。
另外一方面，新版 Twitter 提供了更加豐富的個性化設計的體驗，這也是對于 Twitter 用戶體驗的一次重要提升：
雖然在之前老版的 Twitter 中也可以定制字體大小色彩，但是之前的字體大小是純粹的隨意設置，這種自由度讓很多并不熟悉的用戶難以控制好文本和色彩的對比度，從而造成了整體視覺的愉悅度較低的情況。
新版中的配色和字體大小都是經過調校之后，比較合理的選擇，這樣擁有了足夠的選擇空間，又保持了整體視覺體驗上的愉悅性的設計。在產品顆粒度的控制上，Twitter 有著一套成熟精準的設計方案。
與此同時，所有人都期待的，深色模式，同樣隨著這次頁面重設計，一并打包更新了：
對于深色模式的控制，Twitter 和和其他的平臺略有一點不同，他們所設計的深色模式包括「昏暗（Dim）」和「熄燈（Light out）」兩種，前者的背景色是深灰，而后者則幾乎是全黑。
任何一個社交媒體平臺，大量的用戶涌入進來之后都會面臨著復雜的管控問題，更不用說 Twitter 這個已經存在了13年的世界性的平臺。許多狀況不可能簡單的一刀切來解決。
作為平臺，Twitter 已經在竭力推動「健康的對話」，但是在充滿分歧和對抗的網絡當中，情緒化是常態，簡單的依靠 Twitter 官方的帳號來發聲，并不足以覆蓋如此廣泛的垂直領域和復雜多樣的用戶群體，以及不同的國家和地區。
「我們以前經常會推出一些新的設計和小功能。上線之后，過一陣子我們再搜出來，用投影儀投到墻上重新審視，」Twitter 的聯合創始人 Biz Stone 說：「然后我們會覺得，好像不應該這么設計。」
「我們的目的是為公眾的對話來服務的。但是目標明確之后，還需要問一個問題：我們真的夠好嗎？」Biz Stone 在采訪的時候，這么說道。正是在這樣一個問題促使之下，Twitter 的改版重設計就悄然推動起來了。
從左到右分別為 Biz Stone，Bryan Haggerty 和 Mike Kruzeniski 。圖片來自 Wired，攝影師：Samantha Cooper
Twitter 團隊對此選擇了謹慎行事。他們選擇了類似灰度測試的方法，讓不同的用戶參與到不同的「測試」當中來，包括不同的書簽模塊的設計，不同的深色模式，不同的搜索模式，等等。絕大多數的設計都正面的，但是它們也并不是爆炸性的。
如今所呈現出來的新版頁面當中，絕大多數的設計都克制而微妙，以往的很多功能都得到了簡化。「我們正在試圖尋找合適的機會，重新創造更加大膽的設計，但是它需要一個穩固的基礎，所以我們打算從這一次的重設計開始，從我們最好的功能和服務開始。這就是基礎。」Twitter 的高級產品設計總監 Mike Kruzeniski 面對連線雜志的采訪，是這么解釋他們設計的初衷。
所以，Twitter 的這次重設計只是一個開始。對于這個平臺上大量的關于仇恨和騷擾相關的負面內容，清理起來并不是一套規則就可以全部解決的，而 Twitter 更傾向于人為來處理和干預，但是平臺本身需要更好的支持這方面的功能。
在 Twitter 早期階段，視覺設計并不是他們的重心。「我們只是盡全力地讓產品具備可用性，」Stone 回憶當時的情況：「我們并沒有試圖讓它看起來好看……我們只是努力讓平臺保持活力。」當時的 Twitter 整個團隊大概只有30個人。
實際上，隨著后面更加專業的 UI 設計師加入進來之后，整個團隊的設計能力也越來越強。UI 界面是Twitter 和用戶進行溝通的媒介。
雖然現在是移動端為主的時代，但是桌面端 Twitter 的重要性并沒有弱化。Twitter 的網頁重設計項目的負責人 Jesar Shah 說：「人們在桌面上大量使用 Twitter 來搜尋感興趣的信息，跟他們息息相關的信息內容。」在頁面的左側，有一個快速的賬戶切換的功能，對于這一點，Shah 補充道：「圍繞這個功能點，我們從全球不同的地方獲得了反饋。比如日本就是Twitter 最大的市場之一，當地用戶基于自己不同的興趣點創建的賬戶，比如一個賬戶專門是關于美食的，一個是專門關于旅行的，還有一個則是給自己的寵物貓的。無論你使用哪個設備，都要能夠快速便捷地切換帳號，這是我們這么長時間的調研中，聽到最多的一個需求點。」
從左到右分別為 Ashlie Ford，Marina Zhao 和 Jesar Shah ，她們主導了這次 Twitter 的設計。
「我們需要確保整體體驗足夠優秀，所以原則上需要嚴謹。鑒于我們服務對象是全球客戶，所以我們需要盡可能滿足不同用戶的訴求。」Shah 和 Ford 所帶領的團隊專門創建了一份調查問卷，以獲取反饋。他收到了來自全球總計20萬份問卷，Ford 的團隊花了整整一周的時間，借助翻譯工具將其中來自非英語國家的問卷都翻譯出來，并且梳理匯總了。
「用戶肯定會以為我們不會仔細閱讀這些問卷，但其實我們都仔細閱讀過了。」Shah 說道。她閱讀到的第一個用戶需求反饋就是想要更多的表情符，為了應對這樣的需求，Twitter 制作了一個分組表情輸入控件。同時，他們還提供另一個不斷更新的熱門 Gif 圖片表情合集，非常貼合用戶需求了。
Twitter 已經 13歲了。
在 這個社交媒體平臺上，@realDonaldTrump 可以進行「Twitter 治國」，還有大量的流言和不真實的信息，騷擾和不夠人性化的內容。這都是客觀存在的，亟待解決。在今年年初的時候，策展人 Chris Anderson 將 Twitter 比作是正在撞向冰山的泰坦尼克號。的確如此。
但是，設計改變不了一切。Twitter 的設計團隊在接受采訪的時候也坦誠地接受了這個事實。但是他們認為，設計可以幫助他們界定和構建 Twitter 功能，并且逐步地幫助用戶來解決身份認同的問題。
「如果你在 Twitter 上問一個用戶，Twitter 是什么，你會得到一千個答案。」Kruzeniski 說：「曾經我們認為這樣很糟糕，但是現在我認為這是一個很棒的事情。因為現在我們可以更好地幫你找到特定的興趣，并且和你的興趣、你所關注的主題連接到一起。」
曾經的推特是一個鋪滿木地板，到處都是品牌標志性藍色的「鳥籠」式的建筑，但是如今重新裝修過的辦公室則更加現代，墻壁上到處是各種各樣的涂鴉，這些涂鴉代表著Twitter 這個平臺內的各種垂直社區，比如 Black Twitter、NBA Twitter，以及各路名人的粉絲社區。
走過Twitter 的辦公室，你會清晰地收到這樣的一個信息：一切都是關于人的，而不是產品。
藍藍設計( m.paul-jarrel.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。