從新興設計工具動向探索發(fā)現(xiàn)體驗設計工具的發(fā)展趨勢

張運彬

中圖分類號：TB47 文獻標識碼：A

文章編號：1003-0069（2021）12-0104-03

引言

工欲善其事必先利其器一體驗設計工作開展中最重要的技術支持，即“器”，就是體驗設計工具。設計工具的發(fā)展與設計工作息息相關，極大程度上影響著設計師的成果輸出。從2010年開始，互聯(lián)網體驗設計工具進入了百花齊放時代，國內外不少獨立設計工具日趨成熟，新產品、新視角層出不窮。科學技術的硬件發(fā)展和互聯(lián)網的軟件支持促進了設計工具的不斷進化和發(fā)展，為體驗設計創(chuàng)作帶來了巨大的便利。基于此背景，規(guī)范設計工具行業(yè)市場、優(yōu)化提升用戶體驗，需要對當前設計工具發(fā)展動向進行整合梳理，并研究其發(fā)展趨勢，以引導和促進行業(yè)的良性發(fā)展。

一、國內外主流設計工具概況

（一）國內外現(xiàn)象級設計工具一覽

自1987年，Adobe Photoshop和Adobe llustrator橫空出世，成為第一現(xiàn)象級設計工具，開啟了互聯(lián)網設計工具的演進序幕，迅速占據(jù)用戶市場主導地位。無出其右，兩者至今仍是設計工作中不可或缺的重要工具。

從2010年開始，針對互聯(lián)網領域的垂直設計工具開始在國外興起，并逐漸進入激烈競爭階段，這一時期，出現(xiàn)了Sketch、Principle、Zeplin等實用設計工具，滿足了設計工作更加精細化的需求。

眾所周知，國內互聯(lián)網行業(yè)起步晚于國外，新技術也大多源自國外，因而國內的軟件行業(yè)幾乎是從傳統(tǒng)的桌面軟件時代直接跳躍到互聯(lián)網時代和移動互聯(lián)網時代的。國內設計工具的發(fā)展初期，無論是其類型還是功能上都屬于對國外設計工具的追隨和效仿，2010年后，隨著中國互聯(lián)網行業(yè)巨頭的崛起和國內技術水平的飛速發(fā)展，本土化設計工具發(fā)展態(tài)勢迅猛，并在國內市場需求基礎之上逐漸形成自身特色和發(fā)展方向。

2011年，國內第一款現(xiàn)象級設計工具——Teambition的誕生和廣泛應用標志著中國體驗設計工具本土化進程的開始，且其發(fā)展速度飛快。國內設計工具研發(fā)團隊分工更加細化，產研流程更加規(guī)范化，短短三年便追上國外設計工具近二十年的發(fā)展。2014年，“墨刀”“摹客”誕生，致力于提升全鏈路信息傳遞和交接效率的設計全流程平臺化工具出現(xiàn)，從此中國進入體驗設計工具平臺化的全新階段。隨著AI技術逐漸成熟，智能化設計工具通過深度學習+神經網絡，開始替代人力解決大量重復性工作，解放生產力。2016年“鹿班”的出現(xiàn)，使自動化和智能化工具由此進入大眾視野，登上階段舞臺。

（二）當前主流設計工具產品動向

1.設計系統(tǒng)全面升級

設計系統(tǒng)全面升級2020年國外主流設計工具的最新動向中，最關鍵的就是設計系統(tǒng)的全面升級。隨著用戶對工具的使用頻率增高、次數(shù)增長及數(shù)據(jù)的大量輸入，系統(tǒng)逐漸臃腫，導致工具性能問題暴露，頻繁出現(xiàn)系統(tǒng)漏洞及閃退，這是所有系統(tǒng)都會面臨的問題。因此，系統(tǒng)需要不斷的優(yōu)化和升級，設計工具系統(tǒng)也不例外。例如，Sketch的組建管理優(yōu)化、新增組建視圖模式及快捷調用窗口，設計系統(tǒng)變量完善，增加自動設計稿檢查功能。

2.產研協(xié)同生態(tài)構建

