從新興設計工具動向探索發現體驗設計工具的發展趨勢

張運彬

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

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

引言

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

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

（一）國內外現象級設計工具一覽

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

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

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

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

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

1.設計系統全面升級

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

2.產研協同生態構建

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

3.精細化深耕人工智能

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

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

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

（一）創新思維模型工具

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

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

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

（三）用戶測試、數據反饋和追蹤工具

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

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

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

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

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

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

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

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

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

（八）團隊項目管理工具

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

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

三、體驗設計工具的未來發展趨勢

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

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

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

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

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

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

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

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

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

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

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

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

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

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

設計工具發展在渠道、系統、應用方面呈現更為開放的趨勢，主要體現在以下四個方面。

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

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

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

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

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

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

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

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

結語

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