觀點｜螞蟻金服玉伯：咱們是如何從前端技術進化到體驗科技的？

小螞蟻說：

王保平，花名玉伯。熟悉前端和SeaJS的人必定對這個名字不陌生。做爲前端領域的一枚大大大牛，他如今擔任螞蟻金服體驗技術部負責人。本文，他分享了他從前端一路進階升級到體驗科技的我的思考，並詳細介紹了體驗科技的歷史及將來發展，以及本次體驗科技開放的願景。

前端的本質是什麼？隨着移動和物聯網的發展，前端技術又會有哪些變化？但願經過本文內容你們能對這些問題以及體驗科技有更進一步的瞭解，文末有文章相關的PPT及視頻連接，歡迎查閱，也歡迎你們留言交流。

做者介紹：王保平，花名玉伯，現任螞蟻金服體驗技術部負責人。2008 年入職淘寶 UED，與團隊一塊兒奠基了阿里巴巴在國內前端技術領域的領先地位。2012 年加入支付寶，致力於設計語言 Ant Design、數據可視化 AntV、智能建站、圖形與藝術等領域的工做。目前一心打造服務於螞蟻金服與業界億萬客戶的世界一流的螞蟻體驗科技，致力於讓用戶體驗美好。

什麼是前端技術

我第一次接觸前端開發是 2002 年大學期間，轉眼 15 年多。這些年我一直在思考一個問題：究竟什麼是前端技術？很長很長一段時間，前端技術的定義很是清晰，就是瀏覽器端的 HTML、CSS、JS 技術。咱們用這些技術作出各類各樣的頁面，咱們是離用戶最近的程序員。

記得 2009 年開始接觸 Node，很快前端技術開始爆炸性增加。最開始的變化，是前端壓縮工具從基於 Java 的 YUI Compressor 開始切換到基於 Node 實現的 UglifyJS 等工具。除了前端工具上的一路狂奔，在服務端領域也出現了 Express 等框架，前端開始經過 Node 完成服務端模板甚至整個 MVC 層的開發。在螞蟻金服，服務端層咱們更多把 Node 定位爲 BFF 層實現，BFF 是 Backend For Frontend 的縮寫，翻譯成用戶體驗適配層。

BFF 模式下，總體分工很清晰，後端經過 Java 等語言負責服務實現，理想狀況下給前端提供的是基於領域模型的 RPC 接口，前端則在 BFF 層直接調用服務端 RPC 接口拿到數據，按需加工消費數據，並實現人機交互。基於 BFF 模式的研發，很適合擁有前端技術背景的全棧型工程師。這種模式的好處很明顯，後端能夠專一於業務領域，更多從領域模型的視角去思考問題，頁面視角的數據則交給前端型全棧工程師去搞定。領域模型與頁面數據是兩種思惟模式，經過 BFF 能夠很好地解耦開，讓彼此更專業高效。

除了服務端的滲透，從 2013 年開始，阿里開始無線 ALL IN 戰略，這對前端影響很是大。有至關多的前端開始轉型爲 iOS 工程師（轉型爲 Android 的比較少，有部分 Java 工程師轉型成了 Android 開發），沒有轉型的，也開始大量投入到 Mobile Web 開發。這個大背景下，前端與客戶端技術開始互相融合，特別是在容器層。從 2015 年開始，物聯網 IoT 逐步興起，前端開始涉足 IoT 設備上的應用研發。端的本質是 devices，臺式機、手機、IoT 設備都是一臺臺 devices，不少會直接被用戶使用，有用戶使用的 devices，就會有人機交互需求，就會有前端的工做價值。前端是離用戶最近的工程師，這個定位一直沒變。