以在線協(xié)同工具Figma為例，其重點迭代主要是三個方向：在設計師層面，對設計系統(tǒng)管理優(yōu)化、升級原型制作動效能力以及優(yōu)化設計系統(tǒng)后臺數(shù)據(jù)監(jiān)測分析能力;在程序員層面，新增父子級查看和原型參數(shù)動效;在社會公眾層面，實現(xiàn)社區(qū)生態(tài)的全面升級，令用戶更好地與大型客戶共建物料市場、與更多的產品無縫連接。Figma功能迭代規(guī)劃是相對整體且領先的，特別是在設計流程中引入研發(fā)結構化思維，專注產研協(xié)作流程的優(yōu)化以及社區(qū)生態(tài)的構建令人矚目。

3.精細化深耕人工智能

Adobe Creative Cloud于2020年6月18日開展線上產品發(fā)布會，在產品展示上，著重顯示出對平面（PA、AI、ID）、攝影（LRC），數(shù)字影音（AE、PR）和用戶體驗（XD）四個方面的升級。整體而言，Adobe家族持續(xù)在精細化場景進行深耕，除了專業(yè)能力上的深入外，還利用人工智能和機器學習驅動其出色的優(yōu)化升級。

上述產品動向一定程度上反映出人們的工作方式已經隨著互聯(lián)網的發(fā)展而改變，使得設計產品的功能和形式也有相應地升級與優(yōu)化。尤其是社區(qū)生態(tài)、產研協(xié)同平臺及項目管理優(yōu)化等方面，都深刻體現(xiàn)了互聯(lián)網思維的影響，設計師們不再“單一作戰(zhàn)”，而是在有機生態(tài)中協(xié)作發(fā)展。

二、各類型新興設計工具動向梳理

（一）創(chuàng)新思維模型工具

以往的設計思維一直處于方法論階段，現(xiàn)在市面上出現(xiàn)了一些針對設計師團隊線上協(xié)作的設計思維工具，典型代表如：Miro、Creately3.0等。常見的是團隊協(xié)作白板服務，無論是頭腦風暴時常用的思維導圖、頭腦書寫、概念圖，還是資訊分析用的魚骨圖、價值鏈分析、PEST分析，這些工具提供了眾多一站式的高效免費模板，幫助團隊將想法快速變成洞見。

（二）設計稿自動校驗及糾錯工具

遵循設計規(guī)范輸出稿件、按照統(tǒng)一的規(guī)則整理命名、圖層組等，對于項目交接和多人協(xié)作場景具有重要意義。然而，在實際工作中，嚴格遵循這些規(guī)范輸出稿件具有一定困難性，其中最大障礙在于人工的檢查和調整需要耗費大量時間。如今市面上出現(xiàn)了如Design Lint（Figma插件）、Assistants（Sketch插件）、Toybox（Sketch插件）等能夠替代人力自動檢測設計稿質量的工具，通過智能分析，自動列出修改建議并生成報告，幫助設計師快速定位問題所在。

（三）用戶測試、數(shù)據(jù)反饋和追蹤工具

當前市面上存在一些類似Maze（多平臺插件）、Attention Insignt（Web在線工具）的新興設計工具，試圖將用戶測試能力有機地嵌入設計工作平臺，以便在完成設計之后，無縫隙進行用戶測試并獲得反饋，有序推進后續(xù)設計優(yōu)化。

（四）無障礙設計檢測工具

該類設計檢測工具專門為色盲、色弱群體設計師而生，提供色彩對比檢查器和色盲類型模擬器，供設計師快速檢驗設計是否符合無障礙設計標準，并提供不同的色盲類型模擬器來預覽顏色。該類工具較有代表性的有Stark-Contrast Checker（Figma插件）、Ally-Color Contrast Checker（Figma插件）。

（五）無代碼自助搭建工具

自助建站即無代碼應用構建工具，幫助非設計師、非前端的用戶通過一點簡單操作便能快速搭建真實的網站，這也是2020年設計工具發(fā)展的一大熱點動向。目前自助建站思路主要分為兩大陣營，一種是通過組件、模板代碼化，即組件搭建式自助建站，如：Appratio、Kepler、Slides 5等，用戶通過拖拽組件操作即可快速完成布局等功能，進行自定義設計。另一種是基于AI技術的圖片轉HTML的轉換器，也叫圖形智能轉碼建站，將草圖/圖片變成真實的網站，如Sketch2Code，背后支撐這一功能的是Micrsoft AI。

（六）3D、VR和動效制作工具

隨著3D、VR和動畫技術的普及，這類工具的市場需求量越來越大。目前出現(xiàn)的工具主要是主流設計工具插件的形式，提供快速生成或制作簡易的3D或動態(tài)效果，方便在UI排版中大量引入3D及動態(tài)元素，緊追流行趨勢。

