觀點|螞蟻金服玉伯:我們是如何從前端技術進化到體驗科技的?

螞蟻金服科技發表於2018-08-07

小螞蟻說:

王保平,花名玉伯。熟悉前端和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

祝學習愉快~


相關文章