以下就是我13年大二暑假做的項(xiàng)目，第一個(gè)獨(dú)自設(shè)計(jì)開(kāi)發(fā)的Android應(yīng)用－－CoY。

想起當(dāng)年的生活也是挺苦的。那是廣州最熱的時(shí)候，每天待在宿舍里除了敲代碼外就是做設(shè)計(jì)。還記得有一天晚上熱得要命，開(kāi)著風(fēng)扇也睡不著，12點(diǎn)躺在床上渾身大汗，洗了個(gè)澡到了2點(diǎn)還是睡不著，4點(diǎn)再洗了個(gè)澡，6點(diǎn)被熱醒后又洗了個(gè)澡后就起床干活了，那天我真的哭了，因?yàn)檫@生活真的太苦了，關(guān)鍵是自己逼自己。

這個(gè)應(yīng)用的誕生是有一個(gè)挺可悲的故事的。曾經(jīng)在校道上我碰見(jiàn)了一個(gè)非常清純的妹子，每次都是單身一人和我在校道上擦肩而過(guò)（肯定沒(méi)有擦肩orz但想不到其他詞了），我一直在心里問(wèn)這妹子這么漂亮肯定有男朋友吧，如果沒(méi)有的話我就應(yīng)該勇敢點(diǎn)搭訕…結(jié)果就這樣過(guò)了一年多…就在我大二生日那天，我突然發(fā)現(xiàn)這妹子牽著一個(gè)男生的手…而且這男生比她還矮…好吧…這外貌…h(huán)ehe…當(dāng)時(shí)我就真的懵逼了，莫名的怒火涌上大腦，媽的早知道我就該早點(diǎn)搭訕了，估計(jì)也輪不到這兔崽子。就是因?yàn)椴恢琅裼袥](méi)有男朋友，所以一直沒(méi)敢向前，呵呵，我一定要解決這個(gè)問(wèn)題。

苦思了一周后，結(jié)果我沒(méi)有想著看看如何搭訕泡妞的書，卻決定要做一個(gè)應(yīng)用出來(lái)。嗯，之前買了好多關(guān)于Android的開(kāi)發(fā)書，這個(gè)應(yīng)用就用Java開(kāi)發(fā)好了，查了下單詞，暗戀英文叫Crush on You，縮寫coy也有怕羞的意思，這英文鐵定是以后APP的名字了。

到了5月份我開(kāi)始看數(shù)據(jù)庫(kù)優(yōu)化和安卓開(kāi)發(fā)的書籍，大一已經(jīng)有做網(wǎng)站開(kāi)發(fā)的經(jīng)驗(yàn)，因此5月末的時(shí)候我已經(jīng)用PHP和MVC架構(gòu)把后臺(tái)搭建的差不多了，包括建立了與客戶端交互的接口以及如何各種調(diào)用數(shù)據(jù)庫(kù)的命令。數(shù)據(jù)庫(kù)是最重要的，一個(gè)產(chǎn)品的核心可以認(rèn)為就是數(shù)據(jù)的結(jié)構(gòu)和邏輯。這個(gè)應(yīng)用的核心我認(rèn)為有兩個(gè)，連接和問(wèn)答。

連接：

之前看過(guò)一部叫《六度人脈》的書，主要講只要你通過(guò)6個(gè)人就能認(rèn)識(shí)全世界的任何一個(gè)人；也有一本書叫《大連接》，主要講美國(guó)60%的情侶都是在校園，工作地方等通過(guò)熟人介紹認(rèn)識(shí)的，而且你和你未來(lái)老婆之間其實(shí)只隔了1-2個(gè)同學(xué)或朋友（意思是你的朋友的朋友或者你朋友的朋友的朋友可能就是你未來(lái)老婆）那么如果要知道女神有沒(méi)有男朋友，肯定不是讓她回答（她不好意思我也多不好意思…），而是讓她的朋友告訴你，這么一來(lái)我的朋友或者我朋友的朋友就能告訴我女神有沒(méi)有男朋友了，是不是感覺(jué)好簡(jiǎn)單？

