怎樣設計一個巨難用的后臺？

15年7月-17年3月，我主要在做的是個人中心菜單、賬戶體系、客服系統等前端工作，之前按照“Via Negativa”來撰述了幾篇文章，本篇也是。

我個人比較喜歡讀Nassim Nicholas Taleb的書（著有《隨機漫步的傻瓜》、《黑天鵝》、《反脆弱》、《Skin in the game（新書，還沒出中文版）》）。

他在《反脆弱》中翻新了一個概念叫做“Via Negativa”。這個詞是拉丁文，含義可以理解為“negative way”或 “by way of denial”。

這個概念主張的是：

負面的信息遠比正面的信息高效——找到一只“黑天鵝”，就可以立刻推翻“只有白天鵝”的假設。

同樣的，對于一些產品新人，如果有前人指出坑在哪里，會比告訴一堆怎么做，會更有幫助。

言歸正傳。

17年3月，我通過內部轉崗到了運營工具團隊，做一個內部稱為“專題系統”的賣場搭建系統。

先大概解釋一下這個系統是干嘛的：

這種系統，在業內，通用一些，有人稱之為CMS（Content Management System-內容管理系統）。準確一些，可以對標京東的“通天塔”系統（或老版的Goshop），在淘寶估計也有類似的，但我沒有接觸過，淘寶的店鋪系統也比較相似了——區別只是在淘寶店鋪系統，一個店鋪只能售賣店鋪內的商品。

但“通天塔”或者“專題系統”是可以跨品牌、跨品類，多維度自定義搭建頁面的。實現方式就是運營通過拖拽一些模塊化的組件、配置特定的數據，搭建一個H5賣場頁面，用來展示不同維度運營的貨品信息。

我們的大促活動頁面（也包括日常的小活動、或自定義的H5信息展示頁面），都是通過專題系統搭建的。

京東“通天塔”界面

淘寶旺鋪界面

專題系統（舊）

Nova專題系統（新）

這個系統在我接手的時候，已經有接近2年的生命周期了，近幾個月在我們團隊的努力下，做了大幅優化，重新命名為“Nova”專題系統。

（“Nova”是天文學概念，中文譯為“新星”，但實際上準確來講，一顆行星衰亡時刻***迸發出的強光，不過一般人在用這個詞的時候，都會忽略它的真實意義，詳細知識自行百度）

專題系統，最初始版本是：運營提需求，產品、設計、交互撰寫方案，開發按需開發H5頁面。

由于活動需求變化快，每次開發的功能復用性差；很多小的公司，沒有工具化的系統，依然在采用這用方法。

隨著電商行業進入頻繁大促的運營節奏后（大概從2015年開始），這種模式完全跟不上業務節奏，因此專題系統誕生了。

在我接手的時候，專題系統已經是一個核心運營系統了，服務的對象是全公司的運營團隊（目前暫時也沒有開放給第三方的計劃），涉及300多號人，大促、小促都離不開它。

從技術性能上來講，它可以扛住大促的高并發流量，從業務使用上來講，前端開發可以快速上線HTML樣式，無需發版本，極其靈活。

但是，它有一個弊病——媽呀，太難用了。

接下來，讓我手把手教你3個絕招，做一個超級難用的后臺運營工具。

絕招一：必須要慢出翔

接觸過互聯網的人，應該都接觸過旋轉的菊花：

天下武功，唯“慢”不破。

此招入門快，實現容易，卻可領運營痛苦不堪，為***絕學。

***運營的每一步操作，都能讓菊花轉一轉，就再好不過了。

現代運營管理（Operations Management）的精益運營（Lean Operation）理論分支提出過7種浪費：

1.生產過剩（Overproduction）：To produce sooner or in greater qualities than what customers demand.

2.無效運輸（Unnecessary Transportation）：Unnecessary movement of parts or people between.

3.返工（Rework）：”Do it right at the first time, rework is a pain”—— Repetition or correction of a process.

4.過程繁復（Over-porcessing）：Processing beyond what the customer requires.

5.無效動作（Unnecessary Motion）：Unnecessary movement of parts or people within a process.

6.庫存積壓（Inventory）：”Product has to flow like water”.

7.無效等待（Waiting）：Underutilizing people or parts while a process completes a work cycle.

這里說的“慢出翔”，屬于第7個：無效等待。它不產出任何價值，而且會打斷運營的操作，如果走神干其他的去了，回神過來，估計還要一陣功夫。

“要等到什么時候！”

造成無效等待的***原因，其實是技術上“緩存”應用不足的體現——如果產品不注意這個問題，開發一般也不會特意關注，***就導致坑了運營。

具體來講，就是用戶操作中，每一步的操作，如果都需要與接口服務進行交互，那必然涉及到數據請求、數據返回的耗時。

就好比你做一道蛋炒番茄，如果每個原料（番茄、雞蛋、油），都需要你走一次菜市場，一個一個買（注意不能帶菜籃子哦），***慢出翔啊。

