我們是如何重新設計FOURSQUARE的

 

　　最近我們發布了最新版的Foursquare，這是一個重要的裡程碑。為了完成這一版的APP，我們仔細打磨，用心設計，加緊開發，現在你已經可以下載了。這次開發的經歷非常難得，為此我將這次重新設計開發的過程全部記錄下來，分享給大家。

　　今年早些時候，我們開始重新審視我們已經取得的成就，在技術上的驚人積累。Foursquare 讓朋友們保持聯系方便碰頭，幫用戶找到目的地，為此我們想盡辦法來迎合這兩種用戶需求，讓功能相互補充。然而隨著時間的推移，用戶的需求有了變化，大家期待更好的個性化搜索體驗，去哪兒都簽到已經過時，在私密和個性化的大環境下越來越多的用戶沒有過去那麼願意共享位置。

　　深思熟慮之後，我們認為是時候采取下一步行動了，將現有的產品一步步自然地分離，根據品牌特征、營銷、功能集和接口，將現在的Foursquare分解成能承擔不同需求的獨立應用程序。

　　於是我們列出了所有問題和解決方案，並將項目命名為“蝙蝠俠和羅賓”，這兩個名字將成為未來兩個不同APP的內部代號。未來的Foursquare的代號是“蝙蝠俠(Batman)”，而分離出來的新應用Swarm的內部代號是“羅賓(Robin)”。

　　新版Foursquare最初的白板草圖

　　分析、線框圖、原型以及報告

　　在我們的研發團隊同外部的參與者一同進行探討和研究的同時，設計團隊也在觀察和分析，哪些地方做的好，哪些部分還不夠成熟可，可以做的更好，並且開始為新的Foursquare設定全新的風格。在探索設計風格的早期階段，我們將理想中APP應有的特性都標注在Moodboard上。在我們的設定中，新版Foursquare應該智能而實用的，神奇而充滿樂趣，值得信賴的。所以，設計團隊試圖在配色方案上做了一些更有趣的嘗試，並且為APP的導航模式和信息架構的設計奠定了基礎。

　　在最開始的日子裡，我們花費了大量的時間進行討論，繪制新版Foursquare的草圖，調整線框圖和原型。我們定期與利益相關的組織機構碰頭，展示新版的設計進度和調整的細節，細化想法，在碰撞中盡可能融入大家的想法和感受。在不停的取捨中，我們會精簡掉90%的想法，絕大多數創意並不會長久的留存。

　　有時候，這樣的事情很難接受。我們兢兢業業地設計，探索，很多創意都經過反復的推敲，但是最終僅有那些最佳的創意能夠打破層層壁壘，保存下來。

　　我們做的第一個大項目，是快速構建一個可用的Android版APP原型。我們都覺得這是一個非常不錯的方向，即使這個原型還相對粗糙，尚需打磨。讓用戶與這個可交互的早期原型進行互動，我們從中所獲得的數據和經驗是非常寶貴的。在這個過程中，我們發現了新特性和用戶體驗設計中所潛藏的問題，尋找答案，評估不同的解決方案的有效性，並完善這個早期原型。

　　我們將用研的結果與我們的初步設計和假設結合起來，通過多次的迭代之後，逐步完善。在這個過程中，設計團隊還借助Sketch和Keynote，web版的原型等工具，將產品所有的特性都展示在所有員工、研究參與者面前，一同探究最佳方案。這樣的會議我們進行很多次，直到我們將整個APP磨合到最佳狀態。在產品發布之後，我們依然會繼續這樣的會議，打磨產品。想到就去做，我們絕不會讓設想僅僅停留在大腦和討論中。

　　fsBatmanWatermelonColor, fsBatmanNavyColor

　　品牌重塑

　　剛開始的時候，我們原本打算為Foursquare更名，但是隨著產品的改進和應用程序的調整，並沒有這麼做。不過在這個過程中，Foursquare有了新的Logo，舊的Logo使用了地點簽到標記的符號，而單純的字符Logo又仿佛是上一個時代的遺物，所以，新的Logo將兩者特征結合起來，直觀而富有意味。新Logo設計出來之後，也讓我們自己振奮了起來。借助於辦公室牆壁上的MoodBoard來設計新Logo，這個過程非常有趣，令我們獲益匪淺。

　　早期的視覺設計和用戶反饋便利貼

　　永無止境的視覺設計探索

　　在這裡，專精於信息架構的專家，用戶體驗設計師，平面設計師，品牌推廣專家，視覺設計師，交互設計師等不同領域的設計師和專家為了新的Foursquare傾力合作，這個團隊是不同凡響的。在探索過程中，我們試圖探索更加廣闊和不羁的視覺設計，在足夠豐富的可能性之下，再逐步收縮，並且落腳到更容易被大眾接受和熱愛的視覺形象上。這需要大量的時間，並且在過程中會衍生出許多版本。

　　這是一個無比充實的視覺設計探索過程

　　一旦我們敲定了某個新特性，或者將某個復雜的區塊軟化，便開始著著手為它們設計視覺系統。這個設計過程會起始於之前的風格指南，它涵蓋了幾乎所有的方面，包括色彩、形象、樣式、圖片的使用規范，以及按鈕和組件的使用方法。在這個堅實的基礎上，視覺系統的設計不會失控，步調會保持一致，不同設計師在處理APP不同部分的時候，會更加協調而高效。

　　當我們開始為整個APP的色彩進行設計的時候，我們為重構品牌而設計的配色方案就開始發光發熱了。簡單的碰撞之後，大家都愛上的西瓜粉這種色彩，同時，我們之前努力搜集起來的數據也派上了用場，它們可以幫設計師來規避潛藏的問題並且完善設計，新版Foursquare的風格口味就是這麼得來的。從此，用戶在設定口味和個性化的時候就有了足夠獨特的方案選擇，並且可以快速地完成搭配。用戶為何能夠快速尋找到他們想要的東西呢?因為方案本身就是為他們量身定做的!

　　像這樣的大型項目到最後階段總會有陣痛，大家會感到興奮，焦慮，緊張，也會激動。這些情緒我們全都經歷過了。為了讓Android和iOS版的客戶端能按時上線，我們花費了大量的精力來關注產品的細節。我們傾注了所有的心血和靈魂到兩個版本的客戶端中，這幾乎是我們團隊協作之下的巅峰之作。

　　過去的8個月裡的經歷，現在回首看來是非常難忘，極其好玩的。我們每個人傾注其中的心血，最終成就了產品，並且轉化成了實實在在的收益。不得不說，這是Foursquare的新的開始。

　　在去年的12月10號的公司例會上，我們展示了一個PPT。在PPT上，我們說了，如果新的產品不能讓我們抑制不住地興奮，它就不用發布，無需上線。今天我們終於可以暢快地使用它，我們整個團隊都為此激動並且堅信它會成功。