那么我怎樣才能把這些人聚集進(jìn)我的APP里呢？我又怎么讓這些人加現(xiàn)實(shí)中的朋友為應(yīng)用里的好友呢？從0開(kāi)始建立關(guān)系是非常不明智的，這時(shí)候我想到了微博和人人網(wǎng)，大學(xué)生基本都會(huì)有自己的微博和人人網(wǎng)，自己關(guān)注的人除了大號(hào)外就是自己的朋友，關(guān)注我的人除了朋友外就是對(duì)我感興趣的人或僵尸粉，這么說(shuō)相互關(guān)注的人八九不離十都是認(rèn)識(shí)的朋友。微博的用戶量比人人網(wǎng)多很多，而且微博的OAuth2.0技術(shù)已經(jīng)很成熟了，還可以通過(guò)微博授權(quán)獲取用戶的相互關(guān)注列表，所以當(dāng)時(shí)選擇了微博為基礎(chǔ)。

使用微博OAuth2.0還有一個(gè)好處是如果手機(jī)里有微博客戶端，可以通過(guò)微博的sdk直接調(diào)用微博授權(quán)，可以免去用戶在CoY填寫微博賬戶和密碼，減少了用戶對(duì)此隱私性的煩惱，而且一鍵登錄微博注冊(cè)CoY節(jié)省了用戶的輸入成本。

通過(guò)CoY用戶間的微博相互關(guān)注列表做交叉對(duì)比就可以知道哪些用戶間是有關(guān)系的，將用戶在微博的關(guān)系轉(zhuǎn)化成CoY的關(guān)系，從而大大降低了用戶在CoY增添好友的難度，這樣可以起到一個(gè)很好的破冰作用。

由于微博的關(guān)系是動(dòng)態(tài)的，所以用戶登錄時(shí)每天會(huì)拉取三次互相關(guān)注列表來(lái)動(dòng)態(tài)更新CoY中的好友關(guān)系，這樣也保障了不斷多的用戶進(jìn)來(lái)時(shí)每位用戶都能智能發(fā)現(xiàn)老朋友入駐CoY。

一鍵登錄微博授權(quán)和智能發(fā)現(xiàn)增加好友是CoY的最重要的用戶體驗(yàn)和核心所在。

問(wèn)答：

怎么問(wèn)這妹子是不是有男朋友？

• 我不知道她叫什么名字；
• 用文字我也不知道怎么形容她；
• 我更不知道她微博微信是多少

我怎么來(lái)告訴別人她就是我要找的人呢？

好吧，只能光明正大的拍一張她的照片然后放上CoY問(wèn)其他人了。這是我最糾結(jié)的功能，因?yàn)槲沂且粋€(gè)非常注重隱私的人，但沒(méi)有它這應(yīng)用是絕對(duì)完成不了的。

我思考了好久，平時(shí)我們也是通過(guò)眼睛和手指指問(wèn)朋友這人是誰(shuí)以及了解她的信息，我們從朋友那獲取信息理論上是沒(méi)有侵犯到她的隱私權(quán)，所以理論上通過(guò)照片問(wèn)別人這人叫什么名字和一些簡(jiǎn)單的信息也不算是侵犯她的隱私的。

在做這功能時(shí)也咨詢了在校的法律系學(xué)生和外面的律師朋友，確保這應(yīng)用不會(huì)因?yàn)殡[私權(quán)的問(wèn)題影響到我。為了保守起見(jiàn)，我對(duì)于用戶輸入環(huán)節(jié)做了苛刻的限制，用戶不能通過(guò)輸入文字來(lái)問(wèn)問(wèn)題（因?yàn)檩斎胛淖挚梢援a(chǎn)生無(wú)窮無(wú)盡的問(wèn)題），用戶只能上傳照片并通過(guò)系統(tǒng)的固定問(wèn)題去問(wèn)問(wèn)題，用戶得到的反饋也只有這妹子有沒(méi)有男朋友的答案yes和no的比例以及回復(fù)的用戶（這措施也對(duì)于CoY的商業(yè)模式產(chǎn)生了很大的影響）。很多用戶可能會(huì)擔(dān)心身邊朋友知道自己喜歡誰(shuí)，為了讓廣大用戶安心地發(fā)照片，我還特意開(kāi)發(fā)了一個(gè)匿名模式，就是誰(shuí)也不知道是誰(shuí)發(fā)的照片。

系統(tǒng)固定的問(wèn)題只有5個(gè)：

• 你是否知道他\她是不是單身（知道，分享出去問(wèn)問(wèn)別人）
• 她\他是不是有男\(zhòng)女朋友？（是，不是）
• 你確定嗎？（是，不是）
• 你和她\他的關(guān)系是什么？（朋友，陌生人）

根據(jù)4的回答會(huì)產(chǎn)生問(wèn)題5.你和她\他的關(guān)系很要好嗎？（一般、很要好）

