Time醬：100小時熬成的微信小程序

文/nickyhu
本文試圖回答這些問題：

• 做爲我的開發者或創業小隊，該選擇哪類產品試手小程序？
• 微信小程序的開發是一種怎樣的體驗？
• 開發和維護一款微信小程序的成本是多少？
• 一個想法是如何一步步變成一個小程序的？

從 12 月 22 日開始，我利用業餘時間，陸續投入 100 小時，一人單槍匹馬完成了一款微信小程序。整個過程混雜着產品構思，交互設計，UI 調校，數據結構設計，代碼編寫。整體而言，微信小程序不管是學習門檻，仍是開發維護成本，相比 app 原生開發，都低不少，一次開發，覆蓋全部微信用戶，挺適合小工具和早期產品試錯。

產品構思

以前寫過一篇對小程序的預測《小程序，微信的自我殘化》，其中提到「小程序能幫助微信羣成員更深度互動」，對於我的開發者或創業小隊而言，若是沒有獨到的可持續的結構化信息，沒有鏈接線上線下的商務服務能力，開發一款小工具多是一個不錯的選（huan）擇（xiang）。

對於工具而言，有一個傳統的分類「效率類」，下面有一大堆時間管理和目標管理的 app 應用。

傳統的時間管理和目標管理應用，好比 Clear，倒很多天，番茄時鐘，omnifocus 都是單人模式，是本身對時間和目標的管理與提醒，本質是備忘工具。

然而，時間的感知維度是豐富的，除我以外，每一個參與者都有不同的視角。有些場景，有好友一塊兒參與，才能堅持更久，更值得回顧和珍惜。兄弟陪你天天晨跑，閨蜜與你一塊兒減肥，和學霸男朋友一塊兒過四六級，一家人 10 天的出國旅行，每一次目標的達成，都是一段與時間爲友的美好體驗。

所以，若是能把你們的投入，回憶，心得在一個目標下聚合起來，彼此心照「而」宣，對目標的達成會更有幫助，讓堅持更多一點趣味。

因此，我決定實現這樣一個小工具，她是一款能讓時間和目標管理更有趣的小程序，幫你擺脫朋友圈的時間黑洞。在看完一集 papi 醬的逗逼視頻後，我腦洞一開，不如就叫「Time醬」。

不用繁瑣的設置，不用耗時的下載，新用戶只需打開微信，直接搜索「time醬」，就能當即免費添加「小目標」，天天與好友一塊兒記錄目標的進展，回顧目標里程碑。

產品實現

有了 idea 以後，不急着作產品原型，建議先仔細閱讀《微信小程序設計指南》，核心是不要干擾用戶，保持簡潔優雅，隱含的意思是用你的產品和服務來征服用戶，而不是靠營銷來廣告用戶。WeUI 是一套小巧的交互框架，全部要素，微信已經高頻地教育過 8 億多用戶，咱們直接拿來主義就好。

我是一邊看着 WeUI，一邊想功能，交互和視覺，一邊直接寫代碼實現，因此下面簡單說說技術選型和開發過程。

開發工具首選微信官方的，整合了項目配置，編碼，預覽，調試，打包和發佈的全流程，大約花 2 小時熟悉以後，有點不相信，屏這個和 chrome 調試相似的小工具就能搞出 app 原生的交互體驗？

對小程序新語法的熟悉，若是你有 vue 或 react 的基礎，那學習門檻幾乎爲 0，分分鐘上手，我前先後後大約花了 8 小時基本掌握了小程序的語法和開發規則。

小程序開發框架知足了用戶前端交互，後端數據和服務器仍是要本身搞定，這個時候，給你們隆重推薦一款利器 Leancloud（查看 小程序 SDK 文檔入口），它能讓你專一在前端交互上，後端的數據結構，接口服務，併發負載，實時通信能力都能幫你全套搞定。若是沒有 Leancloud，可能我還要多花 100 小時在後端的處理上，或者須要組隊一名後端程序員來一塊兒開發。有了 Leancloud，能夠更自由更獨立的發揮。有了它，後端處理大約花了 10 個小時。

剩下的 50 個小時，用在具體功能開發和聯調測試中。下面具體介紹一下「time醬」的產品功能。

產品介紹

一、添加目標，並與好友共享

這裏已經準備好一些目標可供選擇，固然，你也能夠直接輸入目標。

而後，你能夠進一步完善目標信息：

添加成功後，就會看到目標詳情頁

此時，點擊右上角的「…」，就能顯示分享入口，分享給微信好友，加入目標。

二、與好友一塊兒添加進展

不只能夠記錄時間，還能添加照片和文字

三、進展統計

隨着進展的累積，能夠按天按周按月統計投入的時間，還能看到圖文明細。

好了，初版的「time醬」就先介紹到這裏，但願你會喜歡。

不用繁瑣的設置，不用耗時的下載，新用戶只需打開微信，直接搜索「time醬」，就能當即免費添加「小目標」，天天與好友一塊兒記錄目標的進展，回顧目標里程碑。