一場誤打誤撞的產品之旅

引子

9 月份去參加了一個關於產品的沙龍，一開始主持人就讓咱們在座的全部人一 一 作一下自我介紹，關於姓名、職業、性格特色什麼的，頓時以爲這是一個好惡俗的開場，好吧，自我介紹開始了，聽完一輪又一輪的介紹才發現原來在座的大部分人都是剛入產品經理這行（包括我在內），並且有一部分人職業經歷很豐富，好比之前是作硬件的、軟件的、銀行財會的、銷售的、傳統行業的等等，有的甚至轉行不少次！這着實讓我有些吃驚，這些人竟然有這麼大勇氣去挑戰本身！做爲一個一直以來從事設計工做的人忽然要開始從事產品領域的工做確實讓我壓力山大，不知道如何作好這份工做，相比較他們我可能不足以叫挑戰，至少我一直從事互聯網行業一直和產品經理打交道，突然間想一想以爲一切也不那麼困難了，因而更堅決了個人產品之旅。

本來覺得我是來作設計的

7 月中旬進入 coding，boss 張跟我說我將負責移動端的產品，我當時頗爲驚訝，我不是來作UI設計的麼，難道沒有產品經理麼，或者交互設計師？boss 張說沒有，他但願你能承擔產品經理和設計師的工做。我當時快嚇尿了！之前都是產品經理給我產品需求文檔和原型設計圖，如今是合二爲一我來主導我來實現，感受身後的責任變得更重了，做爲一個爲未知充滿好奇的人，我欣然接受這個挑戰。

那麼如何規劃 Coding 移動端產品？

1. 首先要要了解 coding 是什麼樣一個網站

Coding 是一個面向開發者的雲端開發平臺，目前提供代碼託管，運行空間，質量控制，項目管理等功能。Coding 提供社會化協做功能，包含了社交元素，爲開發者提供技術討論和協做平臺。

不難看出Coding的定位很明確，使用人羣是開發者，主要功能是雲端開發和項目協做，因此這也讓它區別與 Github、Gitcafe 等代碼託管網站。

2. 移動端需求分析

根據 Coding web端的產品，那麼移動端的又有怎樣的需求呢？後來經過討論，Coding 大部分的程序員更但願是能儘快實現用手機發冒泡，小部分人以爲有項目管理的功能也不錯，要是能預覽代碼就更好了！若是隻作冒泡功能那就純屬作一個社交軟件，不符合咱們產品的初衷，但把他做爲一個特點功能來推是一個很好的點。

因而咱們肯定了要作：項目管理、冒泡、私信、我的中心

起初消息是設計在我的中內心面的，緣由一是私信在網頁的佈局形成其操做和瀏覽方式不太流暢，二是普通用戶對私信的需求不大致使其利用率不高。但私信做爲團隊協做必要的溝通工具，在網站上它是設計在左側的一級菜單裏面的，說明它的位置是舉足輕重的，因而矛盾就產生了，怎麼辦？這個時候就須要一個小組討論，boss張的建議也是但願把私信放在一級菜單裏面，他天天都會手動發20多條私信，有些問題必須私下去解決，好比有些bug反饋啊，功能諮詢啊，活動諮詢什麼的等。起初通知是設計在首頁頂部的，但思來想去以爲不合適，後來參考了微博的作法把通知和私信整合在一塊兒，變成實時消息。既解決了通知位置的問題也大大提升了私信的曝光度。如下訪問路徑圖片就能看出，消息的頁面訪問率是僅次於項目和冒泡。

3. 移動端產品定位

既然肯定了作項目管理（簡單好用）和社交（好玩有趣）兩大元素，那麼咱們的產品就能夠定位爲：

一款專爲程序員使用的簡單有趣的團隊協做工具
使用人羣：程序員
主要功能：團隊協做
產品特點：簡單有趣

原型設計階段

第一次用Axure畫原型圖，學了半天不到就會了，整理產品的流程圖和交互實際上是纔是最複雜的，下面是Coding icon 1.0 原型圖：

效果圖設計階段

網站大量選用的黑白主色，點綴色是玫紅、button 綠、連接藍，爲了和網站視覺保持必定的一致性，客戶端依然保留黑白主色，選用了玫紅和綠色做爲點綴色。整個界面屬於扁平式的設計，清晰簡潔易於長時間瀏覽。

成果檢驗

理想很飽滿顯示很殘酷，因爲種種緣由，實現出來的界面並無達到預期的效果，尤爲是安卓客戶端的效果，就以下圖：

即便這樣，咱們也不能唾棄它，它畢竟也是咱們一手拉扯大的，要善待它，好好打理它，終將有一天它會變得熠熠發光！

總結

最後總結一句話，嘗試着並努力着去作一件有意義的事情是多麼的讓人開心，我想我能堅持！

Coding 官網技術博客: http://blog.coding.net

【Coding 官方技術博客是 Coding 內部小夥伴在平時的工做學習過程當中關於技術、產品、設計等等方面的積累和分享，但願你們共同窗習共同進步!如轉載，請註明出處與做者，謝謝!】