（七）開源設計資產工具/平臺

當前市場上，各大設計資源網站基于自身豐富的設計資產，紛紛推出免費的圖標庫、插畫生成工具，可免費供個人和商業(yè)使用，更有基于主流的開源分享協(xié)議（Creative Commons）的CC版權圖片搜索引擎出現(xiàn)，如插畫類的Lottiefiles、Vector Creator等，圖片類的CCSearch等，以及圖標類的Icons88;這些工具的出現(xiàn)令設計師們在工作過程中收集所需要的設計素材更加便利和快捷，極大地提高了設計師的工作效率。

（八）團隊項目管理工具

長久以來，團隊項目管理這類企業(yè)生產力工具一直都是熱門發(fā)展產品。許多新興工具致力于在缺陷跟蹤、客戶服務、需求收集、流程審批、任務跟蹤、項目跟蹤和敏捷管理等工作領域提供更方便快捷的項目管理體驗，不斷向Jira等成熟工具發(fā)起沖擊，如Boardist、TaraAI。

綜上所述，觀察新興的設計工具動向，反映出當前設計工具在不斷優(yōu)化與完善：功能上不但有新增功能項，同時也在對前期遺漏及忽視的問題進行彌補。在當前設計工具動向中，存在明顯降低設計準入門檻的趨勢，更多非專業(yè)設計人士能夠參與設計。對于傳統(tǒng)的設計學科來講，設計往往依賴于設計專家一設計師，設計師及團隊通過個人的經驗、設計工具等手段，來為具體的或抽象的意識傳達、創(chuàng)作或服務;而將來的物聯(lián)網平臺將人與人、人與物、物與物有機的連接在一起，讓每個普通的人都可以通過物聯(lián)網的平臺進行“自創(chuàng)作”“自設計”。但這并不意味著設計水平的降低，相反，能夠廣泛地吸收更多不同領域的專業(yè)人才，為用戶體驗設計注入新血液、新力量。

三、體驗設計工具的未來發(fā)展趨勢

體驗設計工具的發(fā)展包含五大演進階段。第一，大型通用能力單體工具階段，即工具起步階段，以Adobe Photoshop和Adobe llustrator占據(jù)主導地位，常用于大型圖片的編輯和精細化圖像的設計，被各行各業(yè)廣泛應用;第二，細分垂直領域工具階段，針對用戶體驗領域的垂直化設計工具開始出現(xiàn)并替代傳統(tǒng)設計工具，解決精細化問題，如Sketch、Principle、Zeplin等;第三，云端化在線協(xié)作工具階段，隨著互聯(lián)網企業(yè)規(guī)模逐漸擴大，組織結構去中心化要求工具不受平臺和系統(tǒng)的限制，在線多人實時協(xié)作工具應運而生，F(xiàn)igma的出現(xiàn)標志云端化在線協(xié)作的階段開始;第四是平臺化工具階段，隨著團隊角色及分工不斷細化以及產研流程規(guī)范化，串聯(lián)設計全流程的工具平臺開始出現(xiàn);第五是自動化及智能化工具階段，依托強大的Al科技，智能化設計工具開始代替人力去解決大量重復性工作內容，極大解放了生產力。目前，關于設計工具的研究趨勢集中在利用互聯(lián)網和計算機軟件來進行產品的協(xié)同設計，以起到提高產品的設計效率和質量，節(jié)約產品開發(fā)的產本和規(guī)范項目的管理等作用。

基于以上對體驗設計工具發(fā)展階段歷程的洞察，結合對互聯(lián)網行業(yè)的新興設計工具動向的梳理與分析，對體驗設計工具的未來發(fā)展趨勢做出如下預測。

（一）工具細分場景深耕，領域精細化運營

設計工具的分類方式將發(fā)生轉變，不同于以往按照工具的不同功能屬性劃分，如偏向于圖片處理的PS、偏向于動畫處理的Flash等，現(xiàn)階段工具出現(xiàn)了按照產業(yè)領域、按使用場景細分的趨勢，如軟件產業(yè)（互聯(lián)網領域）、建筑領域、制造業(yè)等行業(yè)的工具應用。此轉變體現(xiàn)出不同的功能屬性與領域產生深度融合，從而催生出多種精細化運營的變體，許多小而美的垂直工具興起并逐漸替代大而全的傳統(tǒng)設計工具。未來，工具領域將會越來越往精細化領域發(fā)展，每一個細分的場景都將有對應的工具，如Principle作為高保真動態(tài)原型制作工具，在互聯(lián)網行業(yè)受到廣泛認可。