在這里會(huì)對(duì)回答進(jìn)行篩選。如果問(wèn)題3回答了“不是”系統(tǒng)不會(huì)錄入該數(shù)據(jù)；由于附近的人也可能看到過(guò)這妹子是不是跟一個(gè)男的在一起，所以陌生人的答案也不能忽視，如果問(wèn)題4回答了“陌生人”，系統(tǒng)會(huì)根據(jù)生成問(wèn)題和回答問(wèn)題時(shí)的地理坐標(biāo)進(jìn)行距離判斷，如果超過(guò)2公里的也不錄入系統(tǒng)中，這樣最基礎(chǔ)地保障了陌生人數(shù)據(jù)的良好性。系統(tǒng)也會(huì)給陌生人、普通朋友、好朋友不同的權(quán)重，用戶通過(guò)不同的權(quán)重的回答從而可以判斷這妹子是不是有男朋友，以及可以套一下該妹子的朋友近乎（可能也就是你的朋友），私下問(wèn)問(wèn)相關(guān)妹子的信息，從而對(duì)妹子更多了解，也從陌生人往“這是我介紹的朋友”方向發(fā)展，增加成功率。

設(shè)計(jì)

以上就是CoY的兩大核心，接下來(lái)我需要圍繞這兩點(diǎn)進(jìn)行設(shè)計(jì)。當(dāng)時(shí)開(kāi)始流行扁平化設(shè)計(jì)，剛好我對(duì)擬物設(shè)計(jì)感到非常頭疼，決定從0開(kāi)始學(xué)習(xí)android4.0設(shè)計(jì)規(guī)范，一定要做出一款最符合Android設(shè)計(jì)規(guī)范的Android應(yīng)用來(lái)。

當(dāng)時(shí)也非常流行漢堡菜單，漢堡菜單可以提供一個(gè)很好的沉浸式體驗(yàn)，把大部分功能隱藏在界面之外，所以我也采用了該導(dǎo)航設(shè)計(jì)，以下為該應(yīng)用的信息架構(gòu)和部分視覺(jué)圖。

我是一個(gè)非常重視用戶的使用流程的設(shè)計(jì)師，我會(huì)盡量去壓縮流程的讓用戶用最短的路徑去完成最多的事情。

未登錄時(shí)用戶可以查看附近兩公里內(nèi)用戶發(fā)布的圖片，當(dāng)用戶選擇回答問(wèn)題時(shí)自動(dòng)定位到登錄頁(yè)面進(jìn)行登錄。

• 一鍵登錄微博注冊(cè)相關(guān)信息并找到好友。
• 三步回答問(wèn)題。
• 三步發(fā)起問(wèn)題，拍照\(chéng)選擇照片－裁圖－選擇是否匿名發(fā)布
• 一步查看答案。

還有首頁(yè)展示的圖片會(huì)根據(jù)手機(jī)分辨率進(jìn)行縮放，保證圖片不會(huì)被拉伸變形。此外還做了一個(gè)細(xì)節(jié)設(shè)計(jì)，當(dāng)查看回答問(wèn)題的小伙伴時(shí)，向上滾動(dòng)時(shí)背景會(huì)逐漸模糊，類似于Yahoo天氣的滾動(dòng)動(dòng)效。

開(kāi)發(fā)：

一定要學(xué)會(huì)用google搜東西，嗯，搜技術(shù)帖還是用google吧，學(xué)會(huì)在Stack Overflow看解決方法，在Github上查找第三方開(kāi)發(fā)者提供的庫(kù)，例如漢堡菜單這些有現(xiàn)成的安卓庫(kù)不需要自己開(kāi)發(fā)，只要學(xué)會(huì)看懂和怎么改代碼就好。

當(dāng)時(shí)github上有一個(gè)網(wǎng)絡(luò)連接庫(kù)比原生的性能要高很多，為了提高網(wǎng)絡(luò)下載和上傳的速度提升用戶體驗(yàn)，這個(gè)庫(kù)也被我放在CoY里使用，定位這些使用百度地圖提供的SDK，微博登錄使用官方提供的demo和API，這樣能大大降低開(kāi)發(fā)成本。

設(shè)計(jì)數(shù)據(jù)庫(kù)占用了我大量時(shí)間，當(dāng)時(shí)主要在啃一本叫《高性能Mysql》的書，在里面可以學(xué)到很多關(guān)于數(shù)據(jù)庫(kù)優(yōu)化的方法，例如利用trigger和事務(wù)等方法減少連接數(shù)據(jù)庫(kù)次數(shù)，選擇更有效的索引和如何更優(yōu)地聯(lián)表查詢等等方法減少查詢時(shí)間。通過(guò)后臺(tái)的優(yōu)化從而提高整個(gè)應(yīng)用的響應(yīng)速度，提高用戶體驗(yàn)。