但實際上，很多時候的操作，并不需要實時請求接口。

大媽的菜籃子，就是緩存應用的實例——你可以先挑菜呀，挑好了所有的，再一并帶回家。

大媽的菜籃

這個問題，從交互上，產品經理是可以提出要求的，可操作性還是比較強的。

在唯品會舊的專題系統，操作復雜頁面時，像大促主會場涉及上百個組件，一個簡單的組件順序調整或增、刪，有時候就可以load幾十秒。

但在新的Nova專題系統，我們的設計取消了布局操作的接口請求，運營的操作達到了實時響應，當需要保存操作整體結果的時候，點擊“保存”按鈕，才會一并請求接口、保存數據。

此外，有一篇David H.H（編程語言Ruby on Rails的創造者，37signals的創始人之一，有Basecamp等知名互聯網產品）的博客文章，推薦可以看一下，名字叫《How Basecamp Next got to be so damn fast without using much client-side UI》

（37signals團隊有博客，有英文閱讀能力的，可以直接看，他們團隊的文字功底還不錯，甚至出版諸如《Rework》等對于工作效率方面的著作，他們比較倡導極簡主義。）

絕招二：不允許出錯（或低容錯）

是人，就會犯錯。

那就只給他一次機會，讓他提心吊膽，悔青腸子。

具體做法諸如：

1. 操作一保存，立即發布上線，實時生效；

2. 操作無法回退為上一次保存的情況，錯了，要從頭開始；

3. 上傳項、填寫項，不校驗數據格式；

4. 后臺的登錄狀態，長時間不操作，會斷線，沒提示，斷了之后做過的東西都白搭。

對于XX會的專題系統：

第1點，其實無論新舊系統，我們做的都不錯。所有關鍵操作，都有二次確認。頁面制作好后，需要先預覽、復核數據正確后，再發布到先上。

第2點，無論新舊專題系統，都還沒有實現，主要原因是技術實現成本較大——相當于要存儲多個數據備份，每個數據備份實際上都是要占用服務器空間的。

第3點，舊的專題系統，做得特別不好（Nova得到了較好的解決）——受系統限制，組件配置中的文本框被濫用，被開發定義了各種奇奇怪怪的數據格式，但都不會做規范校驗。比如：某個組件，必須傳750*480px的圖片才能正常展示，但運營在后臺可以成功上傳其他格式的圖片，最終導致前端展示異常。

第4點，舊專題存在，需要刷新整個頁面，才能重連登錄狀態，之前做的東西都白瞎。Nova解決掉了，具體實現方式是：重連登錄態，改為請求任意后臺接口時進行，并不需要重新刷新整個頁面。

絕招三：不做任何指引

盲人摸象聽過么。

對的，就是要讓運營像瞎子一樣，猜！

要做到讓運營問這些問題：

我在策劃一場活動，頁面希望長這樣子，你們系統能提供哪些功能？

我看到別人做的頁面，有一個模塊，我也想使用，組件叫什么？該如何配置？

這個組件，效果好不好？你們有數據經驗嗎？

這個組件，配置好復雜，你教一下我？

你幫忙看看，我配置的組件無法正常展示，是哪里配置錯了嗎？

在舊的專題系統，由于交互隱晦、沒有操作指引，基本上所有系統能力，都靠口傳心授，耗費多方的人力，系統用得溜的基本上是在公司待了好幾年的，新來的人基本一臉懵逼，熟練上手需要個把月。

產品、技術的日常維護成本極高，一天如果有5個運營來問你，就基本不用干活兒了。

但在Nova，我們打造了【組件樣式庫】——運營點擊，可以彈出詳細的配置介紹、場景說明?！卷撁婺０鎺臁俊容^像QQ空間的換膚，可以由活動策劃或設計師定義配色、基本的組件結構，運營搭建頁面的時候，可以直接套用，不同的模版，經過實驗還可以整體迭代、優化。

此外，還對界面的交互做了細致的優化，比較晦澀難懂的操作，hover會有文案或圖片提示，或者點擊可以跳轉介紹wiki。

Nova樣式庫

Nova模版庫

一個不好的運營工具系統，運營經驗是無法傳承的，好的經驗只能憋在幾個***運營的肚子里，無法分享給別人；一些數據效果好的組件，也只有幾個人知道。運營需要幫助的時候，不能自助解答。

這個系統關聯的產品、設計、開發、運營，都要忙碌在低效的信息溝通中，疲于應付瑣碎問題，渾渾噩噩過日子。

總結一下

如果希望設計一個難用的后臺運營工具，需要遵守如下步驟：

必須慢出翔；

不允許出錯（低容錯）；

不做任何指引。

簡單易學，馬上輕車熟路，司機們請避坑繞行??！

其他的坑，也歡迎各位補充，本文三個要點，也不能覆蓋所有的情況。