很是有意思的是，在移動端的架構裏，這幾年也出現了基於 RPC 接口 + 網關 + BFF 的架構體系，在研發效率、網絡性能等方面均有優點。隨着 IoT 應用的涌現與複雜化，我相信最終也會出現 BFF 架構。BFF 模式不只僅是一種技術架構，從社會分工角度講，BFF 更是一種多元價值導向的分層架構，每一層都有不錯的空間去施展，不只能發揮工業社會雙手的做用，還能使用上雙手上面的腦殼。齒輪再也不是被動跟着轉，而是開始擁有自驅的轉動力。同一時期，業界也出現了一些相似的職業融合。好比 DevOps 倡導開發也懂運維，很多大公司在推行開發也懂測試，測試則轉型爲更專業的質量工具部門，還有前端也懂設計的 DesignOps 的出現等等。各類全棧概念的涌現，都是在從新探索更合理的分層協做模式。紛紛擾擾，成敗如風。

補充一個說明，當年提出的先後端分離，並不許確，這些年一直努力糾正爲先後端分層的理念。專業的分工協同對效能的提高很關鍵。全棧的含義是指分層演化後，每一層的技術棧要求，是每一層橫向技能的全，而不是縱向跨層的通（縱向跨多層都能通的人才很是少，就如當今社會已經很是難誕生博物學家了）。不斷探索更好的分層協做是有意思的，這就如人類家庭裏夫妻的關係同樣，男權、女權都不可取，社會的演化最終會視人爲人，每一個個體平等、自由，社會會以一種必然的不可阻擋的形態往前演進。

回到前端發展歷史，前面說了這麼多，只說了一件事，先後端分層協做的各類模式。協做的邊界是數據，後端提供數據服務接口，前端消費數據實現人機交互。不一樣模式下，BaaS（Backend as a Service）的含義各有不一樣。在 BFF 模式下，因爲 BFF 層的運維部署須要，前端還需負責 BFF 層的 PaaS 平臺建設。不一樣模式下的工程體系各有不一樣，工程的本質是讓一羣人作好一堆事，涉及代碼規範、協做流程、運維部署、性能與安全等不少領域，這裏再也不一一展開。

服務端 Node 與各類終端的涌現，讓前端進入了大前端範疇，這時候的前端，已遠遠不僅是瀏覽器端的頁面實現技術，而是後端服務與人機界面的鏈接器。

什麼是體驗科技

我屬於在無線 ALL IN 戰略中，選擇留下來繼續作 PC Web 的前端。雖然公司重點轉向無線，但 PC 業務一直沒停。隨着近幾年整個阿里集團「大中臺、小前臺」的策略，愈來愈多的企業級中後臺產品處於兵荒馬亂階段，設計師很是缺失，隨手一抓，都是大量體驗比較糟心的產品。這過程當中，愈來愈感受什麼地方有問題，必定在某些點上咱們沒作好。當時沒多想，就想着既然缺設計師，咱們就嘗試去招聘。因而體驗技術部開始擁有了設計師，很是艱辛的起步，很是感激的是，雖然艱辛，但找到了一些與我同樣堅信中後臺產品價值的設計師。一旦有了設計師，整個中後臺產品的用戶體驗，一會兒就提高上來了。

設計團隊的融入，平常的各類碰撞交流，讓個人思惟發生了很大變化。前端技術再牛，都很難直接解決產品層的用戶體驗。對中後臺產品來講，設計的價值也遠遠不止於讓產品的顏值提高，設計的更多更多價值，在於深刻到產品的業務邏輯裏去，去幫助業務梳理產品信息架構與任務流程。用戶體驗是一個很是綜合的事，須要各類專業人士在同一個產品上聚焦發力，一塊兒共同努力才能真正提高產品體驗。設計師在這個過程當中很痛苦，不少中後臺產品都是很是垂直領域的業務產品，中間件、ECS、ODPS 等一堆堆專業術語讓設計師們痛苦不堪，幸運的是，咱們扛了過來。

接下來的故事，在今天各個講師的分享裏，很多都有說起。整個團隊的重心，開始很是清晰地往幾個方向發展：