（二）基于Web的工具線上化，多人實時在線協(xié)同

從早期的文檔類在線協(xié)同軟件Google Docs到在線團隊管理軟件Slack，再到基于Web的大型UI設計工具Figma，工具不斷線上化發(fā)展是基于網絡技術的不斷升級以及行業(yè)擴張的剛性需求出現(xiàn)的。工具線上化具備可跨平臺、云端協(xié)同、版本可控制三大優(yōu)勢：基于Web的在線化解放了全平臺數(shù)據(jù)可觸達能力，打破系統(tǒng)和終端壁壘;同時，隨著團隊規(guī)模擴大，出現(xiàn)跨地域、跨時區(qū)、跨部門、跨角色等復雜場景，工具的在線功能解決了多人實時協(xié)同工作的剛需;在版本控制方面，工具在線可在云端自動記錄工作路徑，按時間點追溯，不需要保存多版本文件，也不用擔心記錄丟失，更易于項目管理。由此可見，未來設計工具的發(fā)展，線上化、多人協(xié)同將成為必然趨勢。

（三）縮短“設計”與開發(fā)之間的鴻溝

設計師和開發(fā)者領域不同，其思維方式、使用工具和產出物各不相同，導致二者在協(xié)作過程中始終存在鴻溝，設計稿和代碼之間的轉化效率和質量依然是業(yè)界困擾的問題。當前市面上已有產品通過不同方式和切入角度試圖縮短“設計”與“開發(fā)”之間的鴻溝。

1.將代碼結構化思維引入設計工具：Figma近期將設計系統(tǒng)的組織形式結構化，讓設計師可以組合同一組件的多種變體，從而簡化資產面板并更緊密地將組件映射到代碼。“自動布局”功能則引入了接近CSS Box模型和Flexbox在Web上的工作方式。這兩個新功能都體現(xiàn)了Figma擁抱“產研全局思維”的嘗試。

2.設計稿件與代碼綁定，連接產研流程：通過將“研發(fā)組件”與“設計稿件”綁定，將設計研發(fā)物料納入統(tǒng)一的管理流程中，打通產研流程;例如Zeplin在今年也更新了設計組件（UI components）、綁定代碼（React components）的功能，讓研發(fā)在查看設計稿切圖和標注時，可直接訪問已經代碼化的組件詳情，提升前端開發(fā)效率。

3.可配置標準組件庫解決設計還原度問題：定制化的組件庫分別向設計師和前端兩個角色分發(fā)，產研共用一套標準組件庫從而解決設計還原度問題。設計側通過html2svg技術把組件直接轉換為svg文件，讓設計師直接在Sketch獲取和使用配置平臺上的標準組件;研發(fā)側則是直接使用配好的組件搭建頁面，前端不需要關注組件UI還原度問題，因為還原度有問題等于設計在平臺UI定制的問題。

4.Design to Code（D2C）設計稿：一鍵生成代碼，市面上基礎的D2C主要出現(xiàn)在設計交付前端工具中，如藍湖、Zeplin，主要功能是導出靜態(tài)頁面代碼（HTML+CSS）。其存在問題有代碼結構不合理、可維護性差。目前業(yè)內討論較多的是圖片生成代碼的能力：通過智能化手段將各種視覺稿一鍵生成可維護的前端代碼，切實提高前端的開發(fā)效率。

縮短設計與開發(fā)之間的鴻溝，既是未來提高設計工作效率的必然要求，也是設計工具發(fā)展的重要趨勢。

（四）設計工具應用更開放

設計工具發(fā)展在渠道、系統(tǒng)、應用方面呈現(xiàn)更為開放的趨勢，主要體現(xiàn)在以下四個方面。

1.系統(tǒng)開放：工具主體輕量化及API接口和插件生態(tài)系統(tǒng)開放：Sketch和Figma之所以成為最受歡迎的UI設計應用程序，海量的插件支持功不可沒，這兩款工具最大的優(yōu)勢之一在于龐大的插件庫，從快捷工具到流行應用程序關聯(lián)插件，每個功能點都能找到一些插件擴展。未來更多工具會如Sketch和Figma，主端具備最核心的基礎功能和開放能力，而其他各領域的場景需求則要靠第三方的嵌入市場來解決。

