|
新聞中心
當(dāng)前位置：網(wǎng)站首頁 > 新聞中心
「專訪」Ant.Design希望成為世界級設(shè)計體系
我們很榮幸此次通過站酷網(wǎng)邀請到螞蟻金服體驗(yàn)技術(shù)部UED并圍繞旗下設(shè)計體系A(chǔ)nt Design (ant.design)進(jìn)行了相關(guān)采訪。如下內(nèi)容轉(zhuǎn)自站酷網(wǎng)：
訪談嘉賓介紹：
.design是Top Level Design拓?fù)渚S度公司旗下的新頂級域名。與日常接觸最多的.com， .cn 網(wǎng)址域名后綴不同的是.design帶有明顯的設(shè)計專屬特征，更適用于設(shè)計行業(yè)個人，公司，組織等創(chuàng)建網(wǎng)站。.design同樣支持瀏覽器的收錄和搜索，網(wǎng)站備案，郵箱創(chuàng)建等。
螞蟻金服體驗(yàn)技術(shù)部 UED是一家和前端工程師一起的，服務(wù)螞蟻企業(yè)級應(yīng)用的團(tuán)隊(duì)，分成兩個大團(tuán)隊(duì)：分別是設(shè)計服務(wù)中心和體驗(yàn)設(shè)計中心。設(shè)計服務(wù)中心負(fù)責(zé)螞蟻企業(yè)級設(shè)計體系與科技品牌的心智打造，主攻設(shè)計工程化與科技情感化，體驗(yàn)設(shè)計中心負(fù)責(zé)支持螞蟻 CTO 業(yè)務(wù)線的日常業(yè)務(wù)支持，以 better UX 為目標(biāo)，致力于企業(yè)級設(shè)計領(lǐng)域的體驗(yàn)方法與優(yōu)秀案例 。成規(guī)模的設(shè)計團(tuán)隊(duì)都有一套自己的設(shè)計規(guī)范，用它來解決設(shè)計產(chǎn)出的一致性，提升設(shè)計的效率。但是如果產(chǎn)品量級驚人，產(chǎn)品迭代，技術(shù)變革，用戶行為等不確定大，不太靈活的設(shè)計規(guī)范就有了局限性，于是就有了設(shè)計體系。
“設(shè)計體系是一個具包容性且充滿生命力的東西。包容性指的是從組件庫到設(shè)計語言到設(shè)計方法等所有和產(chǎn)品設(shè)計相關(guān)的方面。而生命力指的是它并非靜態(tài)的內(nèi)容，而是可以應(yīng)對不斷變化的環(huán)境，是一個不斷進(jìn)化的過程。”2018年，在首屆螞蟻體驗(yàn)科技大會，Ant Design設(shè)計負(fù)責(zé)人它山這樣描述設(shè)計體系的優(yōu)越性。當(dāng)天，螞蟻金服體驗(yàn)技術(shù)部 UED對外正式發(fā)布了 Ant Design 3.0，正式將 Ant Design 從 UI 組件庫的概念升級至面向企業(yè)級的設(shè)計體系。
螞蟻金服體驗(yàn)技術(shù)部 UED （以下簡稱螞蟻UED）是一支和前端技術(shù)團(tuán)隊(duì)在一起的設(shè)計團(tuán)隊(duì)，成立于 2014 年。初期團(tuán)隊(duì)只有 1 位設(shè)計師支持螞蟻企業(yè)級產(chǎn)品的設(shè)計需求。隨著螞蟻金服 TechFin的戰(zhàn)略轉(zhuǎn)型（即重心將由支付及消費(fèi)金融轉(zhuǎn)向技術(shù)服務(wù)），內(nèi)部的企業(yè)級產(chǎn)品開壯大，同時這類產(chǎn)品量級巨大、功能復(fù)雜、并發(fā)頻繁。有限的人力，必然無法支持海量的業(yè)務(wù)需求，除了擴(kuò)展團(tuán)隊(duì)人數(shù)外，螞蟻金服UED聯(lián)合社區(qū)一起打磨出 Ant Design —— 一個服務(wù)于企業(yè)級產(chǎn)品的設(shè)計體系。通過?Ant Design，以少量人力，提升大阿里內(nèi)部1，000+?產(chǎn)品、外部20，000+?產(chǎn)品的研發(fā)效率，至今為止，累計為全球?300w+?設(shè)計者和開發(fā)者使用，帶去了友好的研發(fā)體驗(yàn)。
隨著螞蟻金服的高速發(fā)展和商業(yè)化進(jìn)程的加快，企業(yè)級產(chǎn)品的用戶體驗(yàn)變得越發(fā)重要。如今的螞蟻金服UED已逐步發(fā)展成近 60+ 設(shè)計師的團(tuán)隊(duì)規(guī)模，儲備著品牌、3D 動畫、影視、用戶研究、產(chǎn)品設(shè)計等等各種專業(yè)方向的人才，以滿足企業(yè)級產(chǎn)品多元化的需求，實(shí)現(xiàn)不僅讓設(shè)計者和開發(fā)者「體驗(yàn)美好」，更讓終端用戶「體驗(yàn)美好」的目標(biāo)。
我們是在ant.design（http://ant.design）這個網(wǎng)站上知道了Ant design，知道了這個由中國團(tuán)隊(duì)出品的優(yōu)秀的設(shè)計體系。于是我們聯(lián)系了幕后團(tuán)隊(duì)——螞蟻金服體驗(yàn)技術(shù)UED，Ant Design設(shè)計負(fù)責(zé)人它山接受了我們的專訪。我們也非常高興通過這次專訪，能把Ant design介紹給更多人，把這個優(yōu)秀的設(shè)計團(tuán)隊(duì)介紹給更多人。
現(xiàn)在就帶你了解為全球 300w+設(shè)計者和開發(fā)者帶來友好研發(fā)體驗(yàn)的設(shè)計體系，為你揭曉螞蟻金服企業(yè)級產(chǎn)品高效研發(fā)的秘密。
企業(yè)級產(chǎn)品設(shè)計：把痛點(diǎn)和難點(diǎn)當(dāng)作挑戰(zhàn)
.design：螞蟻金服體驗(yàn)技術(shù)部?UED是一只怎樣的設(shè)計團(tuán)隊(duì)，它的構(gòu)成如何，分別承擔(dān)了什么樣的設(shè)計職能？
螞蟻UED：我們是一家和前端工程師一起的，服務(wù)螞蟻企業(yè)級應(yīng)用的團(tuán)隊(duì)。目前UED 一共分成兩個大團(tuán)隊(duì)：分別是設(shè)計服務(wù)中心和體驗(yàn)設(shè)計中心，設(shè)計服務(wù)中心負(fù)責(zé)螞蟻企業(yè)級設(shè)計體系與科技品牌的心智打造，主攻設(shè)計工程化與科技情感化，體驗(yàn)設(shè)計中心負(fù)責(zé)支持螞蟻 CTO 業(yè)務(wù)線的日常業(yè)務(wù)支持，以 better UX 為目標(biāo)，致力于企業(yè)級設(shè)計領(lǐng)域的體驗(yàn)方法與優(yōu)秀案例 。
.design：談起螞蟻金服，可能很多人會先想到支付寶錢包，芝麻信用，螞蟻森林等等，沒有想到你們要服務(wù)這么多企業(yè)級產(chǎn)品。能否聊聊螞蟻的企業(yè)級產(chǎn)品，其體驗(yàn)設(shè)計最大痛點(diǎn)和難點(diǎn)是什么？
螞蟻UED：一說起螞蟻金服，相信很多人對支付寶錢包、芝麻信用、網(wǎng)商銀行、春節(jié)紅包、螞蟻森林這些應(yīng)用并不陌生。如果這把我們螞蟻的整個產(chǎn)品體系比做冰山的話，這些屬于水面以上的部分。而 Ant Design 所服務(wù)的企業(yè)級產(chǎn)品更多的是屬于水面以下的部分，這是一個非常龐大且復(fù)雜的產(chǎn)品網(wǎng)。功能囊括了資金、運(yùn)維、研發(fā)、安全、風(fēng)控、效能管理、渠道管理等所有維持我們前臺業(yè)務(wù)快速高效安全穩(wěn)定運(yùn)行的模塊。
至于企業(yè)級產(chǎn)品設(shè)計的設(shè)計難點(diǎn)，從設(shè)計師的視角來回答這個問題的話，應(yīng)該是量級大、變化快、產(chǎn)品邏輯復(fù)雜、用戶同理心比較難建立，但其實(shí)我們更愿意把痛點(diǎn)和難點(diǎn)看成是挑戰(zhàn)。
Ant Design：希望成為世界級設(shè)計體系
.design：用最簡單的話概括，Ant Design是什么，能為設(shè)計師和開發(fā)人員做什么？
螞蟻UED:提供前端組件庫和配套的 Sketch、Axure 的設(shè)計資源包，幫助設(shè)計師和開發(fā)人員提升 5-10 倍的研發(fā)效能。提供設(shè)計價值觀、原則和模式，幫助設(shè)計師和開發(fā)人員做更好的產(chǎn)品設(shè)計。.design：ant.design，這個網(wǎng)站是何時建立的？為解決什么問題而建立？
螞蟻UED：ant.design 是 15 年初建立的。當(dāng)時螞蟻金服的中臺需求非常之多，但支持的前端和設(shè)計非常得少，基本上 1000 個系統(tǒng)對 10 個設(shè)計師這樣的規(guī)模。所以，我們就想到用一個統(tǒng)一的 UI 資產(chǎn)（組件庫）來提升效能，讓我們做得更快，從而把重點(diǎn)項(xiàng)目直接支持好，同時，也能降低 UI 設(shè)計門檻，從而賦能我們的合作伙伴（產(chǎn)品經(jīng)理和后端工程師等），來間接支持更多應(yīng)用。.design：為什么選擇了ant.design這個域名？
螞蟻UED：選擇 Design 這個域名，是期待我們能將設(shè)計價值觀、原則和模式逐步傳承下去，因?yàn)榍岸丝蚣?、設(shè)計風(fēng)格都會過時，antd （Ant Design of React：用 React 前端框架實(shí)現(xiàn)的 Ant Design）一定會被淘汰。但如果我們有 Ant Design ，下個潮流來的時候，我們能快速搭建新的 Ant Design of XXX。非常感動的事，除了 antd，我們已經(jīng)有 10+ 不同前端框架實(shí)現(xiàn)的 Ant Design。 我們的 Design 夢得到了真正的延續(xù)。
.design：Ant Design的設(shè)計價值觀很特別，它有兩個堅持——自然和確定，能否舉例和我們具體聊聊。
螞蟻UED：自然，以色彩為例子，一般設(shè)計師會根據(jù)經(jīng)驗(yàn)來定色板。但我們通過對自然場景的抽象捕捉，結(jié)合螞蟻的技術(shù)基因，形成了特有的 12 色。進(jìn)一步又通過大量的觀察，捕捉不同色彩在自然光下的變化規(guī)律，借助美術(shù)中素描的思路，對 12 個顏色進(jìn)行了衍生。
確定：將頁面模塊化、組件化，是將設(shè)計規(guī)則進(jìn)行前置和黑箱化，用戶只要去選擇合適的組件用就可以，不必?fù)?dān)心里面的細(xì)節(jié)，這就極大降低專業(yè)性和溝通成本，也就降低研發(fā)的不確定性。比如：不會出現(xiàn)這樣狀況，這個頁面的 Button 有懸停狀態(tài)，那個頁面的 Button 沒有懸停狀態(tài)。
.design：Ant Design從最初版本到現(xiàn)在Ant Design 3.0，每一次的迭代有什么重要調(diào)整和拓展？
螞蟻UED：1.0 到 2.0：組件能力的不斷優(yōu)化和整合，同時增加模式，從單一組件庫逐步成為國內(nèi)領(lǐng)先的設(shè)計體系。
2.0 到3.0：引入「自然」這個價值觀，在字體、排版、icon 等多個視覺層面做了重大調(diào)整，同時也啟動「人機(jī)自然交互」的研究，從單一的視覺自然升級到交互自然；對外正式推出 ETCG 的概念，并發(fā)布 Ant Design Pro；后續(xù)，還發(fā)布面向設(shè)計師的 Sketch 工具集 Kitchen，專門提升設(shè)計效率。
還有一個小細(xì)節(jié)，我們每次大版本變化，主色都會調(diào)整。這是確定性的一個應(yīng)用案例，調(diào)整起來毫不費(fèi)力，但是每個色值變化的背后都是深思熟慮的結(jié)果。
.design：Ant Design希望成為世界級設(shè)計體系的一份子，你們一定也對比研究過不同的設(shè)計語言，?優(yōu)秀的設(shè)計語言和規(guī)范有哪些共性？
螞蟻UED：參考對象包括：Fiori Design、Human Interface Guidelines、Lightning Design System、Material Design，還有一些《Web 界面設(shè)計》、《界面設(shè)計模式》等經(jīng)典書籍。優(yōu)秀的設(shè)計體系和優(yōu)秀的設(shè)計一樣，都是看起來簡單、好用，但都是深思熟慮的成果。
.design：除了Ant Design，你們還在服務(wù)和打造大量的企業(yè)級產(chǎn)品?；贏nt Design體系設(shè)計的產(chǎn)品，反過來可以成為設(shè)計體系的驗(yàn)證，目前Ant Design對于設(shè)計效率的提升上有哪些可靠的實(shí)例和數(shù)據(jù)證明？
螞蟻UED：螞蟻的企業(yè)級產(chǎn)品介紹基本在這個網(wǎng)站上了http://tech.antfin.com/?，這還只是商業(yè)化對外的一部分，除此之外，還有大量的內(nèi)部建設(shè)需求。
這個問題我拆分成兩個方面來回答：
首先，設(shè)計提效可以從業(yè)務(wù)線宏觀的視角去衡量，也可以從單點(diǎn)業(yè)務(wù)線微觀的視角去看。大面上，一個60人規(guī)模團(tuán)隊(duì)，能撐起上千個系統(tǒng)的設(shè)計量的同時還能夠去沉淀專業(yè)做創(chuàng)新，這一點(diǎn)如果沒有體系化的思考是不可能的。單點(diǎn)業(yè)務(wù)線上的日常設(shè)計效率，在我們沉淀了組件，模版并通過我們的kitchen、ant design lib等輔助設(shè)計的工具，也有較以往很大的提升，舉一個例子，2014年我們支持一個業(yè)務(wù)，5?名設(shè)計師需要全程投入，到現(xiàn)在?1個設(shè)計師可以同時支撐多個業(yè)務(wù)的設(shè)計需求并且還能在過程中嘗試方法創(chuàng)新。以往一個業(yè)務(wù)線需要交互視覺同時搭配來做的事情，通過設(shè)計體系，現(xiàn)在一名體驗(yàn)設(shè)計師就可以完成大部分的界面設(shè)計工作，甚至通過團(tuán)隊(duì)內(nèi)部的培訓(xùn)賦能，我們還將一部分 PD 帶起來，讓他們自己也可以產(chǎn)生簡單的界面。
第二點(diǎn)，設(shè)計體系中設(shè)計工程化打好了一個效率的大基礎(chǔ)，讓設(shè)計師們可以釋放重復(fù)工作真正的投入到重點(diǎn)項(xiàng)目的體驗(yàn)優(yōu)化中去，從用戶視角出發(fā)，幫助產(chǎn)品提升主流程的用戶體驗(yàn)，目前已經(jīng)在內(nèi)部積累了大約 20 多個優(yōu)秀的案例。在操作時長、用戶滿意度、首次使用成功率等方面都有明顯的成效。
.design：Ant Design不但追求『用戶』的使用體驗(yàn)，還追求『設(shè)計者』和『開發(fā)者』的使用體驗(yàn)，這非常感人。為此你們經(jīng)常會接收到設(shè)計者和開發(fā)者的體驗(yàn)反饋嗎？如何處理這些反饋？
螞蟻UED：截止今天，在 GitHub 上至少有 12，000 條反饋 issue ，我們會專門安排工程師和設(shè)計師值班處理這些反饋。其實(shí)，Ant Design 能走到今天，離不開社區(qū)的反饋和共建。
開放創(chuàng)新產(chǎn)品：為生態(tài)伙伴帶去更多價值
.design：你們研發(fā)的企業(yè)級產(chǎn)品，不僅作為內(nèi)部工具還慢慢對外開放，比如「語雀」，為什么要做語雀，它相比市面上的知識庫產(chǎn)品有什么特色和優(yōu)勢？
螞蟻UED：首先做語雀是為了滿足內(nèi)部用戶的大量文檔述求，在經(jīng)過三年的內(nèi)部捶打之后，語雀成為阿里內(nèi)部首選的文檔知識庫。之后，我們發(fā)現(xiàn)外部中小企業(yè)也有非常旺盛的文檔需求，本著螞蟻金服對外開放的大背景，語雀從去年開始正式對外服務(wù)，為我們的生態(tài)伙伴帶去更多價值。
至于特色和優(yōu)勢，知識庫屬于知識管理這個領(lǐng)域的一種產(chǎn)品，在這個領(lǐng)域有很多競爭對手，比如 Confluence 和?藍(lán)凌等專業(yè)軟件，它們都需要安排專人進(jìn)行維護(hù)，主要是重管理而輕創(chuàng)作和組織，大多數(shù)都是自上而下的管理方式。而語雀的優(yōu)勢在于，我們提供了一種輕盈的知識組織方式，不需要安排專門同學(xué)對接，任何人或團(tuán)隊(duì)都可以輕松的創(chuàng)作出他想要的內(nèi)容，同時以更優(yōu)雅的方式呈現(xiàn)給需要的人。在管理之余可以更高效率地完成在線協(xié)同。
.design：類似的創(chuàng)新產(chǎn)品還有哪些，簡單介紹一下？
螞蟻UED：云鳳蝶，http://www.yunfengdie.com/，一個基于 SaaS 模式的智能建站平臺。使用云鳳蝶將獲得自助建站，安全域名，站點(diǎn)托管，數(shù)據(jù)分析，和第三方營銷插件等服務(wù)。
Kitchen：http://kitchen.alipay.com/，一款為設(shè)計者提升工作效率的 Sketch 工具集。
一切用專業(yè)說話的團(tuán)隊(duì)：簡單、自由、有愛
.design：作為一支和前端技術(shù)團(tuán)隊(duì)在一起的設(shè)計團(tuán)隊(duì)，專為企業(yè)級產(chǎn)品的用戶體驗(yàn)，是否形成了一些獨(dú)特的團(tuán)隊(duì)文化？
螞蟻UED：一切用專業(yè)說話，簡單、自由、有愛。
.design：和前段技術(shù)團(tuán)隊(duì)需要密切配合的設(shè)計師們，應(yīng)該如何保證溝通通暢和話語權(quán)的掌握？
螞蟻UED：因?yàn)樵诩夹g(shù)體內(nèi)，平時大家也都坐在一起，所以和工程師在日常溝通上可以說還是比較通暢的，話語權(quán)的掌握這個問題，其實(shí)還是考驗(yàn)設(shè)計師的責(zé)任感與專業(yè)度。
.design：短短幾年從一個設(shè)計師到現(xiàn)在的60人團(tuán)隊(duì)的高速發(fā)展，這其中如何優(yōu)化人才結(jié)構(gòu)，保證團(tuán)隊(duì)適應(yīng)快速成長，有什么經(jīng)驗(yàn)可以分享？
螞蟻UED：首先，是建體系，解放重復(fù)勞動力，只有設(shè)計體系才有能把人員先從大量反復(fù)的工作中解放出來。逐漸的業(yè)務(wù)量和業(yè)務(wù)盤子就會起來，這個時候就是吸引人才，搭梯隊(duì)。最后是做專業(yè)影響力，吸引更多的人才。
.design：螞蟻金服體驗(yàn)技術(shù)部?UED歡迎什么樣的設(shè)計師加入你們的團(tuán)隊(duì)？
螞蟻UED：首先一定是專業(yè)度，不管是體驗(yàn)設(shè)計還是創(chuàng)意設(shè)計師，棒棒的作品一定是最好的敲門磚。其次，是一些溝通，協(xié)作等設(shè)計以外的軟實(shí)力。最后一點(diǎn)，做企業(yè)級產(chǎn)品的體驗(yàn)設(shè)計，很重要的一點(diǎn)是有一顆耐的住寂寞的心，我們的產(chǎn)品從idea，到產(chǎn)品化，到商業(yè)化，從服務(wù)內(nèi)部到普惠生態(tài)，往往是一個漫長的且磨人的過程，在這樣的環(huán)境里，謙遜、簡單、匠心非常重要。
.design：團(tuán)隊(duì)接下來有什么偉大計劃和小目標(biāo)？
螞蟻UED：短期內(nèi)我們正在籌備ant design 4.0的升級計劃，除了會完善更多企業(yè)級領(lǐng)域的設(shè)計資產(chǎn)之外，還會升級 ETCG 組件抽象的思路，同時嘗試性的邁出服務(wù)化的第一步。
長遠(yuǎn)來看，希望我們可以在企業(yè)級設(shè)計領(lǐng)域越做越好吧，極致提效的同時，探索更多體驗(yàn)實(shí)踐落地案例，積累好的設(shè)計服務(wù)能力，最終可以逐步的開放給同行們。
參考文獻(xiàn)：Ant Design 3.0 背后的故事
http://zhuanlan.zhihu.com/p/32746810
這就是用匠心打造良心設(shè)計體系和企業(yè)級產(chǎn)品和螞蟻金服體驗(yàn)技術(shù)UED，希望在這樣優(yōu)秀的大廠團(tuán)隊(duì)的技術(shù)探索和經(jīng)驗(yàn)分享能帶領(lǐng)國內(nèi)的設(shè)計行業(yè)走得更遠(yuǎn)。如果你想了解Ant Design，可以訪問官網(wǎng)http://ant.design/
|