• TWA 方向：這是比 BFF 更大的概念 。TWA 是 Techless Web App 的縮寫，是一種技術理念，但願愈來愈多的開發者，能夠不用再關注流程、構建、環境、部署等各類事，但願能作到技術無感化（Techless），讓每一位開發着能安安靜靜的快樂編碼。
• UI 智能化方向：Ant Design 是一個設計體系，antd 是 Ant Design 的 React 實現。這幾年 antd 的發展，不只讓前端編碼更快更爽了，同時讓一個歷史悠久但生生不息的領域重燃但願：是否存在人機交互界面智能可視化搭建的可能？這個領域，這一兩年在阿里內部很是火，各類搭建產品層出不窮，目前都還處於比較垂直的領域，泛化到行業級通用的產品還沒怎麼出現。咱們也開始嘗試，並且咱們相信天時地利人和，必定能折騰出點什麼，正在努力中，或許可以在不久的未來展現給你們。
• 數據可視化方向：一直關注咱們的朋友相信對 G2 和 AntV 已經有了一個總體瞭解（參考閱讀《螞蟻金服開源：數據驅動的高交互可視化圖形語法G2》）。可視化方向咱們是從 2014 年開始正式投入人員去作，最開始的想法來自科幻片，你們若是喜歡看科幻片的話，會留意到各類人機交互界面都是各類可視化效果了，不多不多有傳統網頁。可視化是個歷史很是悠久的領域，咱們小學時學會的乘法豎式，就是一種可視化，能夠幫助咱們減小記憶成本，同時提高計算速度。
• 圖形互動化方向： 這個領域咱們纔開始一年多，但這是咱們很是篤定的一個方向。不少小孩，對書本都比較抗拒，但對遊戲有着天生的喜好。螞蟻森林讓你們從表單形式的公益，變成了互動遊戲型的公益。愈來愈多的人機交互形式，會是有互動交互的圖形界面。應用的泛互動化，是一個很大趨勢。支付寶是個生活服務平臺，各類生活服務的互動有趣化，必定是更有吸引力的。

看更遠的將來，我相信對體驗科技來講，天然化和虛擬化會是兩個大趨勢。

好比當我分享一個 PPT，要翻頁時，須要點擊鍵盤按鈕，爲何電腦不能直接理解個人意圖而自動翻頁呢？好比我只要頭往下示意一下，就能天然而然翻到下一頁。咱們如今不少行爲，跳脫出來看，能發現不少不少不天然。天貓精靈等各類智能音箱，真正去用時，離天然交互還有比較遠的距離。Ant Design 設計價值觀裏，最最重要的就是天然價值觀，一切纔剛剛開始探索。

再說虛擬化。虛擬化不只僅指 AR、VR 等技術，看過黑客帝國、西部世界等科幻片的，會對虛擬化有更多體感。若是之後每一個小孩出生時，就會被植入一個能五感俱全的芯片，這種狀況下，咱們的人機交互會是怎麼樣的。太多可能性與挑戰在等着咱們。

這一切都是體驗科技，是技術與設計的融合，是服務與用戶鏈接，是下圖中的一個公式。

體驗科技是 UX = f(services) 這個公式，能將各類各類的 services（後端服務） 經過技術與設計的融合，轉變成體驗一流的用戶產品。這個公式的一個實現，就是螞蟻體驗雲。螞蟻體驗雲的初心，是但願能幫助有夢想的你，將一個個優秀的想法，經過體驗雲實現成一個個終端產品。

體驗雲纔剛剛起步，目前已在內部服務螞蟻金服、阿里巴巴集團，同時快速孵化出了雲鳳蝶、語雀、小錢袋等創新產品。雖然還很不完善，但咱們但願能儘快與用戶一塊兒成長。不少激動人心的事正在發生，經過體驗科技的開放，咱們但願着能爲世界帶來更多平等的機會。

文末福利：文章相關PPT釘盤連接：https://space.dingtalk.com/s/gwHOAB39IQLOD7oxKAPaACBiMWI3YzYzZWRjOTg0NDVmOGI1NGU4Y2YyODY0MWQ2Yw

密碼: bvNk

視頻連接：https://v.youku.com/v_show/id_XMzMwMzg2MDIwOA==.html

祝學習愉快~