2.平臺開放：全鏈路覆蓋的工具平臺化：未來設計工具將不僅僅聚焦設計產出本身，而是不斷向設計的上下游延伸，打通工作的流程中的各個節(jié)點，連接和傳遞每個節(jié)點產出物、打通信息流，從設計研究→設計創(chuàng)作→代碼實現(xiàn)→項目&資產管理，做到全流程全角色全場景覆蓋，形成一個更低成本、更便捷的團隊協(xié)作模式。

3.資產共創(chuàng)：工具能力+UGC模式營造內容生態(tài)圈：近幾年設計資產開源共創(chuàng)逐漸成為新的趨勢，如百度Echarts的發(fā)展離不開其背后內容貢獻者（UCG）的無私貢獻，這些貢獻者有著不同的技能，甚至來自不同的崗位和公司，他們的分享面向整個行業(yè)。國外如Lottiefiles Freepick、Ons8等大型素材平臺也在逐漸開放免費插畫工具，試圖跑通工具能力+UGC共創(chuàng)模式。

4.應用開放：打破行業(yè)壁壘，設計全民普惠化：未來，任何設計領域的工具都將呈現(xiàn)兩極化發(fā)展：專業(yè)向和普適向，就像單反和美顏手機的區(qū)別，專業(yè)類提供高級功能，學習成本高;普適向則意味著設計工具將變得越來越容易使用，廣大非專業(yè)人士能夠零門檻快速上手，通過少量的選項配置即可生成專業(yè)設計方案，幫助非專業(yè)用戶輕松完成一些基礎的設計需求?？傮w來說設計工具更加傾向“易用化”，以讓設計工作更加方便快捷為目的，減少大量不必要的人力，有效提高設計工作效率。

（五）設計工具體驗更智能

在互聯(lián)網行業(yè)飛速發(fā)展的當今時代，人工智能領域的發(fā)展日新月異，已經逐步滲透到體驗設計工具的發(fā)展當中。

1.設計工具智能化：設計工具智能化發(fā)展是未來行業(yè)將會長期投入研究與發(fā)展的必然趨勢。智能設計工具的本質特征之一是其能夠與人類進行互動，其重要價值在于解放人類設計師的雙手以促進其提升自身核心競爭力，以及打破設計知識與理念傳播的壁壘。未來高級智能工具將具備以下特點：通過理解情景或語境，匹配設計師的意圖和需求，甚至對設計師的方案進行判斷、優(yōu)化與反饋;根據(jù)輸入指令生成多種衍生設計方案;擁有自主決策評估能力;積累個性化數(shù)據(jù)，實現(xiàn)千人千面;基于數(shù)據(jù)進行思考和趨勢預測;自主學習，能夠不斷自我迭代優(yōu)化算法等。

2.出現(xiàn)國內需求定制及企業(yè)服務大浪潮：未來大量的新興設計工具會從中國市場萌芽，一方面是由于中國粗獷增量市場已到盡頭，企業(yè)數(shù)字化轉型迫在眉睫;另一方面中國市場足夠龐大和復雜，帶有中國本地特色的需求是海外軟件無法滿足的，因此國內市場在獨立設計工具方面、模塊化思維解決企業(yè)定制問題以及企業(yè)自研工具方面將同時展開競逐。由此，設計工具的發(fā)展將會更智能地貼合國內市場體驗需求。

結語

任何工具發(fā)展的根本原因都在于使用者不斷提出的新需求，設計工具也不例外。體驗設計工具為用戶體驗行業(yè)的設計工作提供了強大的技術支持作用，其發(fā)展極大地推動了行業(yè)設計工作的進步，提高了設計師的工作效率，使得行業(yè)能夠為用戶輸出體驗更佳的產品。本文基于當前新興設計工具的發(fā)展動向，結合當前行業(yè)設計思維、工作方式與用戶體驗思維等，對體驗設計工具進行了功能整合分析并對其發(fā)展趨勢進行預測，發(fā)現(xiàn)在體驗設計工具為優(yōu)化用戶體驗而進行不斷升級迭代的過程中，處處體現(xiàn)了人與技術的有機統(tǒng)一與融合，可以預見，在未來的設計工作中，設計工具會基于滿足體驗需求的條件而不斷優(yōu)化發(fā)展，而先進的體驗設計工具也將會在設計全流程的工作中發(fā)揮重要作用。