原文地址：Finding Clarity and Energy -- Learnings from redesigning Asana
原文作者：Vanessa (Designer @Asana)
譯文作者：janepi
作為一名設計師，本來創(chuàng)造是一件讓人興奮的事兒，但有時改版真是會讓人想到fxxx那個詞。不過我們的產(chǎn)品Asana，受到了萬千用戶和團隊的喜愛，所以想到要改變現(xiàn)狀還是有些小擔心。
不過當我們發(fā)布全新Asana的時候，所有的害怕都煙消云散，走過的路也都一一驗證。盡管回顧來看有些東西可能是顯而易見的，但是貫穿整個流程，還是遇到不少挑戰(zhàn)，因此項目才能順利進展，讓我們的想法得以實現(xiàn)。
以下是10點我從這次改版中收獲的內容。如果我們還要再一遍，我也會充分利用這些原則來進行反思。
做好長期投資的打算
當我們打算改版的時候，這個事情并沒有很著急，但是我們深知這次改版將是重中之重。當時我們都能強烈感受到，如果我們現(xiàn)在能慢下腳步好好構思，未來我們節(jié)奏一定是越來越快。所以我們從網(wǎng)站和App的視覺和結構的全面梳理做起。通過確定改版的優(yōu)先級，我們相當于是對未來做了長期投資，并且在設計價值上壓了一個大賭注。
我們開始想象，Asana以后會變得特別易用，并且用戶會想很多花時間用Asana。
關注一個最高目標
為了更好了解我們的挑戰(zhàn)所在，我們傾聽了用戶的聲音。以Simone為例：她很喜歡Asana，因為功能非常強大。作為一個施工項目經(jīng)理，Asana對于她組織所有事情非常關鍵。哪怕是多一個水管對于她來說也會讓人喘不過氣；她所需要的就是能看到所有未辦事項然后標記完成。
「清晰」成為我們的最高目標，而且我們都基于此做決定?！氨M可能清晰”這個目標為我們指明了方向。每每在不同的設計方案上猶豫不決的時候，會有一個聲音默默在告訴你“選那個最明白清晰的”。
盡管選擇一個清晰的目標聽起來很簡單，執(zhí)行起來可不容易。為了能夠聚焦于這個目標，我們必須對很多好的想法說“不”。但是最終，明確的目標讓我們整個團隊都保持一致，后來哪怕再艱難我們也很快做出決定。
廣泛探索，關注重點
在一場“改版馬拉松”中，我們整個產(chǎn)品團隊的日程都消滅干凈了。每個人都在過程中分享他們的想法，然后互相借鑒。我們像其他設計團隊一樣喜歡構思發(fā)散的階段，就像完全開啟了夢想模式。產(chǎn)生了各種想法之后，我們就能看到主題慢慢浮現(xiàn)出來，以及能讓我們興奮起來的想法。
嘗試過各種瘋狂點子之后，我們開始確定主要的關注點。弄清楚起點很重要，免得方向太多。之后我們就再次進入發(fā)散構思階段，不過這次圈定在一個更小的范圍內。
我們旨在創(chuàng)造出全新的頁面結構、布局并提升導航欄。我們時刻記著我們所向往的愿景本質，并且以此來提醒我們所追求的目標。
定義清晰的成功指標
我們在一開始的時候就設定了成功準則。我們建立了核心的協(xié)作指標，追蹤核心活動例如評論任務。如果這些指標上升，說明團隊協(xié)作更多了，而且用戶使用Asana來成功處理事務的可能性也增加了。我們每發(fā)布一次，我們都能看到指標的變動以及改版的效果。
逐步發(fā)版也不錯
很多公司發(fā)布改版就像大爆炸一樣隆重，我們卻決定小步慢跑。所以每次的改變看起來并不是很明顯。因為我們想慢慢揭開我們的偉大愿景，所以我們一開始就摒棄了一次性推出所有改版的想法。
不過我們聰明的產(chǎn)品經(jīng)理建議我們可以選擇一個大致的方向，不用太嚴格一定要一個完美的方案。通過一次次發(fā)版，我們能收集到更多的信息來指導我們做更好的設計，可能比我們最初設想的還要好。
因為我們都達成一致要在用戶反饋中迭代，不斷改進，所以面對未知也沒那么害怕。我們每次都可以很快針對每個小模塊進行設計，拿去測試，然后進行發(fā)布。
首先，我們改進了導航。
當我們觀察用戶使用產(chǎn)品的時候，他們經(jīng)常很困惑到底應該去哪兒、怎么瀏覽頁面。為了讓導航更清晰明確，我們加入了一個頂部攔，保證它明顯可見。
「+」按鈕把一些重要功能都前置了。他們不再被隱藏在特定的模塊內，而是放到了頂部層級，所以有什么想法可以立馬操作。
為了讓用戶更容易使用，我們探索了側邊欄的多種分組內容。我們單獨測試了第一個版本，通過反饋發(fā)現(xiàn)它可行和不可行的地方。這樣我們就知道在大型發(fā)版前如何對它進行重新設計、優(yōu)化。
然后，我們設計了一個更清晰明了的頁面布局
新的屏寬頭部設計呈現(xiàn)出更清晰的層級結構。tab通過可擴展的布局展示出了額外內容。
屏寬頭部也可以讓下面的內容更加靈活。盡管日歷模塊占用了一個大面板，對話模塊可以用卡片的形式插入進去。這樣就允許在既定的柵格系統(tǒng)之上運用更加流動的布局。
當一個項目變得越來越復雜時，布局也可以無縫擴展，比如有些狀態(tài)更新的高級功能也可以含進來。
結構慢慢定下來的時候，我們對于這次改版已經(jīng)有了充分的信心。相比結構的慢慢迭代，我們計劃將全新視覺體系上來個驚喜大曝光。對字體和顏色單獨進行變化沒有多大意思；這次我們要讓整體分數(shù)超過各項的總和。
時刻記住和回顧你的目標
當考慮視覺設計要配合品牌升級的時候，我們重新回到目標上。為了「盡可能清晰」我們舍掉了多余的元素，取而代之的是一塊白板。在探究什么顏色比較適合的時候，我們想到用顏色來強調關鍵動作和重要瞬間。這樣當用戶完成任務、進行協(xié)作和慶祝團隊成功的時候，這些顏色可以特意彰顯出那種能量迸發(fā)、活力四射的感覺。“清晰和活力”成為了我們視覺呈現(xiàn)的目標。
活力四射的顏色
我們告別了過去的老舊藍灰，迎來了充滿活力的新色板。我們在確定顏色之前看了很多不同的色系和組合，期待找到能清晰傳達含義、搭配協(xié)調并且能表達出品牌富有能量的顏色。
產(chǎn)品中的顏色其實目的性很強，可以幫助提供一些暗示。比如珊瑚色代表創(chuàng)造，藍色代表行動，綠色代表完成。
集中內容
我們增加了留白，這樣用戶能更愉快地專注于讀寫體驗，哪怕有很多其他內容在頁面上。
新的字體在增加排版對比的基礎上能更加凸顯重要的標題。
之前的空白狀態(tài)就是無聊的空白，不過現(xiàn)在他們能給到一些當下有用的信息，也變得更有趣了。
給系統(tǒng)建立規(guī)則
為避免無限期的迭代，我們搭了一個框架把一些想法轉變成了既定的模式。
我們把最初的原型、已發(fā)現(xiàn)的模式都鋪在這個框架里，然后抽離出樣式進行“鎖定”。在解決剩下的問題時，我們把這些基本素材記錄在樣式指南中。記錄的時候我們也仍然在不斷推動著一些想法。
鼓勵團隊間的互相輸出
因為我們追求的是讓Asana的每一處的體驗都一致，所以我們把所有設計師從他們的工位叫到一個別致的公共區(qū)域。比如，我們的移動設計師要想法設防把新的色板從網(wǎng)頁嫁接到移動端上。
團隊一定要齊心協(xié)力才能達到這種自然的過渡和體驗一致性。
清楚你已經(jīng)完成了
努力沖向最終的完美是很吸引人的一件事。但是我們必須要定義下來什么算作真正完成了，并且保證每個人都100%對成果負責。
設計上的妥協(xié)是無法避免的。有時候就像是一個線頭能把一個完整的壁毯全部拆掉。這其實需要我們有心去考慮全局，然后接受一個事實，那就是有些細節(jié)確實無法做到我們設想的那樣。沒什么大不了的！
設計產(chǎn)品就像一次旅行，發(fā)布日期不過就是就是旅途中的某一步。在過程當中踏實做事，而不是一心只想到結果，能夠讓我們知道什么算真正的完結，這樣我們才能把我們的努力成果分享給全世界的朋友。
回顧……
感覺這次改版中我們做了將近100萬個決策。但是我知道最糟糕的其實是深陷恐懼，從而無法做出任何決策。只要你還在不斷推動項目，你會收獲很多，然后慢慢靠近你的最終目標。
總之，每次改版都能延展出來一個故事。我們的故事能得以展開，是因為團隊的每個人都享受著緊密合作的瞬間，并時刻關注于我們的最終目標。
作者在原文中的回復摘要：
- 關于改版時間線：整個過程大概花了1年的時間。我們的工作一直在穩(wěn)步進行。有些設計師和工程師有時為了權衡其他的項目可能會偶爾參與到這個項目。我們有集中的設計沖刺階段、原型探索階段和用戶反饋階段。
從去年（2014年）10月開始做概念原型。然后花了好幾個月的時間設計導航細節(jié)和微調布局。工程師在實現(xiàn)那些微調的時候，設計師就在同步修改視覺部分——我們花了一個春天的時間。最后2個月是完成前的大沖刺。當樣式指南基本上完成的時候，團隊中的5個工程師在7月末的時候開始重新給app“換膚”，然后在9月末的時候正式發(fā)布。
</br>- 補充其他細節(jié)：我們有個小而精的團隊，這次改版是大家充分合作的結果。
我們的6個產(chǎn)品設計師都參與到了改版中。在某些方面特別擅長的設計師會專注于比如像移動端模式和圖案設計這樣的領域。3位產(chǎn)品經(jīng)理幫著推進項目的不同階段。一位原型設計師幫忙負責所有的交互細節(jié)。我們在項目的每個階段都有3-10位工程師參與，這樣我們就能在項目中游刃有余。還有一個插畫師、動效師和傳達設計師在推廣方面添加了一些有意思的產(chǎn)品細節(jié)。公司里的各種團隊都在盡可能地支持著這次改版。
本文是原創(chuàng)譯文，轉載請注明出處，謝謝。