最后由于為了省錢選擇了百度的BAE作為服務(wù)器，結(jié)果大部分?jǐn)?shù)據(jù)庫(kù)的優(yōu)化工作都白做了orz，當(dāng)時(shí)心有點(diǎn)疼。但還好，整個(gè)app從上線到下線服務(wù)器那邊也基本沒(méi)怎么花錢，降低了開(kāi)發(fā)成本。

13年時(shí)普遍網(wǎng)民還停留在2G時(shí)代，平均每秒30KB左右，為了讓用戶最快看到圖片和上傳圖片，我對(duì)比了壓縮圖片的比例和質(zhì)量，在不影響體驗(yàn)的情況下選擇將每張照片的等比例壓縮率控制在30%，每張照片大小大約為20kb－30kb，由于一張圖片幾乎占了一屏，通過(guò)lazyload（就是滑屏到某個(gè)位置時(shí)才去拉取照片）的方法去加載圖片，用戶基本不會(huì)感覺(jué)到加載圖片的環(huán)節(jié)，讓整個(gè)用戶體驗(yàn)上升。

滾動(dòng)模糊的實(shí)現(xiàn)方式也困擾了我好久，由于每次通過(guò)y軸判斷用戶滾動(dòng)距離而去渲染模糊效果會(huì)嚴(yán)重影響GPU，導(dǎo)致整個(gè)應(yīng)用卡頓到無(wú)法使用。最后我采取了渲染一次圖片模糊效果并疊放在清晰圖片上面，用戶在滑屏?xí)r，控制模糊照片和清晰照片的Alpha（透明度）來(lái)達(dá)到逐漸模糊的效果。

總結(jié)一下，設(shè)計(jì)決定用戶體驗(yàn)，產(chǎn)品性能是影響用戶體驗(yàn)的關(guān)鍵因素之一。

后話：

上線后有些用戶問(wèn)我?guī)讜r(shí)有iOS版本當(dāng)時(shí)讓我小激動(dòng)了好久，但因?yàn)椴欢\(yùn)營(yíng)，CoY上線幾個(gè)月后就下線了（下線前被我拿去各種比賽，還好獲得了一些還不錯(cuò)的成績(jī)），所以說(shuō)團(tuán)隊(duì)很重要，單槍匹馬做產(chǎn)品是很難成功的。這個(gè)概念有點(diǎn)超前，但不明白大家包括一些天使投資人為什么都覺(jué)得這個(gè)就是陌陌，也讓我心疼了好久。

獨(dú)立開(kāi)發(fā)應(yīng)用也讓我對(duì)交互設(shè)計(jì)和用戶體驗(yàn)有了更深一步的了解，畢竟體驗(yàn)是要靠技術(shù)和設(shè)計(jì)換來(lái)的，兩者不可缺一，只有真的懂兩者（無(wú)論是個(gè)人還是團(tuán)隊(duì)）才能做出好的用戶體驗(yàn)。

獨(dú)立開(kāi)發(fā)很苦，別人在玩的時(shí)候你還在默默地干活；別人睡覺(jué)了你還在苦逼地找資料看書，但獨(dú)立開(kāi)發(fā)給我?guī)?lái)的好處有太多太多，我不用求人家來(lái)幫我干活，自己的想法自己做主；一說(shuō)自己是獨(dú)立開(kāi)者也會(huì)有點(diǎn)小驕傲；獨(dú)立開(kāi)發(fā)可以對(duì)整個(gè)項(xiàng)目會(huì)有更全局的理解，每次的解決問(wèn)題都會(huì)考慮到更多因素，由于思考比別人多也會(huì)比其他人走得更遠(yuǎn)。即使現(xiàn)在工作崗位是一名交互設(shè)計(jì)師，但我也不會(huì)放棄獨(dú)立開(kāi)發(fā)這條路，畢竟這條路也可以走很遠(yuǎn)很遠(yuǎn)：）

作者：薛志榮（微信公眾號(hào)：薛志榮），百度交互設(shè)計(jì)師，一年級(jí)生，目前負(fù)責(zé)手機(jī)百度相關(guān)交互設(shè)計(jì)。

本文由 @薛志榮 ?原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。